Deep Dive 6-9 [데이터타입 | 연산자 | 제어문 | 타입변환과 단축 평가]

6장. 데이터타입

 

1) 원시타입

a) 숫자 타입

- 숫자 타입 값은 모든 수를 실수로 처리 (정수만 표현하는 타입 x)

- 2진수, 8진수, 16진수로 표현해도 참조할 때는 10진수로 해석됨

- Infinity, -Infinity, NaN

b) 문자열 타입

- 자바스크립트에서 문자열은 원시 타입이며, 변경 불가능한 값(immutable value)임

c) 템플릿 리터럴 

- 런타임에서 일반 문자열로 변환되서 처리됨

 

2) 객체타입

 

 

-----------------

 

* 데이터 타입 필요성?

1. 메모리 공간 확보 -> 낭비, 손실 줄임 (데이터 타입에 따라 공간의 크기 결정)

- 식별자를 통해 값이 저장되니 메모리 주소의 선두 메모리 셀 주소를 찾아감

-> 데이터 타입에 따라 선두~ 해당하는 셀 크기 만큼 읽어들임 (숫자 -> 8byte)

2. 2진수를 숫자 or 문자로 해석할지 결정

 

자바스크립트는 동적 타입 언어 (선언이 아닌 할당에 의해 타입이 결정) : 재할당에 의해 언제든지 동적으로 변할 수 있음

-> 유연성은 높지만, 신뢰성은 떨어짐

** 중요 -> 변수 최소화, 스코프는 최대한 좁게, 전역변수는 최대한 사용하지 않기, 변수보다는 상수를 사용하기, 네이밍을 직관적으로!

 

 

 

7장. 연산자

- 연산자 : "피연산자를 연산하여 새로운 값을 만든다" (값으로 평가)

 

1. 산술 연산자 (불가능? NaN 반환)

- 모든 이항 산술연산자(2개의 피연산자 연산)는 피연산자의 값을 변경하는 side effect가 없음

- 숫자 타입이 아닌 피연산자에 + 사용하면 숫자 타입으로 변환한 값을 생성해서 반환(side effect 없음)

 

*암묵적 타입 변환 / 타입 강제 변환

- false, null -> 0

- true -> 1

- +undefined  = NaN

 

2. 할당 연산자

- side effect 있음 

- 할당문 x = 10 은 값으로 평가되는 표현식으로, 할당된 값인 10으로 평가됨

a = b = c = 0;

 

따라서 할당문을 다른 변수에 할당해서 연쇄 할당 가능함

 

 

3. 비교 연산자

- side effect x

- 동등비교/일치비교

NaN -> 빌트인 함수 Number.isNaN으로 검사 (NaN === NaN => false, Object.is로 검사하기)

 

4. 삼항 조건 연산자

- 값처럼 사용할 수 있음 (if else 문은 값처럼 사용 불가)

- 변수에 할당할 수 있음!

 

typeof null //object -> 일치 연산자로 비교하기

 

 

8장. 제어문

1. 블록문: 중괄호로 묶음, 자바스크립트가 블록문을 하나의 실행 단위로 취급함

2. 제어문 : if else, switch

3. 반복문

- for (;;) {...} 무한루프

- for : 반복 횟수가 명확할 때, while: 반복 횟수가 불명확할 때 사용

 

- 레이블 문 (외부 for 문을 탈출하고 싶을 때, 중첩 루프에만 유용하며 다른 때는 쓰지 x)

outer: for(var i =0; i < 3; i++) {
  for(var j = 0;j < 3; j++){
    if (i + j === 3) break outer;
    console.log(`inner [${i}, ${j}]`);
  }
}

console.log('Done!');

 

*반복문 대체

- 배열 순회 : forEach

- 객체 프로퍼티 열거 : for - in

- 이터러블 순회 : for - of

 

 

9. 타입 변환과 단축 평가

- 암묵적 타입 변환 : 자바스크립트 엔진에 의해 타입 자동 변환 (var str = ' ' + x)

기존 원시 값은 변경할 수 없는 값 -> 새로운 원시 값이 생성됨 (재할당으로 변경되는 것이 아님)

ex1. 문자열 연결 연산자 + => 피연산자가 문자열이 아니라면 타입을 변환함

ex2. 1 * '10' = 10(number). 타입을 변환할 수 없는 경우 NaN이 됨

ex3.  Truthy, Falsy로 구분 후 Truthy는 true로, Falsy는 false로 암묵적 타입 변환 됨

falsy : false, undefined, null, 0, NaN, ' '

 

- 명시적 타입 변환 : 개발자가 의도적으로. ex toString()

ex1. new 연산자 없이 호출 String(), Number(), Boolean()

ex2. toString(), parseInt(), parseFloat(),

 

- 단축 평가

논리 연산자 : 좌항 -> 우항으로 평가가 진행됨

**if문 대체

&& 연산자는 논리 연산의 결과를 결정하는 두번째 피연산자를 그대로 반환함 (null or undefined인지 확인하고 value 를 참조할때 유용)

|| 연산자는 논리 연산의 결과를 이미 결정한 첫번째 피연산자를 그대로 반환함 (함수 매개변수에 기본값을 설정할 때 유용)

 

**optional chaining -> null 또는 undefined가 아닌 falsy값은 걸러지지 않음 (value를 참조함)

var elem = null

var value = elem?.value
console.log(value) //undefined

** null 병합 연산자 -> 좌항의 피연산자가 null 또는 undefined인 경우 우항의 피연산자 반환(기본값 설정에 유리함)

-> optional chaining과 같이 falsy 값 중 null, undefined만 해당됨

var foo = null ?? 'default'
console.log(foo) //'default' (foo가 null 일 때)