Javascript에서 Array 데이터의 값을 편집하고 제거하기 위해 Array.prototype.filter() 및 Array.prototype.map()을 사용하는 코드를 본 적이 있을 것입니다
예:
[1,2,3] .map((mapped) => mapped + 1) .filter((filtered) => filtered > 1)
저는 이러한 메서드 체이닝이 각 반복마다 배열의 값을 반복하는지, 아니면 v8 엔진이 내부적으로 데이터 집계를 수행하여 작업을 최적화하는지 항상 궁금했습니다.
그래서 작은 조사를 해봤습니다.
console.time과 console.timeEnd를 이용하여 Method Chain 유무에 관계없이 10번의 평균 실행 시간을 측정했습니다.
조사에는 크롬 브라우저를 사용했습니다.
console.time('Filter Execution Time') // YOUR CODE console.timeEnd('Filter Execution Time')
- | Method Chain(A) | No Method Chain(B) | Aggregate Logic(C) |
---|---|---|---|
Iterate 10000000 values | 4656 ms | 4733 ms | 169 ms |
Iterate 100000 values | 27 ms | 24 ms | 4 ms |
보시다시피, 메소드 체인이 있거나 없는 결과는 큰 차이를 나타내지 않은 반면, 로직을 집계하면 결과가 더 빨라졌습니다.
코드-A. map() 및 filter()와 함께 메소드 체이닝 사용
console.time('Filter Execution Time') const result = new Array() .fill(1).map((e) => e + 1) .filter((e) => e !== 1) console.timeEnd('Filter Execution Time')
코드-B. map() 및 filter() 분리(메소드 체이닝 없음)
console.time('Filter Execution Time') const mapResult = new Array().fill(1).map((e) => e + 1) const result = mapResult.filter((e) => e !== 1) console.timeEnd('Filter Execution Time')
코드-C. 집계 논리
console.time('Filter Execution Time') const result = [] new Array().fill(1).forEach((e) => { if (e !== 1) result.push(e) }) console.timeEnd('Filter Execution Time')
그런 생각을 하시는 분들을 위해 위와 마찬가지로 코드 패턴 A, B, C를 기준으로 100회부터 100,000회까지의 반복 횟수마다 평균 시간을 10초 단위로 밀리초 단위로 계산하여 차트를 만들었습니다.
어차피 100~1,000회 정도로 반복 횟수가 크지 않으면 별 차이가 없습니다.
반복 횟수가 1,000,000과 같이 기하급수적으로 늘어나는 것이 중요합니다.
Method Chaining은 연산을 집계하지 않고 반복 횟수가 기하급수적으로 늘어남에 따라 결과의 차이가 커집니다.
따라서 반복 횟수가 적을 때는 메소드 체인을 사용하여 편리함을 얻는 것이 좋지만, 많은 양의 데이터를 처리할 경우에는 다음을 수행해야 한다고 말하는 것이 타당하다고 생각합니다. 메소드 체인 없이 알고리즘을 신중하게 고려하십시오.
읽어주셔서 감사합니다!
위 내용은 메소드 체인: filter().map()이 비효율적인가요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!