자바스크립트 배열 내 조건에 맞는 원소 구하기 (every, some 함수)

https://heytech.tistory.com/219 [JavaScript] 배열 내 조건에 맞는 원소 구하기(every, some 함수) 💡 목표 JavaScript에서 배열 내 조건에 맞는 원소를 구하는 방법에 대해 학습한다. 1. every 함수: 모든 원소의 조건식 만족 여부 확인 함수 원형 배열.every(조건식 함수) every 함수는 배열 내 모든 원 heytech.tistory.com 위 자료를 읽고 작성한 글 입니다. 자세한 내용은 위 자료를 참고해주세요. every every 함수는 배열 내 모든 원소가 조건을 만족하면 true 를 하나라도 불만족 할 경우 false를 반환합니다. let arr1 = [1, 30, 39, 29, 10, 13]; function everyFunctio..

Object.getOwnPropertyNames() vs Object.keys()

공부 하다가 궁금해졌다.. 이녀석들이 차이.. const screen = { branch: 'Dell', size: '27inch', }; Object.getOwnPropertyNames(screen); // ['branch', 'size'] Object.keys(screen); // ['branch', 'size'] 그냥 객체로만 메서드를 사용했을때는 별 차이가 없어보인다. 그런데 defineProperties 로 추가했을때 enumerable: false 라면 keys 메서드에서는 출력되지않는다. Object.defineProperties(screen, { resolution: { enumerable: false, value: '2560 x 1440', }, }); var a = {}; Object...

자바스크립트에서 !! 을 사용한 명시적 형변환

코드 리뷰에서 다른분들 코드를 보면서 다음과 같은 궁금증이 생겼다. 내 궁금증은 다음과 같았다. 저렇게 not 연산자를 두번사용해야하는 경우가 따로 있나요? if 문에 그냥 undefined 가 들어가더라도 해당 if문은 동작을 하지 않을 것이라고 생각하는데, 분명 이유가 있어서 저렇게 쓰셨을텐데 잘 이해가 안갑니다. 실무를 할때 저런코드를 사용한다고 하시니 더더욱 알고싶어서 부득히 하게 메일까지 드리게되었습니다. 그렇다 저 로직을 짜신분의 메일로 해당 궁금증을 보냈는데, 정말 친절하게 답변해주셨다. Answer !! 를 사용하는 이유는 "명시적 boolean 형변환" 을 위함입니다. 말씀 주신대로 if (undefined) {...} 나 if (!!undefined) {...} 나 코드의 기능은 완전히..

자바스크립트의 null type 에 대한 궁금증

