자바스크립트 sort와 filter 함수에서 0 문제와 올바른 사용법
자바스크립트의 sort 함수에서 0은 두 값이 같음을 의미하며 순서 변경이 일어나지 않습니다. filter 함수는 콜백에서 0을 falsy로 판단해 해당 요소를 제외할 수 있으므로, boolean 반환을 명확히 해야 합니다. 이를 통해 0 관련 문제를 예방하고 원하는 결과를 얻을 수 있
자바스크립트에서 sort 함수의 비교 함수가 0을 반환하면 두 값이 같다고 판단해 순서가 바뀌지 않습니다. 반면에 filter 함수는 콜백에서 0을 falsy 값으로 인식해 해당 요소를 제외할 수 있기 때문에, 원하는 결과를 얻으려면 반드시 boolean 값을 명확히 반환하도록 작성해야 합니다. 특히 숫자 정렬 시 compareFunction을 빼먹거나 filter 조건에 0을 포함하는지 여부에 따라 실수가 발생하기 쉬우니 주의가 필요합니다.
자바스크립트 sort 함수에서 0이 의미하는 바와 흔한 문제
- sort 함수의 비교 함수가 0을 반환하면 두 값이 같다고 간주한다
- compareFunction이 없으면 문자열 기준으로 정렬되어 숫자 배열에서 예상과 다른 결과가 나올 수 있다
- 0을 반환하는 비교 함수는 요소 순서를 변경하지 않는다
sort 함수는 비교 함수가 반환하는 값에 따라 배열 요소들의 위치를 결정합니다. 이때 반환값이 0이면 두 값이 동일하다고 판단해 순서를 바꾸지 않습니다. 만약 비교 함수를 지정하지 않으면 배열의 원소들이 모두 문자열로 취급돼, 숫자 배열이 의도와 달리 정렬될 수 있죠. 그래서 숫자를 정렬할 때는 꼭 (a, b) => a – b 같은 비교 함수를 넣어 주는 게 기본입니다.
종종 0을 반환하는 비교 함수 때문에 요소들의 순서가 그대로 유지되어 원하는 정렬 결과가 나오지 않는 경우도 있습니다. 만약 0을 특정 위치에 배치하고 싶다면 조건을 좀 더 세밀하게 만들어야 합니다.
filter 함수에서 0이 결과에 영향을 주는 이유와 주의할 점
- filter 콜백 함수는 반드시 boolean 값을 반환해야 한다
- 0은 falsy 값으로 인식되어 조건에 맞지 않으면 요소가 제외될 수 있다
- 빈 배열 요소(sparse array)에서는 콜백 호출이 되지 않아 결과가 달라질 수 있다
filter 함수는 콜백이 true로 평가되는 요소만 배열에 남깁니다. 그런데 콜백이 0을 반환하면 false로 취급되어 그 요소가 걸러지게 되죠. 따라서 0이 포함된 요소를 유지하고 싶다면 콜백에서 반드시 명확하게 true/false 값을 반환하도록 작성해야 합니다.
또한 희소 배열(sparse array) 같은 경우 빈 칸에는 콜백 함수가 호출되지 않아서 예상과 다른 결과가 나올 수 있으니 주의가 필요합니다. 0이 filter 결과에 어떤 영향을 미치는지 정확히 이해하고 조건문을 잘 작성하는 게 중요합니다.
숫자 배열 정렬 시 compareFunction을 올바르게 작성하는 방법
- 숫자를 정렬할 때는 기본적으로 (a, b) => a – b 형태의 비교 함수를 사용한다
- 0을 배열 내 특정 위치에 두고 싶으면 조건문으로 값을 구분해 처리해야 한다
- 비교 함수는 항상 반환값이 음수, 0, 양수 중 하나임을 명확히 해야 한다
숫자 배열을 제대로 정렬하려면 보통 다음과 같이 비교 함수를 작성합니다.
arr.sort((a, b) => a - b);
이 함수는 a가 b보다 작으면 음수, 같으면 0, 크면 양수를 반환해서 올바른 오름차순 정렬을 만들어 줍니다.
만약 배열 안에서 0을 특정 위치에 배치하고 싶다면, 0인지 여부를 조건문으로 따로 처리할 수 있습니다. 예를 들어 0을 뒤쪽으로 보내고 싶을 때는 이렇게 작성할 수 있죠.
arr.sort((a, b) => {
if (a === 0) return 1;
if (b === 0) return -1;
return a - b;
});
이처럼 상황에 맞게 비교 함수를 조절하면 원하는 정렬 결과를 얻기가 훨씬 수월해집니다.
filter에서 0을 포함하거나 제외하려면 어떻게 해야 할까요?
- filter 콜백 함수는 반드시 boolean 값을 반환해야 한다
- 0을 포함할 때는 명확한 조건식을 써서 true가 되도록 처리한다
- 0을 제외하려면 === 0 같은 엄격한 비교 연산자를 사용한다
filter 함수로 0을 포함하거나 제외하는 작업은 생각보다 까다로울 수 있습니다. 0은 false로 간주되기 때문에, 콜백에서 단순히 값을 반환하면 의도와 달리 걸러질 수 있거든요.
0을 포함하고 싶으면 다음처럼 조건을 명확히 해서 true/false를 반환하도록 작성하세요.
arr.filter(value => value >= 0);
여기서 조건에 따라 0이 포함되거나 제외됩니다. 반대로 0을 빼려면 이렇게 씁니다.
arr.filter(value => value !== 0);
이처럼 엄격한 비교 연산자를 써서 조건식을 명확하게 하는 게 헷갈리지 않는 방법입니다. 조건을 부정확하게 작성하면 0이 빠지거나 의도와 다른 결과가 나올 수 있으니 주의해 주세요.
sort와 filter 사용 시 흔히 하는 실수와 문제 해결 팁
- 비교 함수를 빼먹고 sort하면 숫자가 문자열로 정렬돼 엉뚱한 결과가 나온다
- sort 비교 함수가 0을 반환하면 순서가 유지된다는 사실을 모르면 결과에 당황할 수 있다
- filter 콜백에서 boolean이 아닌 값을 반환해 0이 빠지는 경우가 많다
- 빈 배열 요소를 고려하지 않고 filter를 쓰면 예상과 다른 결과가 나올 수 있다
많은 개발자분이 sort와 filter를 사용할 때 흔히 겪는 문제는 비교 함수 누락입니다. 이 경우 숫자가 문자열처럼 정렬돼 원하는 순서가 나오지 않죠. 또 sort 함수 내 0 반환이 같은 값으로 인식돼 순서가 바뀌지 않는다는 점을 모르면 결과에 놀라기 쉽습니다.
filter를 쓸 때도 0을 false로 판단해 걸러지는데, 이 사실을 모르고 조건을 작성하면 데이터가 의도없이 빠집니다. 게다가 희소 배열 같은 빈 공간을 신경 쓰지 않고 filter를 쓰면 이상한 결과가 나올 수 있으니 꼭 확인해 주세요.
이런 문제들은 비교 함수와 콜백의 반환값을 항상 명확하게 작성하면 대부분 해결할 수 있습니다.
“자바스크립트 sort와 filter 함수에서 0이 문제를 일으키는 경우, 비교 함수와 콜백의 반환값 역할을 정확히 이해하고 작성하는 게 핵심입니다.”
먼저 정렬할 때는 꼭 compareFunction을 넣어 숫자가 문자열처럼 처리되는 상황을 막으세요. 그리고 filter를 사용할 때는 콜백이 true 또는 false를 확실하게 반환하는지 다시 한번 점검하는 게 좋습니다. 마지막으로 0을 포함할지 제외할지 조건식을 꼼꼼히 작성해 보세요.
이렇게 하면 0이 의도와 다르게 결과에 영향을 미치는 문제를 많이 줄일 수 있습니다. 코드를 수정할 때 이 부분을 꼭 확인하면서 진행해 보세요.