항목을 찾는 데 Set.has()가 Array.includes()보다 빠른 이유

가끔 애플리케이션을 구축할 때 성능이 핵심이거나 적어도 중요한 동인이 되는 경우가 있습니다. 특히 대규모 데이터 세트나 실시간 요구 사항을 처리할 때는 더욱 그렇습니다. JavaScript에서 가장 일반적인 작업 중 하나는 컬렉션에 일부 값이 존재하는지 확인하는 것입니다. 가장 자주 사용되는 두 가지 대안은 Array.includes()와 Set.has()입니다. 둘 다 작동하지만 실제로는 Set.has()가 Array.includes보다 더 잘 작동합니다. 그 이유를 자세히 알아보고 언제 어떤 대안을 사용해야 할지 결정해 보겠습니다.

Array.includes()와 Set.has() 이해하기

사용이 매우 간단해 보이지만 구현 방식이 다른 두 가지 메서드, 즉 Array.includes()와 Set.has()가 있습니다.

Array.includes()

includes() 메소드는 주어진 값이 배열 내에 존재하는지 확인합니다.
O(n)의 시간 복잡도를 활용하므로 배열의 길이가 길수록 값 확인에 더 오랜 시간이 걸립니다.
Array.includes()가 처음부터 끝까지(또는 값을 찾을 때까지) 배열을 검색하는데, 배열이 클수록 시간이 오래 걸리기 때문입니다.

Set.has()

Set의 has() 메소드는 주어진 값이 존재하는지 확인하지만 훨씬 더 빠르게 수행됩니다.
Set.has()는 상수 시간 조회 또는 O(1) 시간 복잡도를 허용하는 해시 테이블 기반 구조를 사용합니다.
배열과 달리 집합은 고유한 값을 처리하도록 만들어졌으므로 내부에 중복된 값이 없으며 조회 시간이 더 길어집니다.

대규모 데이터 세트에서 Set.has()가 더 빠른 이유

Set.has()를 사용하면 JavaScript는 세트에 항목 수에 관계없이 한 번의 직접 작업으로 항목을 찾을 수 있습니다. 예를 들어 백만 개가 포함된 집합에 값이 있는지 확인하는 동안 Set.has()에 소요되는 시간은 10을 확인하는 것과 정확히 같습니다.

반면에 Array.includes()는 관심 있는 항목을 찾거나 맨 끝에 도달할 때까지 각 요소를 왼쪽에서 오른쪽으로 순차적으로 검사합니다. 즉, 크기가 길수록 확인 시간이 걸리며, 특히 항목이 거의 끝에 가까워지고 문제의 항목이 없는 경우에는 더욱 그렇습니다.

다음은 예를 자세히 살펴보는 것입니다.

const bigArray = Array.from({ length: 1000000 }, (_, i) => i);
const bigSet = new Set(bigArray);

const valueToFind = 999999;

// Array.includes (O(n)) - Slower for large arrays
console.time("Array.includes");
bigArray.includes(valueToFind);
console.timeEnd("Array.includes");

// Set.has (O(1)) - Faster for large sets
console.time("Set.has");
bigSet.has(valueToFind);
console.timeEnd("Set.has");

이것을 실행하면 Set.has()가 대규모 배열에서 Array.includes()보다 훨씬 뛰어난 성능을 발휘한다는 것을 알 수 있습니다. 실제로 이러한 차이는 더 부드러운 애니메이션, 더 빠른 로드 시간 또는 서버의 리소스 사용량 감소로 이어질 수 있습니다.

Set.has() 및 Array.includes()를 사용하는 경우

이것은 모두 달성하려는 목표에 따라 다릅니다. 간략한 요약은 다음과 같습니다.

다음과 같은 경우 Set.has()를 사용하세요.

• 빅데이터를 다루시며 검색을 많이 하십니다.
• 고유한 사용자 ID, 태그 또는 키워드 집합과 같은 고유한 값을 사용하여 작업하고 있습니다.
• 어레이를 어레이로 변환하는 데 드는 소액의 초기 비용은 마음에 들지 않습니다.
• 추후 조회 횟수를 최소화하도록 설정합니다.

다음과 같은 경우 Array.includes()를 사용하세요.

• 데이터 세트가 작고 성능 차이가 미미합니다.
• 아이템은 한 번 또는 몇 번만 확인하면 되므로 세트를 만들어도 아무런 이점이 없습니다.
• 세트가 처리할 수 없는 중복 항목을 처리하고 있습니다.

사용 사례 예시

차단된 단어 목록을 기준으로 이름을 필터링하는 사용자 검색 기능을 구현한다고 상상해 보세요. 차단된 단어가 수백 개이고 자주 검색하는 경우 차단된 단어에 대한 설정을 사용하면 각 검색 확인이 더 빨라질 수 있습니다.

const bigArray = Array.from({ length: 1000000 }, (_, i) => i);
const bigSet = new Set(bigArray);

const valueToFind = 999999;

// Array.includes (O(n)) - Slower for large arrays
console.time("Array.includes");
bigArray.includes(valueToFind);
console.timeEnd("Array.includes");

// Set.has (O(1)) - Faster for large sets
console.time("Set.has");
bigSet.has(valueToFind);
console.timeEnd("Set.has");

작은 경우에도 세트는 작업을 효율적이고 예측 가능하게 유지하는 데 도움이 됩니다. 또한 차단 단어 목록이 늘어나더라도 이미 확장 가능한 솔루션을 보유하고 있는 것입니다.

주요 시사점

• 성능: Set.has()는 O(1) 시간 복잡도를 제공하므로 대규모 컬렉션의 경우 O(n)을 사용하는 Array.includes()보다 훨씬 빠릅니다

• 적합성: 세트는 고유한 값을 위해 설계되었으므로 자연스럽게 조회에 최적화됩니다. 배열은 중복 값이 ​​있는 경우 더 유연하지만 존재 여부를 확인하는 속도는 더 느립니다.

• 확장성: 데이터가 증가함에 따라 Set.has()는 계속해서 좋은 성능을 발휘하는 반면 Array.includes()는 느려집니다.

최종 생각

Set.has()와 Array.includes() 중에서 선택할 때 데이터 세트의 크기와 특성을 아는 것이 항상 중요합니다. Array.includes()는 작은 데이터 세트에는 완벽하게 적합하지만 Set.has()는 속도가 중요한 상황에서 귀중한 도구입니다. 올바른 데이터 구조는 코드를 크게 변경하지 않고도 JavaScript 애플리케이션을 더 빠르고 효율적으로 최적화하는 데 도움이 될 수 있습니다.

그러므로 무언가가 있는지 확인할 때마다 스스로에게 물어봐야 합니다. 그것이 어레이에 대한 작업인지, 아니면 세트의 힘을 사용할 수 있는지? 이를 올바르게 수행하는 것이 애플리케이션에 필요한 차이일 수도 있습니다.

위 내용은 항목을 찾는 데 Set.has()가 Array.includes()보다 빠른 이유의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!