[js] ES3 부터 ES6 까지 어떻게 배열 하 는 지 가르쳐 줄 게.

성명
다음 방법 은 그룹 값 이 모두 primitive data type 에 속 하 는 경우 에 만 유효 합 니 다.
ES6
방법 1: 데이터 구조 설정 + Array. from 정적 방법
ES6 에 Set 데이터 구 조 를 추 가 했 습 니 다. 배열 과 유사 하지만 구성원 은 모두 유일한 것 입 니 다. 구조 함 수 는 하나의 배열 을 매개 변수 로 받 아들 일 수 있 습 니 다. 예 를 들 어:

 let array = [1, 1, 1, 1, 2, 3, 4, 4, 5, 3];
 let set = new Set(array);
 let deduped = Array.from(set);// `deduped = de + dup(duplication) + ed`
 console.log(deduped);
 // [1, 2, 3, 4, 5]

방법 2: 데이터 구조 설정 + 확장 문법 (spread syntax)

let array = [1, 1, 1, 1, 2, 3, 4, 4, 5, 3];
let deduped = [...new Set(array)];
console.log(deduped);
 // [1, 2, 3, 4, 5]

확장 문법 은 모든 옮 겨 다 닐 수 있 는 대상 에 게 유효 합 니 다.

let obj = {'key1': 'value1'};
let array = [...obj]; 
// TypeError: obj is not iterable

방법 3: 화살표 함수 + es5 문법 (filter, indexOf)

let array = [1, 1, 1, 1, 2, 3, 4, 4, 5, 3];
let deduped = array.filter((el,i,arr) => arr.indexOf(el) === i);
console.log(deduped);
 // [1, 2, 3, 4, 5]

ES5

var array = [1, 1, 1, 1, 2, 3, 4, 4, 5, 3];
var deduped = array.filter(function(el,i,arr) {
    return arr.indexOf(el) === i;
})
console.log(deduped);
 // [1, 2, 3, 4, 5]

lt_ES5

var array = [1, 1, 1, 1, 2, 3, 4, 4, 5, 3,[1,2],[3,4]];
var deduped = [];
for(var i=0, l=array.length;i

지식 보충 - index Of 에 대하 여
브 라 우 저 호환성
IE6 - 8 에서 배열 의 index Of 방법 은 존재 하지 않 습 니 다.그래서 IE6 - 8 호 환 이 필요 하 다 면 스스로 바퀴 를 만들어 야 합 니 다.

var indexOf = [].indexOf ?
    function(arr, item) {
      return arr.indexOf(item)
    } :
    function indexOf(arr, item) {
      for (var i = 0; i < arr.length; i++) {
        if (arr[i] === item) {
          return i
        }
      }
      return -1
    }

성능 - 시간 복잡 도
set 데이터 구 조 를 이용 하 는 것 이 컨 닝 방식 이 라면 index Of 를 사용 하 는 것 은 상대 적 으로 성능 이 떨 어 지 는 방식 이다. index Of 의 밑바닥 도 한 번 에 옮 겨 다 니 기 때문이다.끼 워 넣 기 순환 은 성능 의 극 치 를 추구 하 는 사람 을 불쾌 하 게 한다.
① arr push 를 새 배열 로 옮 겨 다 니 기 ② 그 중에서 한 번 순환 할 때마다 배열 을 호출 하 는 index Of 방법 은 한 번 에 옮 겨 다 니 기 때문에 두 번 순환 하 는 것 과 같 고 복잡 도 는 O (n2) 이다.
이러한 상황 에서 성능 을 추구 하기 위해 더욱 좋 은 실현 방식 은 대상 키 를 이용 한 유일한 처리 이다.먼저 배열 을 대상 으로 바 꾸 고 그 다음 에 대상 을 무 거 운 배열 로 전환한다.예 를 들 면:

var songs = [
         {name:"  C",artist:"  "},
         {name:"  C",artist:"  "},
         {name:"   ",artist:"  "},
         {name:"   ",artist:"  "},
         {artist:"  ",name:"   "}
     ];

function unique(songs){
  let result = {};
  let finalResult=[];
  //        ，    key      
  songs.forEach(function(song, i){
    result[song.name]=song;
  })
  //             
  Object.keys(result).forEach(function(key, i){
    finalResult.push(result[key]);
  })
  
  return finalResult;
}

console.log(unique(songs));

//   ：     forEach      for      。
//   ：https://github.com/jawil/blog/issues/2

2017 - 11 - 16 업데이트.실제로 이것 은 적어도 두 번 의 순환 을 사 용 했 지만 여전히 비효 율 적 이다.가장 간단 한 배열 이 무 거 워 지 려 면 한 층 의 순환 만 하면 되 기 때문이다.
더 복잡 한 사례 는 필자 가 쓴 이 demo 를 볼 수 있다.
참고 자료
https://github.com/lifesinger/blog/issues/113