[TIL]간단하게 해석해보는 WTF JS?

Violet Lee·2020년 10월 2일
0

javascript

목록 보기
14/24

JS는 불안정한 언어라는 얘기가 유명할만큼, 독특하고 재미있는 부분도 존재한다.
가끔 JS는 독특함을 넘어서서 욕이 나올만큼? 직관적이지 않아서 보기 힘든 문법들이 존재한다.

서버리스 프레임 워크 'OpenJSArchitect'의 핵심관리자이자, 'Begin.com' 사이트 공동 설립자 Brian LeRoux는, 이러한 JS의 부분들을 'WTFJS(What the Fuck Javascript)'라는 이름으로 정리하여 “WTFJS” at dotJS 2012: 에서 강의한 바 있는데, 꽤 유용하다고 생각되어, 나는 그 중, 이후에 내가 알고리즘을 풀 때에나 스프린트에 사용할때에 써먹을만한 부분을 몇가지 정리해본다.

  • 문자열 + +'문자열' = '문자열NaN'

=> ex) 표현식은 'foo'+ (+ 'bar')로 평가되며, 'bar'를 숫자가 아닌 것(Not a Number)으로 변환하기 때문이다.


  • NaN === NaN //false

=> NaN은 자기자신과도 비교할수 없다고 알고있다. 자세한 이유를 알려면, What is the rationale for all comparisons returning false for IEEE754 NaN values? 에 설명되어있긴 하지만, 굳이 알 필요없다.


  • [] is truthy, but not true.
    => 빈 배열은 truthy한 값이지만, true는 아니다.
   ![];       // -> false
  !![];       // -> true
  [] == true  // -> false
  [] === true // -> false  

=> 즉, []과 같이, 값이 있는것으로 판단되는 truthy한 값 들은, 콘솔에 직접 사용할 때에도 그렇고,
예를 들어

let arr = [1,2,3];
typeof arr === 'array' //true

이지만,

typeof !arr === 'array'   //false
typeof !arr === 'boolean' //true

인것처럼, truthy한 값들을 가지는경우는 true는 아니지만, 반대는 false를 가질 수 있다.
또한, falsy한 값이 아닌, '!'등의 연산자를 통해 자체를 false값으로 만든 값의 타입은, 값 자체가 부정당했으므로 타입이 'boolean'으로 바뀐다.


  • '문자열'[index]를 하면, 해당 문자열의 index에 해당하는 문자가 나온다.
  ex) 'false'[0] // 'f'

//---------------------------------------------------------------------
//**문자열의 범위에서 벗어난 인덱스를 적용할 시, undefined가 나오는데,
//  만약 이를 그대로 문자열로 표현하고싶다면, 빈 문자열이나 String()을 적용시키면 된다.

  ex) String("false"[7]); //"undefined"
  ex) "false"[7] + ''     //"undefined"

  • Null is falsy, but not false.
    => null은 falsy한 값이지만, false는 아니다.
 !null;         // -> true
!!null;         // -> false
  null === false; // -> false

즉, null, [] 등 5가지 falsy값들은 'false'가 아니다.


  • []와 null은 object형이지만..
typeof []; // -> 'object'
typeof null; // -> 'object'

// however
null instanceof Object; // false

=> https://unikys.tistory.com/260 에 자세한 내용이 잘 설명돼있으니 설명은 이 사이트로 마치겠다. 비교가 한눈에 와닿는 블로그라고 생각한다. 👍 요약하자면, primitive type(원형객체)와 클래스타입을 비교할때에 결과가 달라진다고 생각하면 된다.

나는 이정도면 충분히 여러 문제들을 해결할 때 사용할 수 있을것 같다.
자세한건 https://github.com/denysdovhan/wtfjs#-is-equal- 에 들어가서 WTFJS에 대해 보면된다. 하지만 문제들을 해결하면서 느낀건, 별로 중요하지 않다는 것이다. 몰라도 충분히 구글링 몇번만 하면 나오는 문제들이기 때문이다. 그치만 소소한 재미이기 때문에.. 가끔 보기엔 충분하다.

profile
예비개발자

0개의 댓글