[Udemy] 클린코드 자바스크립트( JavaScript) - 타입 다루기

호이스팅 주의하기

• 간단하게 호이스팅이란 런타임시 선언과 할당이 분리된 것

• 코드를 작성할 때는 스코프를 고려하여 실행을 예상하지만 실제 런터임 환경에서는 예상되로 실행되지 않을 수 있음.

• 이는 var로 선언한 변수가 초기화가 되어있지 않을 때 undefined로 최상단에 끌어 올려진다. => 호이스팅

  var는 함수스코프를 가지고 let & const는 블럭스코프를 가진다.

  해결책

  • 변수 선언과 할당, 초기화 완료를 하며 다른 코드와 정확한 분리를 해야한다.
  • var 사용안하고 const를 사용해 함수 or 변수를 할당하는 방식으로 사용

---

타입 검사

• typeof 연산자는 문자열로 반환한다.

  Primitive vs Reference

  • Referencs는 typeof로 감별해내기 어렵다
  • typeof null은 'object'로 감별한다. => 이는 공식적인 오류
  • 자바스크립트의 타입은 동적으로 변화하기 때문에 타입을 잘 감별해야한다.

  instanceof

  • 객체의 프로토타입 체인을 검사하는 용도

  function Person(name, age){
    this.name = name;
    this.age = age;
  }
  
  const p = {
    name: "poco",
    age: 99
  }
  
  const poco = new Person("poco", 99)
  
  poco instanceof Person // => true
  p instanceof Person // => false

  Object.prototype.toString.call()

  const arr = []
  const date = new Data()
  Object.prototype.toString.call(arr) // -> '[object Array]
  Object.prototype.toString.call(date) // -> '[object Date]'

  중요한점은 타입 검사에 대해 주의를 표하고 상황에 맞는 방법을 선택해야한다.

---

Undefined & Null

null

• 값이 없다

• JS에서 null은 수학적으로 0으로 취한다

  !null // true
  !!null // false
  
  null + 123 // 123
  null === false // false

  undefined

• 아무것도 지정하지 않았을 때의 기본값

• 선언했지만 정의되지 않고 할당 x

  let verb // undifined
  
  undefined + 10 // NaN
  
  !undefined // true

  주의점

• 두개를 남용하기 보다는 비어있는 값을 null 또는 undefined로 쓰는 등의 일관적인 코드가 필요

---

== 줄이기

• JS에서는 타입형변화의 특성이 있음
  "1" == 1과 1 == true가 같다고 인식

  === (엄격한 동등연산자) 사용하기

---

형변화 주의하기

11 + ' 문자' // '11 문자'
!!'문자' // true
!!'' // false

parseInt('9.999', 10) // 9

• 위의 예시처럼 js는 암묵적인 형변화를 할 수 있다.
• 이는 코드의 동작방식을 예상하는데 어려움을 줄 수 있기에 reference 객체를 이용하여 명시적으로 형변화하여 예측가능한 코드를 작성.

String(11 + ' 문자') // '11 문자'
Boolean('문자') // true
Boolean('') // false
Number("11")

parseInt('9.999', 10) // 9

---

isNaN

• 10진수와 2진수의 차이의 간극이 존재하는데 이는 소수점 표기에 있고 이를 해결하기 위해 JS는 IEEE 754 표준을 사용하고 있다.
• 다양한 숫자를 검사하기 위해 js는 많은 방식이 있다
• 그 중 typeof와 isNaN이 있는데 이중 isNaN의 주의가 필요하다

typeof 123 === "nuber"  // true

isNaN(123) // false => 123은 숫자가 아닌게 아니다. => 123은 숫자다. 라고 논리가 진행되기에 직관적인 이해가 어려울 수 있다.

isNaN(123 + "문자") // ture 
Number.isNaN(123 + "문자") // false => Number를 붙어 사용을 권장, 엄격한 검사