es6 필터를 사용하여 대상 그룹의 무게를 줄입니다
13937 단어 프런트엔드 기술
일반적인 탈중 방식
var arr = [1, 2, 2, 3, 4, 5, 5, 6, 7, 7,8,8,0,8,6,3,4,56,2];
var arr2 = arr.filter((x, index,self)=>{
// self:
// x:
// index:
return self.indexOf(x)===index
})
console.log(arr2); //[1, 2, 3, 4, 5, 6, 7, 8, 0, 56]
이 방법은 리셋 메커니즘을 판단합니다: Filter에 익명 함수를 정의했습니다. Filter 방법에서 목표 그룹을 옮겨다니며, 그룹의 모든 요소에 대해 자신이 정의한 익명 함수에 의해 한 번씩 실행되고, 매번 boolean 값을 되돌려줍니다.false를 되돌려주면 이 요소를 그룹에서 제거합니다.마지막으로 Filter 방법은 처리 결과로 새로운 그룹 대상을 되돌려줍니다.이러한 방식의 한계성: 안의 판단이 같기 때문에 indexOf(x)를 사용한다. 현재 원소가 처음 나타난 위치를 얻고 이 위치가 현재 원소의 하표와 같은지 판단한다. 만약 같지 않으면 다른 위치에서 나타난 동일한 값을 설명하고false로 돌아간다.이런 방식은 단순 원소의 수조에만 사용할 수 있을 뿐 판단 대상에는 사용할 수 없다.
상대를 중복시키다
var arr = [
{
'id':1,
'name':'fsdf'
},
{
'id':1,
'name':'fsdf'
},
{
'id':2,
'name':'fsdf'
},
{
'id':2,
'name':'fsdf'
},
{
'id':3,
'name':'fsdf'
},
];
var arr2 = arr.filter((x, index,self)=>{
var arrids = []
arr.forEach((item,i) => {
arrids.push(item.id)
})
return arrids.indexOf(x.id) === index
})
console.log(arr2);
실현 원리: 이것은 같은 id가 있는 대상을 제거하고 각 원소의 id를 단독으로 꺼내 새로운 수조에 넣은 다음에 위의 방식을 이용하여 똑같은 결함을 제거하는 것이다. 대상 수조에 있는 대상의 특정한 속성이 중복되는지 판단하는 데만 사용할 수 있다.
추가 최적화(여러 필드가 동시에 반복되는 것을 판단하기 위한 객체)
var arr = [
{
'id':1,
'name':'fsdfwsd',
},
{
'id':1,
'name':'fsdfwsd',
},
{
'id':1,
'name':'ythrg'
},
{
'id':2,
'name':'trhwfre'
},
{
'id':2,
'name':'lokfjks'
},
{
'id':2,
'name':'trhwfre'
},
{
'id':3,
'name':'trewtw'
},
];
var arr2 = arr.filter((x, index,self)=>{
var arrids = []
var arrnames = []
arr.forEach((item,i) => {
arrids.push(item.id)
arrnames.push(item.name)
})
var judgeOne = arrids.indexOf(x.id) === index
var judgeTwo = arrnames.indexOf(x.name) === index
return judgeOne || judgeTwo
})
console.log(arr2);
실현 방식: 여러 대상의 필드를 판단하려면 위의 방식을 계속 사용할 수 있다. 판단할 다른 필드를 같은 그룹에 넣고 마지막으로 여러 그룹에 대해 판단한다. 마지막으로false가 하나면false로 되돌아간다.
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
프런트엔드 성능5).브라우저는 서버에서 응답을 받은 후 데이터를 해석하여 실행합니다. 우리가 요청한 네트워크 파일에 많은 그림이 필요할 때 브라우저는 서버와 자주 연결되고 연결을 해제합니다. 이것은 시간이 많이 걸리고 성능 부담이...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.