es6에서 필터의 기능은 무엇입니까-프런트엔드 Q&A-php.cn

es6에서 필터 필터는 배열 요소를 필터링하고 새 배열을 반환합니다. filter() 함수는 제공된 콜백 함수를 통해 구현된 테스트의 모든 요소를 포함하는 새 배열을 생성합니다. 구문 "arr.filter(callback(element[, index[, array]])[, thisArg])"; 테스트를 통과한 배열 요소가 없으면 빈 배열이 반환됩니다.

es6에서 필터의 기능은 무엇입니까

이 튜토리얼의 운영 환경: Windows 7 시스템, ECMAScript 버전 6, Dell G3 컴퓨터.

ES6

filter 함수는 일반적으로 필터로 알려져 있습니다. 함수: 배열 요소를 필터링하고 새 배열을 반환합니다.

filter() 메서드는 전달된 모든 요소를 포함하는 새 배열을 생성합니다. 함수에 의해 구현된 테스트 요소입니다.

var sexData=["男","女","女","男","女"]; var filter2=sexData.filter(function(sex){ return sex==="女" }) //console.log(filter2) ["女", "女", "女"]

로그인 후 복사

var porducts = [ {name: 'apple',type: 'red'} , {name: 'orange',type: 'orange'}, {name: 'banana',type: 'yellow'}, {name: 'mango',type: 'yellow'} ]; var filter2=porducts.filter(function(item){ return item.type==='yellow' }) //console.log(filter2) //0: {name: "banana", type: "yellow"}1: {name: "mango", type: "yellow"}

로그인 후 복사

Syntax

var newArray = arr.filter( callback(element[, index[, array]])[, thisArg] )

로그인 후 복사

Parameters

callback: 콜백 함수
element: arr 배열에서 처리되는 데이터
index: 요소의 첨자, 선택사항
배열: 필터를 호출한 배열 자체, 선택사항
thisArg: 콜백 실행 시 이에 사용되는 값, 선택사항

반환값

배열 요소가 통과하지 못한 경우 테스트를 통과한 요소들로 구성된 새로운 배열 테스트에서는 빈 배열이 반환됩니다.

Description

filter는 배열의 각 요소에 대해 콜백 함수를 한 번씩 호출하고 콜백이 true 또는 true와 동등한 값을 반환하는 모든 요소가 포함된 새 배열을 만듭니다. 콜백은 값이 할당된 인덱스에서만 호출되며, 삭제되었거나 값이 할당된 적이 없는 인덱스에서는 호출되지 않습니다. 콜백 테스트에 실패한 요소는 건너뛰고 새 배열에 포함되지 않습니다.
콜백이 호출되면 세 가지 매개변수가 전달됩니다: 요소의 값, 요소의 인덱스, 탐색되는 배열 자체
필터에 thisArg 매개변수가 제공되면 this 값으로 사용됩니다. 콜백이 호출될 때. 그렇지 않으면 콜백의 this 값은 비엄격 모드에서는 전역 객체가 되고 엄격 모드에서는 정의되지 않습니다. 콜백 함수에서 최종적으로 관찰되는 this의 값은 일반 함수에서 보이는 "this"의 규칙에 따라 결정됩니다.
filter는 원래 배열을 변경하지 않고 필터링된 새 배열을 반환합니다.
filter 콜백이 처음 호출되기 전에 탐색되는 요소의 범위가 결정되었습니다. 필터가 호출된 후 배열에 추가된 요소는 필터로 순회되지 않습니다. 기존 요소가 변경된 경우 콜백에 전달되는 값은 필터가 해당 요소를 순회하는 순간의 값입니다. 삭제되었거나 값이 할당되지 않은 요소는 순회되지 않습니다.

특수 사용법:

1. 빈 문자열 제거, 정의되지 않음, null

array.filter((value, index, arr) => {value})

로그인 후 복사

2. 배열 중복 제거

array.filter((value, index, arr) => {arr.indexOf(value) === index})

로그인 후 복사

Example

1. 예제 사용법 filter()가 생성합니다. 0이 아닌 ID를 가진 요소의 json입니다.

var arr = [ { id: 15 }, { id: -1 }, { id: 0 }, { id: 3 }, { id: 12.2 }, { }, { id: null }, { id: NaN }, { id: 'undefined' }];var invalidEntries = 0;function isNumber(obj) { return obj !== undefined && typeof(obj) === 'number' && !isNaN(obj);}function filterByID(item) { if (isNumber(item.id) && item.id !== 0) { return true; } invalidEntries++; return false; }var arrByID = arr.filter(filterByID);console.log('Filtered Array\n', arrByID); // Filtered Array// [{ id: 15 }, { id: -1 }, { id: 3 }, { id: 12.2 }]console.log('Number of Invalid Entries = ', invalidEntries); // Number of Invalid Entries = 5

로그인 후 복사

2. 정의되지 않은 빈 문자열 제거

//2. 去掉空字符串、undefined、null var porducts = [ {name:''}, {name:"哈哈"} ]; var filter2=porducts.filter(function(item){ return item.name }) //console.log(filter2) //打印得出 0: {name: "哈哈"}

로그인 후 복사

3. 배열에서 중복 항목 제거

//3. 数组去重 array.filter((value, index, arr) => {arr.indexOf(value) === index}) var porducts = ['苹果','香蕉','苹果','芒果'] var filter2=porducts.filter(function(item,index,porducts){ return porducts.indexOf(item)==index }) //console.log(filter2) // ["苹果", "香蕉", "芒果"]

로그인 후 복사

[권장 학습:

javascript 고급 튜토리얼

]

위 내용은 es6에서 필터의 기능은 무엇입니까의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!