JavaScript의 엑스트라를 배열합니다

JavaScript 배열은 많은 프로그래밍 언어의 기본 데이터 구조이며 JavaScript도 예외는 아닙니다. 배열 작업에 대한 많은 세부 사항을 단순화하기 위해 JavaScript는 배열 확장 기능이라는 기능 세트를 제공합니다. 이 기사는 다양한 배열 확장 기능과 그 용도를 소개합니다.

키 포인트

JavaScript의 배열 확장 함수는 배열 작업에 대한 많은 세부 사항을 단순화하여 복잡한 루프를 기능 호출로 바꾸어 코드의 가독성을 향상시키는 기능입니다. 여기에는 , , , , , ,

, , , 및 와 같은 방법이 포함됩니다.

forEach() map() 메소드는 배열의 각 요소에서 콜백 함수를 호출하여 루프 및 배열 첨자 표기법이 필요하지 않습니다. 그러나 각 요소의 기능을 호출하여 성능 저하를 유발할 수 있습니다. filter() every() 함수는 some()와 유사하지만 콜백 함수에 의해 리턴 된 값을 포함하는 배열을 반환합니다. reduce() 메소드는 값의 배열도 반환하지만 부울 값을 반환 해야하는 콜백 함수의 리턴 값을 기반으로합니다. reduceRight() indexOf() 메소드는 배열의 각 요소를 처리하고 단일 값을 계산하는 반면 lastIndexOf()는 동일한 방식으로 작동하지만 배열 끝에서 시작합니다.

메소드는 배열에서 특정 요소를 검색하고

도 동일한 작업을 수행하지만 배열 끝에서 검색을 시작합니다. forEach()

배경

map() 거의 모든 배열 작업은 각 배열 요소를 한 번에 하나씩 통과하여 수행됩니다. 예를 들어, 다음 코드는 A forEach() 루프를 사용하여 배열의 모든 요소를 ​​디버그 콘솔에 기록합니다. filter()

가장 중요한 것은 이전 예제가 완전히 유효한 JavaScript 코드임을 이해해야합니다. 그러나 여러 개의 복잡한 루프가 있으면 추적 변수가 지루할 수 있습니다. 배열 확장 기능을 통해 전체 루프를 기능 호출로 바꿀 수 있으므로 일반적으로 코드의 가독성을 향상시킬 수 있습니다. 이제 다양한 배열 확장 기능을 살펴 보겠습니다.

reduce() foreach () 많은 배열 확장 함수와 마찬가지로 메소드는 고차 함수 reduceRight()-다른 함수를 매개 변수로 수신하는 함수입니다. 배열 요소를 가로 지르는 대신 콜백 함수는 각 요소에서 순서대로 호출됩니다. 콜백 함수는 현재 배열 요소, 배열 인덱스 및 배열 자체의 세 가지 매개 변수를 허용합니다. 다음 코드에서 원래 예제는 indexOf() 메소드를 사용하도록 다시 작성되었습니다. lastIndexOf()

var foo = ["a", "b", "c", "d"];

for (var i = 0, len = foo.length; i < len; i++) {
  console.log(foo[i]);
}

를 사용하면 루프 및 배열 첨자 표기법이 필요하지 않습니다. 또한 JavaScript는 함수 수준 스코프를 사용하므로

콜백 함수는 변수 이름을 재사용 할 수있는 새로운 범위를 제공합니다. 유일한 단점은 배열의 각 요소의 함수를 호출하여 발생하는 성능 손실입니다. 다행히도이 손실은 종종 무시할 수 있습니다. 또한 콜백 함수 후 옵션 매개 변수를 forEach()로 전달할 수 있습니다. 존재하는 경우, 두 번째 매개 변수는 콜백 함수에 사용 된 forEach() 값을 정의합니다. forEach() this map ()

함수는 와 거의 동일합니다. 유일한 차이점은 가 콜백 함수에 의해 리턴 된 값을 포함하는 배열을 반환한다는 것입니다. 예를 들어, 다음 코드는 를 사용하여 입력 배열에서 각 항목의 제곱근을 계산합니다. 그런 다음 결과를 배열로 반환하고 표시하십시오. 또한 배열 확장 기능은 와 같은 내장 JavaScript 함수와 호환됩니다. 필터 ()

