TIL 20220104

ES2021 자바스크립트 강좌 - 제로초

2-6 불 값(boolean, 값들의 비교)

> NaN == NaN;
< false

NaN끼리 비교는 false, 유일하게 같은것끼리 비교하는데 false나옴

> true>false;
< true

true와 false는 숫자로 변형하면 1과 0이라 true가 false보다 큼

> 'abc'<5; //NaN < 5;
< false

문자열 abc를 숫자로 자동형변환하면 NaN, NaN과의 비료는 false이므로 결과값이 false

2-8 undefined와 null

undefined는 보통 반환할 결과값이 없을 때 나온다
null은 의도적으로 빈값을 넣을때 사용한다

> undefined == null;
< true
> undefined === null;
< false

undefined와 null은 같지 않다

> !!null; //null의 불 값으로 형변환하면 false
< false

> null == false;
< false

> null == 0;
< false

> null == '';
< false

null은 false와 같지 않다. 다른 거짓인 값들과도 같지 않다

> type of null;
< "object"

결과값이 null이 아닌 object, 자바스크립트 초창기 버그이다.
따라서 값이 null인지 확인하기 위해서는 ===null을 사용해야 한다

2-10 변수명 짓기

제로초님이 변수명 짓기에서 예약어 오류나는거 궁금하면 구글링해보래서 해봄
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Lexical_grammar#keywords
참고 사이트 - 예약어 & 미래예약어

> var let;
< undefined

> let let ;
< Uncaught SyntaxError: let is disallowed as a lexically bound name

> let class;
< Uncaught SyntaxError: Unexpected token 'class'

> 'use strict';
> let class;
< Uncaught SyntaxError: Unexpected strict mode reserved word

var let;이 가능한 이유

var는 let이 생기기전 스크립트,그때는 let이 예약어가 아니였음 var에 let이 안되게 패치할 경우 버그발생 우려가 있어서 허용
개발 단톡 추가답변: 자바스크릡트 파서는 es5 문법을 사용하지 않으면 es3 문법으로 파싱을 하기 때문에 let은 < es5에서 예약어가 아닙니다

reserved words 예약어

예약어를 선언할 경우 (Reserved keywords)
Uncaught SyntaxError: Unexpected token 'break'
미래 예약어를 선언할 경우 (Future reserved keywords)
Uncaught SyntaxError: Unexpected reserved word
strick모드에서만 에러가 나는 예약어도 있음.

Lexical Binding

> let let ;
< Uncaught SyntaxError: let is disallowed as a lexically bound name
  
> 'use strict';
> let let;
< Uncaught SyntaxError: Unexpected strict mode reserved word

Lexical Binding관련해서는
https://www.gnu.org/software/emacs/manual/html_node/elisp/Lexical-Binding.html
문서가 있으나 너무 어려움.. 다음에 공부하기로
개발 단톡 추가답변: 엔진이 Parse한 후에 Analyze 하는 부분에서 나오는 에러입니다. 결국 'es5 이상 레벨 Analyzer에서 해당 이름을 예약어로 지정해서 허용하지 않겠다' 라는 뜻입니다

strict 모드에서는 예약어 오류가 뜨긴 한다.

2-11 변수 수정하기

식/문

> let change = "바꿔";
< undifined
> change = "또바꿔";
< "또바꿔"

let은 선언문, 문은 식과 다르게 결과값이 없고 식의 자리에 사용할 수 없다.
변수에 대입할때는 식이라서 대입한 값이 결과값으로 출력됨.

빈값 설정

빈값 설정할때는 undefined말고 null을 쓴다
undefined는 기본값으로도 쓰이지만 null은 아녀서 개발자가 넣은것이기 때문

구조분해할당

let a = 5;
let b = 3;
[b, a] = [a, b] //구조분해 할당으로 서로 바꾸기 가능

2-22 배열 매서드

배열 수정

target.unshift('가'); //맨앞 추가
target.push('바'); //맨뒤 추가
target.pop(); //마지막 요소 제거
target.shift(); //첫번쨰 요소 제거
target.splice(1, 1); // .splice(시작인덱스, 제거할 요소 개수);
target.splice(1); // 시작인덱스부터 끝까지 제거
target.splice(1, 3, '타', '파'); //.splice(시작인덱스, 제거할 요소 개수, 넣을 값)

요소확인

target.includes('카'); //배열에 해당 값 있는지 여부를 true,false로 반환
target.indexOf('가'); //앞에서부터 몇번째에 있는지
target.lastIndexOf('라'); //뒤에서부터 몇번째에 있는지

2-24 함수 기본

function a(){} //함수 선언문
const b = function() {}; //함수 표현식
const c = () =>{}; //함수 표현식인 화살표 함수