JavaScript로 나만의 지도, 필터 및 축소 만들기

王林
풀어 주다: 2024-07-24 12:24:52
원래의
858명이 탐색했습니다.

Building Your Own Map, Filter, and Reduce in JavaScript

이 게시물에서는 이러한 JavaScript 강국의 내부 작동 방식을 자세히 살펴봅니다. 우리는 그것들을 단지 사용하지 않을 것입니다; Array.prototype을 사용하여 사용자 정의 지도, 필터 및 축소 메서드를 만들어 이를 해체하고 재구성할 것입니다. 이러한 함수를 분석함으로써 해당 작업에 대한 귀중한 통찰력을 얻고 JavaScript의 배열 조작 기능을 능숙하게 활용할 수 있게 됩니다.

맞춤형 지도 방법:

JavaScript의 지도 메소드는 각 요소에 함수를 적용하여 배열을 변환하는 데 중요한 역할을 합니다. Array.prototype:
을 사용하여 사용자 정의 지도 방법을 만들어 보겠습니다.

// Custom map method for arrays
Array.prototype.customMap = function(callback) {
  const result = [];

  for (let i = 0; i < this.length; i++) {
    result.push(callback(this[i], i, this));
  }

  return result;
};

// Example usage:
const numbers = [1, 2, 3, 4, 5];
const doubledNumbers = numbers.customMap((num) => num * 2);
console.log(doubledNumbers); // [2, 4, 6, 8, 10]
로그인 후 복사

이 사용자 정의 지도 메소드에서는 입력 배열의 각 요소를 반복하고 제공된 콜백 함수를 각 요소에 적용한 다음 결과를 새 배열에 푸시한 다음 반환합니다.

맞춤 필터 방법:

필터 메소드를 사용하면 특정 조건을 만족하는 요소가 포함된 새 배열을 생성할 수 있습니다. Array.prototype:
을 사용하여 사용자 정의 필터 메서드를 만들어 보겠습니다.

// Custom filter method for arrays
Array.prototype.customFilter = function(callback) {
  const result = [];

  for (let i = 0; i < this.length; i++) {
    if (callback(this[i], i, this)) {
      result.push(this[i]);
    }
  }

  return result;
};

// Example usage:
const numbers = [1, 2, 3, 4, 5];
const evenNumbers = numbers.customFilter((num) => num % 2 === 0);
console.log(evenNumbers); // [2, 4]
로그인 후 복사

이 사용자 정의 필터 메서드에서는 입력 배열의 각 요소를 반복하고, 제공된 콜백 함수를 각 요소에 적용하고, 콜백이 true를 반환하면 해당 요소를 결과 배열에 추가한 다음 반환됩니다.

사용자 정의 축소 방법:

사용자 정의 축소 방법을 생성하려면 초기 값을 처리해야 합니다. Array.prototype:
을 사용하여 사용자 지정 축소 메서드를 만들어 보겠습니다.

// Custom reduce method for arrays
Array.prototype.customReduce = function(callback, initialValue) {
  let accumulator = initialValue === undefined ? this[0] : initialValue;
  const startIndex = initialValue === undefined ? 1 : 0;

  for (let i = startIndex; i < this.length; i++) {
    accumulator = callback(accumulator, this[i], i, this);
  }

  return accumulator;
};

// Example usage:
const numbers = [1, 2, 3, 4, 5];
const sum = numbers.customReduce((accumulator, current) => accumulator + current, 0);
console.log(sum); // 15
로그인 후 복사

이제 모든 배열에서 사용할 수 있는 customReduce 메서드가 생겼습니다. 이 사용자 지정 축소 메서드에서는 제공된 초기 값 또는 초기 값이 제공되지 않은 경우 첫 번째 요소부터 시작하여 배열을 반복합니다. 각 요소에 콜백 함수를 적용하여 각 단계에서 누산기 값을 업데이트하고 최종적으로 누적된 결과를 반환합니다.

결론:

숙련된 JavaScript 개발을 위해서는 맵, 필터, 축소 등 JavaScript 배열 메소드의 내부 작동 방식을 이해하는 것이 필수적입니다. Array.prototype을 사용하여 이러한 메서드의 사용자 정의 버전을 생성함으로써 우리는 기본 원칙에 대한 통찰력을 얻었습니다. 이러한 사용자 정의 방법은 개념 이해를 도울 뿐만 아니라 프로그래밍 언어로서 JavaScript의 다양성과 강력함을 강조합니다.

위 내용은 JavaScript로 나만의 지도, 필터 및 축소 만들기의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:dev.to
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿
회사 소개 부인 성명 Sitemap
PHP 중국어 웹사이트:공공복지 온라인 PHP 교육,PHP 학습자의 빠른 성장을 도와주세요!