본문 바로가기

FrontEnd/JavaScript44

[ JavaScript ] spread vs rest (feat. 비구조화 할당) Spread Operator ...spread : 펼치다, 퍼뜨리다 객체, 배열을 펼칠 수 있습니다. 객체에서 사용 가능합니다. (Object.assign() 대체) const slime = { name: '슬라임' }; const cuteSlime = { ...slime, attribute: 'cute' }; const purpleCuteSlime = { ...cuteSlime, color: 'purple' }; console.log(slime); //{name: '슬라임'} console.log(cuteSlime); //{name:'슬라임',attribute:'cute'} console.log(purpleCuteSl.. 2023. 10. 25.
[ JavaScript ] var vs let vs const (feat. 호이스팅, TDZ) var 변수 선언 키워드 함수 레벨 스코프를 가지고 있다. 중복 선언이 가능하다. var name = 'hello' var name = 'hi' console.log(name) // hi 호이스팅 당한다. 생략이 가능하다 => 함수가 선언한 환경의 this에 영향을 받는다. 일반적인 웹 환경에서는 window일 것이다. let 변수 선언 키워드 블록 레벨 스코프를 가지고 있다. 중복 선언이 불가능하다. 호이스팅 당한다. function sayHello() { return name } let name = 'hi' console.log(sayHello()) // hi 생략이 불가능하다. (생략하면 var 처럼 작동) const 상수 선언 키워드 => const자체가 값을 불변으로 만드는 것이 아니다. => .. 2023. 10. 25.
[ JavaScript ] super() (feat. 클래스) 보호되어 있는 글 입니다. 2023. 10. 25.
[ JavaScript ] 단축 평가 short-circuit evaluation 논리 계산법 단축 평가 표현식을 평가하는 도중에 평가 결과가 확정된 경우 나머지 평과 과정을 생략하는 것을 의미한다. 논리 연산의 결과를 결정하는 피연산자를 타입 변환하지 않고 그대로 반환한다. 논리곱 연산자 && 연산자 두 개의 피연산자가 모두 truthy로 평가될 때 truthy값 반환한다. 하나라도 falsy 인 경우, falsy값을 반환한다. 좌항에서 우항으로 평가가 진행된다. 논리합 연산자 || 연산자 두 개의 피연산자 중 하나만 truthy 로 평가되어도 truthy값을 반환한다. 두 개 모두 falsy 인 경우, 마지막 falsy 값을 반환한다. 좌항에서 우항으로 평가가 진행된다. && 와 || 이 혼합되어 있는 경우 논리곱 연산자(&&)가 논리합 연산자(||)보다 우선 순위가 높다. 'abc' && '.. 2023. 10. 25.
[ JavaScript ] require() vs import() require() import() cjs esm 보간 가능 보간 불가능 어느 지점에서나 호출 가능 파일 최상단에서 호출(작성)해야 한다 type: object => 객체비구조할당 가능 type: module => 객체비구조할당 불가능 동적 정적 함수로 사용하면(동적으로 사용하면) 프로미스 객체 반환 2023. 10. 25.
[ JavaScript ] switch문에서 비교연산자 사용하기 불가능 var age = prompt("Enter you age"); switch (age) { case =13: alert("You are old enough to play"); break; } 가능 switch (true) { case (age = 13): alert("You are old enough to play"); break; } 2023. 10. 25.