공부를 하던중에 null이 할당된 변수의 type을 다루게 되었다. 코드는 다음과 같다. 위 코드를 실행하면 "first"가 출력이 된다. 그런데 궁금증이 생겼다. 왜 null 이 할당이 되었는데 object 로 primitive type이 나오게 되는걸까? 그래서 오픈채팅방에 질문을 드렸다. 답변은 다음과 같다. js 가 설계될때 모든 것은 object라고 설계가 되어있다. null 뿐만 아니라 배열 또한 마찬가지이다. 그러므로 만약 위와같은 상황에서 null 일때는 내가 원하는 로직이 되지 않을 가능성이 크기 때문에 다음 코드 처럼 short-cut evaluation을 사용해서 null일때 아닌지를 구별해주거나, !!를 사용해서 형변환을 해준다. if(yourVariable != null && ty..

typeof , instanceof 에 대한 공부

출처: https://unikys.tistory.com/260 [All-round programmer:티스토리] [Javascript] typeof 와 instanceof의 차이, 타입 또는 클래스 구분하기 * typeof와 instanceof는 어떠한 변수가 문자열인지아닌지, 특정한 객체인지 아닌지 판단할때 사용하는 '연산자'들이다. 이들 둘이 어떻게 다른지 살펴보고 사용하면서 있을 수 있는 약점들도 같이 unikys.tistory.com 위 자료를 타이핑하며 정리한 내용입니다. 자세한 내용은 위 자료를 참고해주세요. typeof 와 instanceof는 어떠한 변수가 문자열인지아닌지, 특정한 객체인지 아닌지를 판단할때 사용하는 '연산자'들이다. 이들 둘이 어떻게 다른지 살펴보고 사용하면서 있을 수 있..

React Radio 버튼에서 value 값 얻기

다음과 같은 UI에서 라디오 버튼을 선택할때에 각각에 Radio 버튼에 할당한 value 값을 얻고 싶었다. state 변수를 선언한다. onChange 함수를 만든다. input tag에 value와 onChage를 사용해서 state를 변경한다. const [TTL, setTTL] = useState(''); const onChangeRadio = (e: any) => { setTTL(e.target.value); };

How Browser Works - 어떻게 브라우저는 동작하나.

#How Browser Works 유저가 URL을 입력 유저가 URL 을 입력했다. DNS Lookup domain을 입력 했을 경우 user의 hosts, 또는 DNS cache를 확인 하여 있을 경우 해당 address를 리턴, 아닐 경우 DNS Server로 요청을 전송한다. DNS Server의 Recursive Resolver가 TLD(Top-Level-Domain \[.com, .net\]) 등으로 도메인의 네임서버를 요청 해당 서버가 확인하여 해당 nameserver의 ip를 리턴한다. 그 후 브라우저가 웹에 다시 전달하여 해당 ip로 요청을 보낸다. TCP HandShake 그 후 브라우저는 서버간 통신을위해 개발된 매커니즘인 TCP 3Way HandShake 를 전송. SYN(시퀀스) -..

자바스크립트의 인스턴스(Instance)란?

참고자료 Javascript의 인스턴스(Instance)란? 비슷한 성질을 가진 여러개의 객체를 만들기 위해, 일종의 설계도라고 할 수 있는 생성자 함수(Constructor)를 만들어 찍어내듯 사용하는데 이렇게 생성된 객체를 인스턴스라 부를 수 있다.좀 더 알 velog.io 위 자료를 타이핑하며 공부한 글입니다. 자세한 내용은 위 자료를 참고해주세요. 비슷한 성질을 가진 여러개의 객체를 만들기 위해, 일종의 설계도라고 할 수 있는 생성자 함수(Constructor)를 만들어 찍어내듯 사용하는데 이렇게 생성된 객체를 인스턴스라 부를 수 있다. 위 글의 글쓴이님은 칼 만드는 과정에 비유하셨는데, 생성자함수(Constructor) = 거푸집 인스턴스 = 거푸집으로 찍어낸 칼 function Sword(co..

자바스크립트 템플릿 리터럴 (Template literals)

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Template_literals Template literals - JavaScript | MDN 템플릿 리터럴은 내장된 표현식을 허용하는 문자열 리터럴입니다. 여러 줄로 이뤄진 문자열과 문자 보간기능을 사용할 수 있습니다. 이전 버전의 ES2015사양 명세에서는 "template strings" (템플릿 문 developer.mozilla.org 이글은 MDN 문서를 타이핑하며 공부한 글입니다. Template literals 템플릿 리터럴은 내장된 표현식을 허용하는 문자열 리터럴입니다. 여러 줄로 이뤄진 문자열과 문자 보간기능을 사용할 수 있습니다. Syntax `string text` `..

자바스크립트에서 사용자정의 생성자함수

https://yookeun.github.io/javascript/2015/03/08/javascript-construct/ Javascript에서 사용자정의 생성자함수 자바스크립트에서 객체를 만드는 방법중에 객체 리터럴, new Object(), 그리고 생성자함수를 통해 만드는 방법이 있다. 가장 좋은 것은 객체 리터럴이고, 쓰지 말아야 하는 것은 new Object()를 통해 객 yookeun.github.io 해당글은 위 자료를 타이핑하며 공부한 글입니다. 자세한 내용은 위 자료를 참고해주세요. 사용자 정의 생성자함수를 만들어보자. var Person = function(name) { this.name = name; this.say = function() { return "Hello, my name..