240425 TIL javascript

웅웅·2024년 4월 25일

TIL 웹개발

목록 보기
8/23

1. 형 변환

(1) 암시적 형 변환(implicit coercion)

console.log(1 + "2");   // "12"
console.log("1" + true);   // "1true"
console.log("1" + {});   // "1[object Object]"
console.log("1" + null);   // "1null"
console.log("1" + undefined);   // "1undefined"

console.log(1 - "2");   // -1
console.log("2" * "3");   // 6
console.log(4 + +"5");   // 9

console.log(Boolean(0));   // false
console.log(Boolean(""));   // false
console.log(Boolean(null));   // false
console.log(Boolean(undefined));   // false
console.log(Boolean(NaN));   // false

console.log(Boolean("false"));   // true
console.log(Boolean({}));   // true

(2) 명시적 형 변환(explicit coercion)

console.log(String(123));       // "123"
console.log(String(true));      // "true"
console.log(String(false));     // "false"
console.log(String(null));      // "null"
console.log(String(undefined)); // "undefined"
console.log(String({}));        // "[object Object]"

console.log(Number("123"));   // 123
console.log(Number(""));      // 0
console.log(Number("  "));    // 0
console.log(Number(true));    // 1
console.log(Number(false));   // 0

2. 연산자

(1) 산술 연산자
더하기를 제외하고는 모두 Number 형태로 명시적 변환이 된다.
더하기의 경우에한 String 형이 우선적으로 출력된다.
+, -, *, /, %

console.log(2 + 3);       // 5
console.log("2" + "3");   // "23"
console.log("2" + 3);     // "23"
console.log(2 + "3");     // "23"

(2) 할당 연산자
=, +=, -=, *=, /=, %=

(3) 비교 연산자
다른 프로그래밍 언어들과 비교했을 때 특이하다 생각했던 것이 바로 이것인데, 일치 연산자는 등호를 세 번 쓰고, 불일치 연산자는 느낌표와 등호 두 번을 쓰는 점이 달랐다

console.log(2 === 2);   // true
console.log("2" === 2);   // false
console.log(2 !== 2);   // false
console.log("2" !== 2);   // true

위의 두 가지 비교 연산자를 제외하고는 타입이 다를 경우 (Str 타입과 혼용될 경우) 자동으로 Num 타입으로 변형된다.

(4) 논리 연산자
&&, ||, !

(5) 삼항 연산자
(조건식) ? (true일 경우의 값) : (false일 경우의 값)

(6) 타입 연산자
typeof 변수명

3. 함수

(1) 함수 선언문

function add(x, y) {
  return x + y;
}

console.log(add(2, 3));   // 5

(2) 함수 표현식

let add = function(x, y) {
  return x + y;
}

console.log(add(2, 3));   // 5

이 아래부터 나오는 화살표 함수, 조건부 실행, 단축 평가의 내용은 조금 생소하여 여러 번 연습해보아야 할 것 같다.
(3) 화살표 함수

let add = (x, y) => {
  return x + y;
}
let add = (x, y) => x + y;

4. 조건부 실행

let x = 10;

(x > 0) && console.log("x는 양수입니다.");

5. 삼항 연산자와 단축 평가

let x;
let y = x || 10;

console.log(y);   // 10

6. falsy / truthy

0, 빈 문자열, null, undefined, NaN는 falsy한 값이며 그 외의 값(객체, 비어있지 않은 문자열, 0을 제외한 숫자)들은 모두 truthy한 값이다.

0개의 댓글