jsisweird

• https://jsisweird.com/

• JS Is Weird 풀이 (자바스크립트는 이상해~~~)
• js 퀴즈 25문제 푸는 곳이다
• 나는 15/25점을 맞았다

후기

• 소름 돋는 건 문법 에러가 정답인 문제는 없다는 것이었다 ㅋㅋ
• 혹시 문제를 풀어보지 않았다면 먼저 문제를 풀고 오는 것을 추천한다!
• https://jsisweird.com/

오답노트

2. [,,,].length

Output: 3
You answered: 4

• 마지막 콤마는 trailing commas로 인식된다

example

const arr = [
  1, //
  2,
  3,
];

console.log(arr.length); // 3

• arr 배열에 원소가 3개 있고, 콤마도 3개 있다

• trailing commas 는 나중에 원소를 추가할 때 불편하지 않도록 하는 좋은 녀석이다

• 문제에서는 마지막 콤마를 trailing commas 로 하고, undefined이 3개 있는 배열에서의 length를 물어본 것이다

• eslint에서는 룰에 따라 trailing commas 를 사용할지 안 할지 선택할 수 있다

• 참고 ; https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Trailing_commas

3. [1, 2, 3] + [4, 5, 6]

Output: “1,2,34,5,6”
You answered: NaN

• 배열 더하기를 사용해본 적이 없어서 몰랐다
• 내 예상은 +로 넘버로 캐스팅되어서 숫자가 아니니까 NaN이고 NaN 끼리 더해서 NaN이 나올 것을 예상했는데
• 알고 보니 문자열로 캐스팅이 되는 것이었다…
• [1, 2, 3] + [4, 5, 6] === [1, 2, 3].toString() + [4, 5, 6].toString()

4. 0.2 + 0.1 === 0.3

Output: false
You answered: false

• 이 문제는 맞았다!
• 이전에 자바스크립트에 부동소수점 계산 문제가 있다는 것을 경험하고 mathjs 라이브러리를 통해 정확한 계산을 해본 적이 있다
• 0.2 + 0.1 === 0.30000000000000004 // true

5. 10,2

Output: 2
You answered: 10

• 이게 뭔가 싶다 ㅋㅋ
• 이런 코드를 작성할까 싶다
• 설명으로는 간단하게 맨 마지막 값을 반환한다고 되어있다

example

const a = (1, 2, 3);
console.log(a); // 3

9. true == “true”

Output: false
You answered: true

• 서로 다른 타입을 Abstract Equality Comparison하면 같은 타입으로 coercion 된다
• 참고 ; https://262.ecma-international.org/11.0/#sec-abstract-equality-comparison
• 참고 링크에 의하면 정해진 우선순위에 따라 결괏값을 반환하는데,
• boolean과 string 비교는 number, string 으로 1차 변환되고,
• number, string에서 number ,number로 변환되어 비교된다
• 결국 true == "true" -> 1 == "true" -> 1 == NaN -> false 가 된다

11. “” - - “”

Output: 0
You answered: SyntaxError

• - 마이너스가 2번 연속 나오는데 이게 왜 문법 에러가 아니지… 충격
• 생각해보니까 10 - (-10) 같은 게 떠올랐다
• -를 붙여서 --로 썼다면 SyntaxError 라고 한다
  - -“”; // -> 0
  –””; // -> SyntaxError

12. null + 0

Output: 0
You answered: NaN

• null은 undeifend, NaN이랑 다르게 0으로 변환된다
• 참고로 false도 넘버로 캐스팅하면 0으로 변환된다

13. 0/0

Output: NaN
You answered: Infinity

• 0/0은 NaN
• 1/0은 Infinity 다

18. true + (“true” - 0)

Output: NaN
You answered: 2

• "true"가 숫자로 캐스팅되면 1이 아니라 NaN이다
• "true"를 1로 생각하고 문제를 풀었다 ㅠ

21. NaN === NaN

Output: false
You answered: true

• 이건 너무…

example

NaN === NaN; // -> false
Object.is(NaN, NaN); // -> true
isNaN(NaN) == isNaN(NaN); // -> true

• NaN 비교는 이런 식으로 해야 생각대로 동작한다

23. undefined + false

Output: NaN
You answered: 0

• undefined은 NaN 으로 변환된다

참고

• https://jsisweird.com/

🍌 바나나 만들기

make banana

('b' + 'a' + +'a' + 'a').toLocaleLowerCase();

• https://www.reddit.com/r/learnjavascript/comments/etn214/javascript_is_weird/