코테 준비와 함께 JS기본기를 탄탄히 하고자 작성.
자바와 달라서 한 번쯤 짚고 넘어갈 필요가 있거나 내가 몰랐던 JS 기본 문법들을 정리
본 내용은 모두 https://ko.javascript.info/ 내용을 참조하여 작성
형 변환 (Type Conversion)
함수와 연사자에 전달되는 값은 대부분 적절한 자료형으로 자동 변환.
의도적으로 변환(명시적 변환)하고자 하는 경우를 아래에서 서술
// 문자형 변환
let val = 10;
val = String(val);
// 숫자형 변환
let val = "123";
val = Number(val);
// 숫자 이외의 글자가 들어가는 경우 그 결과는 NaN 반환
// null -> 0 / true & false -> 1 & 0
// 숫자가 될 문자열 앞에 +를 붙여서 변환할 수도 있다.
// 불린형 변환
Boolean(1) // true
Boolean(0) // false
Boolean("String") // 문자열O -> true 문자열"0"도 true 반환
Boolean("") // 빈 문자열 false
nullish 병합 연산자 (nullish coalescing operator)
nullish 병합연산자 ?? 사용 시 짧은 문법으로 여러 피연산자 중 그 값이 확정되어있는 변수를 찾을 수 있다.
즉 a ?? b 일 때 다음과 같이 해석된다.
- a가 null도 아니고 undefined도 아닌 경우 a
- 그 외의 경우는 b
해당 병합연산자 없이 표현하고자 할 경우 다음과 같이 표현된다.
x = (a !== null && a !== undefined) ? a : b;
다른 예시로 이름 및 닉네임을 받는데, 사용자가 아무런 정보를 입력하지 않는 케이스를 허용 할 때 작성될 수 있는 코드를 확인해보자
let name = null;
let nicName = "Developer";
// null이나 undefined가 아닌 첫번째 피연산자
let user = name ?? nicName ?? "익명의 사용자";
??와 ||의 차이
- || 는 첫 번째 truthy 값을 반환
- ?? 는 첫 번째 정의된(defined) 값을 반환
null과 undefined, 숫자 0을 구분해 다뤄야 할 경우 이 차이점은 매우 중요한 역할을 한다.
let height = 0;
console.log(height || 100); // 100
console.log(height ?? 100); // 0
```
||는 0을 falsy 한 값으로 취급. 반면 ??는 정확하게 null값이거나 undefined일 경우에만 100이 된다.
- 안정성 이슈로 인해
??는 &&나 ||와 함께 사용하지 못한다. 혼합하여 사용할 경우 SyntaxError를 마주할 수 있게 되며, 이러한 제약을 피하려면 괄호를 사용해야한다.