함정 시리즈 11

정규 표현식과 하이픈(-)

다음은 주어진 문자열로부터 C-, C0, C+, B-, B0, B+, A-, A0, A+를 매칭시키는 코드입니다. 정규 표현식을 활용합니다.const input = 'A+B-C0';const scores = input.match(/[ABC][0-+]/g); // ['A+', 'B-', 'C0']하지만 위의 코드를 실행하면 SyntaxError를 뱉어냅니다.잘못된 부분은 두 번째 위치의 문자를 매칭하기 위해 사용한 [0-+] 부분입니다.대괄호에 대하여 간단하게 설명하고 넘어가자면, 대괄호 안에 있는 문자열은 OR처럼 작동하여 해당 위치의 문자가 대괄호 안에 주어진 값들 중 하나인 경우에만 패턴이 일치됨을 나타냅니다.[ABC]를 예로 들어 설명하면 문자열의 해당 자리가 A, B, C 중 하나일 때 일치됨을 ..

함정 시리즈 2024.05.06

[JavaScript] switch문의 fall-through

case마다 반드시 break를 사용할 것 if - else if - else문 대신 switch - case문을 사용해 보려다가 당했습니다. break를 사용하지 않았기 때문입니다. switch - case 각각의 문자열이 아래와 같이 대응된다고 해봅시다. U: up → y 좌표를 1 증가시킴 D: down → y 좌표를 1 감소시킴 L: left → x 좌표를 1 감소시킴 R: right → x 좌표를 1 증가시킴 간단하게 코드로 나타내 보면 아래와 같습니다. const string = "UDLR"; let x = 0; let y = 0; for (let chr of string){ switch (chr) { case 'U': y++; case 'D': y--; case 'L': x--; case '..

함정 시리즈 2024.01.29

[JavaScript] new Date('YYYY-MM-DD')

new Date('2024-1-1') !== new Date('2024-01-01')Date의 날짜 파싱MDN 문서는 Date 생성자를 이용한 날짜 파싱이 일관적이지 않고 브라우저별로 동작이 상이하므로 사용하지 않을 것을 권장하고 있습니다. 위의 예시는 일관적이지 않은 파싱의 한 예시입니다.비교 연산의 왼쪽 식은 우리나라의 시간대를 기준으로 2024년 1월 1일 0시가 됩니다. 우리나라 시간대는 그리니치 표준시(GMT)보다 9시간이 빠르므로 실제 반환되는 타임스탬프는 2023년 12월 31일 15시입니다.new Date('2024-1-1').toISOString(); // 2023-12-31T15:00:00.000Znode.js 환경에서 'YYYY'를 고정한 채로 1월 1일 ~ 12월 31일까지 확인하였..

함정 시리즈 2023.12.28

[JavaScript] 객체의 프로토타입에 메서드 추가하기

화살표 함수 대신 function 키워드 쓰세요 Set.prototype.toggle Set에 함수의 인자로써 주어진 데이터가 없다면 데이터를 추가하고, 데이터가 이미 있다면 데이터를 삭제하는 toggle 메서드를 추가해 봅시다. 방법 다음의 과정을 거치면 Set.prototype.add, Set.prototype.remove와 같은 Set 자료형의 다른 메서드처럼 우리가 만든 toggle 함수를 호출할 수 있습니다. 1. 함수를 정의한다. 2. Set.prototype의 하위에 1에서 정의된 함수를 할당한다. 함수 정의 및 할당 // 함정 Set.prototype.toggle = (item) => { if (this.has(item)){ this.delete(item); } else { this.add..

함정 시리즈 2023.12.23

[JavaScript] BigInt와 Number의 비교 연산

0n == 0 → true 0n === 0 → false 요약 BigInt와 Number 사이에 엄격한 동치 연산자(===)를 사용하면 두 값의 타입이 일치하지 않으므로 false를 반환합니다. BigInt 일반적으로 숫자의 값이 2^53 - 1보다 크거나 연산 과정에서 이보다 커질 가능성이 있는 경우 BigInt 자료형을 사용합니다. 비교 연산 BigInt 자료형 사이의 비교 연산 1n >= 0n // true 1n >= 1n // true 1n 0n // true 1n = 0 ..

함정 시리즈 2023.12.09

[JavaScript] 정말 보기 드문 RangeError

RangeError JavaScript를 사용하면서 RangeError를 마주하는 것은 생각보다 드문 일입니다. JavaScript는 배열 범위를 벗어난 인덱스를 참조해도 undefined를 반환할 뿐, 오류를 반환하지는 않으니까요! 하지만 그것을 마주해 버렸습니다. 어느 부분에서 오류가 발생했는지 알 수 없는 환경에서 말이죠. 다행히도 굉장히 짧은 RangeError 문서를 통하여 핵심을 빠르게 파악할 수 있었고, Number 또는 String의 변환과 관련한 함수에 부적절한 값을 전달한 경우를 중심으로 RangeError가 반환되도록 되어 있음을 확인하였습니다. String.prototype.normalize() Number.prototype.toFixed() Number.prototype.toExp..

함정 시리즈 2023.11.24

부동 소수점 연산의 함정

모르면 언젠가 한 번은 당할 수밖에 없는 것 0.1 + 0.2 === 0.3 그동안 컴퓨터로 계산한 0.1 + 0.2의 결과가 0.3이 아니라는 정도로만 알고 있었지 실제로 크게 당해본 적은 없었습니다. 보통의 경우에는 값이 안 맞는다 싶을 때, 적절한 소수점 자리에서 반올림으로 처리하면 올바르게 보정됩니다. 반올림은 괜찮지만... 이 미세한 오차로 인한 진짜 문제는 반올림 연산이 아닌 내림 연산 또는 올림 연산을 사용할 때 본격적으로 발생합니다. 위의 수를 소수점 아래 셋째 자리에서 반올림 · 올림해야 한다고 생각해 봅시다. 자바스크립트로는 아래와 같이 수행할 수 있습니다. let number = 1.1 * 1.1; number; // 1.2100000000000002 Math.round(number ..

함정 시리즈 2023.11.19

[JavaScript] 0과 -0 (JavaScript 정수 자료형의 함정)

정수 자료형? 그런 건 따로 없소이다. 모든 것은 숫자(Number)로 통합니다. -0 만들기 작업에 큰 지장은 없지만 직접 마주한다면 은근히 거슬리는 -0이라는 녀석, 이 녀석은 어떻게 생길까요? 직접 -0을 입력 부호가 마이너스이면서 곱셈의 결과가 0이 되도록 하기 -0; -1 * 0; 1 * -0; 0 * -0; -0을 마주하게 된 배경 구현한 자료구조가 제대로 동작하는지 확인하기 위해 정수 범위에 걸친 랜덤한 데이터가 필요했습니다. 데이터를 만들기 위해 아래와 같은 로직을 통해 임의의 수를 생성하였습니다. (반복문 생략) const N = 100; // 숫자 범위 조정 (Math.round(Math.random())) * 2 - 1) * Math.floor(Math.random() * N); //..

함정 시리즈 2023.11.09

[JavaScript] Set.prototype.add()의 함정

Set.prototype.add()는 Array.prototype.push()와 달리 오직 하나의 전달인자만을 추가할 수 있습니다. 1. 메서드 호출 구문 mySet.add(value); // 예시 mySet.add(1); mySet.add('hi'); // 잘못된 예시 mySet.add(1, 'hi'); // 집합에는 1만 추가되며, 'hi'는 무시됩니다. arr.push(element1[, ...[, elementN]]); // 예시 arr.push(1); arr.push(1, 'hi', [0]); 2. 전달인자 개수 메서드 전달인자 개수 Set.prototype.add 1 Array.prototype.push N 3. 전달인자를 생략한 경우 const mySet = new Set(); mySet.a..

함정 시리즈 2023.11.07