kike 및 map(), 메소드는 콜백 함수와 선택 사항 forEach()와 같이 map()는 콜백 함수의 리턴 값에 따라 값 배열을 반환합니다. 차이점은 콜백 함수가 부울 값을 반환해야한다는 것입니다. 리턴 값이 true 인 경우 배열 요소를 결과 배열에 추가하십시오. 예를 들어, 다음 코드는 문자 x로 시작하지 않는 원래 배열의 요소를 제거합니다. 이 예에서, 정규 표현식 (map() Math.sqrt()

Every () 및 일부 ()

["a", "b", "c", "d"].forEach(function(element, index, array) {
  console.log(element);
});

및

함수는 각 배열 요소에서 콜백 함수를 실행합니다. 각 콜백 함수가 true를 반환하면 는 true를 반환합니다. 그렇지 않으면 거짓. 마찬가지로, 적어도 하나의 콜백 함수가 true를 반환하면 가 true를 반환합니다. 다음 예에서는 및

가 배열 요소가 5 미만인지 테스트하는 데 사용됩니다. 이 경우 마지막 요소는 5와 같기 때문에 가 False를 반환합니다. 그러나 는 적어도 하나의 요소가 5 미만이므로 true를 반환합니다. 인덱스 및 배열 매개 변수는 존재하지만이 예에서는 필요하지 않으므로 콜백 함수에서 생략되었습니다.

forEach() reduce () 및 reduceRight () map()

메소드는 배열에서 각 요소를 처리하고 단일 값을 계산합니다. 콜백 함수와 선택적 초기 값을 매개 변수로 선호합니다. 초기 값이 없으면 첫 번째 배열 요소가 사용됩니다. 콜백 함수는 지금까지 본 다른 콜백 함수와 다릅니다. 이전 값, 현재 값, 인덱스 및 배열의 ​​네 가지 매개 변수를 수락합니다. 작업의 일반적인 예는 배열의 모든 값을 추가하는 것입니다. 다음 예제는 정확히 수행합니다. 콜백 함수가 처음으로 호출되면 reduce()는 1과 같고 reduce()는 2와 같습니다. 후속 호출에서 합은 최종 값 15로 축적됩니다. reduce() reduce previous 메소드는 프로세스가 배열 끝에서 시작하여 시작으로 이동한다는 점을 제외하고 current와 동일한 방식으로 작동합니다.

indexof () 및 lastIndexof ()

var foo = ["a", "b", "c", "d"];

for (var i = 0, len = foo.length; i < len; i++) {
  console.log(foo[i]);
}

메소드는 배열에서 특정 요소를 검색하고 첫 번째 일치의 인덱스를 반환합니다. 일치가 발견되지 않으면

는 -1을 반환합니다. 요소를 첫 번째 매개 변수로 검색해야합니다. 두 번째 선택적 매개 변수는 검색의 시작 인덱스를 지정합니다. 예를 들어, 다음 코드는 배열에서 문자 z의 처음 두 가지 발생을 찾습니다. 두 번째 모양을 찾으려면 첫 번째 모양을 찾아서 다시 검색을 시작하면됩니다. reduceRight() reduce()

메소드는 배열 끝에서 검색을 시작한다는 점을 제외하고는 정확히 동일한 방식으로 작동합니다.

결론 배열 확장 기능을 사용하여 간결하고 명확한 코드를 작성하십시오. 불행히도 일부 이전 브라우저는 이러한 방법을 지원하지 않습니다. 그러나

객체 (즉, )를 확인하여 이러한 방법을 감지 할 수 있습니다. 메소드가 누락 된 경우 자신의 구현을 쉽게 제공 할 수 있습니다.

indexOf() (FAQ 부품은 여기에 추가되어야합니다. 내용은 입력 텍스트의 FAQ 부분과 동일하지만, 명령문의 순서 조정, 동의어 대체 등의 해당 의사 원리 수정이 필요합니다. 등) indexOf() indexOf()

위 내용은 JavaScript의 엑스트라를 배열합니다의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!