두 개의 JavaScript 배열이 있습니다.
var array1 = ["Vijendra","Singh"];
var array2 = ["Singh", "Shakya"];
출력을 원합니다.
var array3 = ["Vijendra","Singh","Shakya"];
출력 배열은 반복 된 단어를 제거해야합니다.
JavaScript에서 두 개의 배열을 병합하여 원래 배열에 삽입 된 순서와 동일한 순서로 각 배열에서 고유 한 항목 만 가져 오려면 어떻게합니까?
답변
중복을 제거하지 않고 배열을 병합하려면
ES5 버전 사용 Array.concat
:
var array1 = ["Vijendra", "Singh"];
var array2 = ["Singh", "Shakya"];
console.log(array1.concat(array2));
ES6 버전 사용 파괴
const array1 = ["Vijendra","Singh"];
const array2 = ["Singh", "Shakya"];
const array3 = [...array1, ...array2];
중복을 제거하는 ‘내장’방법이 없기 때문에 ( ECMA-262는 실제로이 기능을 사용 Array.forEach
하는 것이 좋습니다) 수동으로 수행해야합니다.
Array.prototype.unique = function() {
var a = this.concat();
for(var i=0; i<a.length; ++i) {
for(var j=i+1; j<a.length; ++j) {
if(a[i] === a[j])
a.splice(j--, 1);
}
}
return a;
};
그런 다음 사용하십시오.
var array1 = ["Vijendra","Singh"];
var array2 = ["Singh", "Shakya"];
// Merges both arrays and gets unique items
var array3 = array1.concat(array2).unique();
이것은 또한 배열의 순서를 유지합니다 (즉, 정렬이 필요하지 않습니다).
많은 사람들이 프로토 타입 기능 보강 Array.prototype
및 for in
루프 에 대해 짜증을 내고 있기 때문에 이를 사용하는 덜 침습적 인 방법은 다음과 같습니다.
function arrayUnique(array) {
var a = array.concat();
for(var i=0; i<a.length; ++i) {
for(var j=i+1; j<a.length; ++j) {
if(a[i] === a[j])
a.splice(j--, 1);
}
}
return a;
}
var array1 = ["Vijendra","Singh"];
var array2 = ["Singh", "Shakya"];
// Merges both arrays and gets unique items
var array3 = arrayUnique(array1.concat(array2));
ES5를 사용할 수있는 브라우저로 작업 할 수있을만큼 운이 좋은 사람들은 다음 Object.defineProperty
과 같이 사용할 수 있습니다 .
Object.defineProperty(Array.prototype, 'unique', {
enumerable: false,
configurable: false,
writable: false,
value: function() {
var a = this.concat();
for(var i=0; i<a.length; ++i) {
for(var j=i+1; j<a.length; ++j) {
if(a[i] === a[j])
a.splice(j--, 1);
}
}
return a;
}
});
답변
Underscore.js 또는 Lo-Dash를 사용하면 다음을 수행 할 수 있습니다.
console.log(_.union([1, 2, 3], [101, 2, 1, 10], [2, 1]));
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.15/lodash.min.js"></script>
답변
먼저 두 배열을 연결 한 다음 고유 항목 만 필터링하십시오.
var a = [1, 2, 3], b = [101, 2, 1, 10]
var c = a.concat(b)
var d = c.filter((item, pos) => c.indexOf(item) === pos)
console.log(d) // d is [1, 2, 3, 101, 10]
편집하다
제안 된대로보다 현명한 솔루션은 다음 b
과 연결하기 전에 고유 항목을 필터링하는 것 입니다 a
.
var a = [1, 2, 3], b = [101, 2, 1, 10]
var c = a.concat(b.filter((item) => a.indexOf(item) < 0))
console.log(c) // c is [1, 2, 3, 101, 10]
답변
이것은 스프레드 연산자 와 배열 제네릭을 사용하는 ECMAScript 6 솔루션 입니다.
현재는 Firefox 및 Internet Explorer Technical Preview에서만 작동합니다.
그러나 Babel 을 사용 하면 지금 가질 수 있습니다.
const input = [
[1, 2, 3],
[101, 2, 1, 10],
[2, 1]
];
const mergeDedupe = (arr) => {
return [...new Set([].concat(...arr))];
}
console.log('output', mergeDedupe(input));
답변
ES6
array1.push(...array2) // => don't remove duplication
또는
[...array1,...array2] // => don't remove duplication
또는
[...new Set([...array1 ,...array2])]; // => remove duplication
답변
사용 설정 (2015 인 ECMAScript)를, 그 한 간단하게 될 것입니다 :
const array1 = ["Vijendra", "Singh"];
const array2 = ["Singh", "Shakya"];
console.log(Array.from(new Set(array1.concat(array2))));
답변
루프에 약간의 차이가 있습니다. 최신 버전의 Chrome에서 일부 최적화 기능을 사용하면 두 배열의 통합을 해결하는 가장 빠른 방법입니다 (Chrome 38.0.2111).
http://jsperf.com/merge-two-arrays-keeping-only-unique-values
var array1 = ["Vijendra", "Singh"];
var array2 = ["Singh", "Shakya"];
var array3 = [];
var arr = array1.concat(array2),
len = arr.length;
while (len--) {
var itm = arr[len];
if (array3.indexOf(itm) === -1) {
array3.unshift(itm);
}
}
while 루프 : ~ 589k ops / s
필터 : ~ 445k ops / s
lodash :
루프 의 경우 308k ops / s : 225k ops / s
의견에 따르면 내 설정 변수 중 하나가 쓰기 위해 빈 배열을 초기화 할 필요가 없기 때문에 루프가 나머지 루프보다 우선합니다. 나는 이에 동의하므로 테스트를 경기장까지 다시 작성했으며 더 빠른 옵션을 포함 시켰습니다.
http://jsperf.com/merge-two-arrays-keeping-only-unique-values/52
let whileLoopAlt = function (array1, array2) {
const array3 = array1.slice(0);
let len1 = array1.length;
let len2 = array2.length;
const assoc = {};
while (len1--) {
assoc[array1[len1]] = null;
}
while (len2--) {
let itm = array2[len2];
if (assoc[itm] === undefined) { // Eliminate the indexOf call
array3.push(itm);
assoc[itm] = null;
}
}
return array3;
};
이 대체 솔루션에서는 하나의 답변의 연관 배열 솔루션을 결합 .indexOf()
하여 루프 에서 호출 을 제거하여 두 번째 루프로 많은 속도를 늦췄으며 다른 사용자가 제안한 다른 최적화도 포함했습니다. .
모든 값 (i-1)에서 이중 루프를 사용하는 가장 좋은 대답은 여전히 상당히 느립니다. lodash는 여전히 강력하고 있으며 프로젝트에 라이브러리를 추가하지 않는 사람에게는 여전히 좋습니다. 원하지 않는 사람들을 위해, 내 while 루프는 여전히 좋은 대답이며 필터 답변은 여기에 매우 강력하게 표시 되어이 글을 쓰는 시점에서 최신 Canary Chrome (44.0.2360)으로 내 테스트를 모두 능가합니다.
체크 아웃 마이크의 대답 과 댄 스토커의 답변을 당신이 속도 노치를 그것을 단계로합니다. 그것들은 거의 모든 가능한 답변을 거친 후 모든 결과 중 가장 빠릅니다.