N 배열을 연결하는 가장 효율적인 방법은 무엇입니까?

JavaScript에서 N 개의 객체 배열을 연결하는 가장 효율적인 방법은 무엇입니까?

배열은 변경 가능하며 결과는 입력 배열 중 하나에 저장 될 수 있습니다.

두 개 이상의 어레이를 연결하는 경우 concat()편의성과 성능을 기대할 수있는 방법입니다.

var a = [1, 2], b = ["x", "y"], c = [true, false];
var d = a.concat(b, c);
console.log(d); // [1, 2, "x", "y", true, false];

두 개의 배열 만 연결 push하려면 배열에 추가 할 요소로 구성된 여러 인수 를 허용 한다는 사실을 사용하여 새 배열을 생성하지 않고 한 배열에서 다른 배열의 끝으로 요소를 추가 할 수 있습니다. 함께 slice()사용할 수도 concat()있지만 이렇게하면 성능 이점이없는 것 같습니다 .

var a = [1, 2], b = ["x", "y"];
a.push.apply(a, b);
console.log(a); // [1, 2, "x", "y"];

ECMAScript 2015 및 이후 버전에서는

a.push(...b)

그러나 대규모 배열 (10 만 멤버 이상)의 경우 배열을 요소 push( apply()ECMAScript 2015 스프레드 연산자를 사용 하거나 사용)에 전달하는 기술 이 실패 할 수 있습니다. 이러한 배열의 경우 루프를 사용하는 것이 더 좋습니다. 자세한 내용은 https://stackoverflow.com/a/17368101/96100 을 참조하십시오.

[].concat.apply([], [array1, array2, ...])

편집 : 효율성 증명 : http://jsperf.com/multi-array-concat/7

edit2 : Tim Supinie는 주석에서 해석기가 호출 스택 크기를 초과 할 수 있다고 언급했습니다. 이것은 아마도 js 엔진에 달려 있지만 Chrome에서 적어도 "최대 호출 스택 크기 초과"를 얻었습니다. 테스트 사례 : [].concat.apply([], Array(300000).fill().map(_=>[1,2,3])). (현재 승인 된 답변을 사용하여 동일한 오류가 발생 했으므로 그러한 사용 사례를 예상하거나 다른 사람들을 위해 라이브러리를 구축 중이므로 어떤 솔루션을 선택하든 특별한 테스트가 필요할 수 있습니다.)

ES2015 (ES6)를 사용하는 사람들

이제 스프레드 구문을 사용하여 배열을 연결할 수 있습니다.

const arr1 = [0, 1, 2],
      arr2 = [3, 4, 5];

const result1 = [...arr1, ...arr2]; // -> [0, 1, 2, 3, 4, 5]

// or...

const result2 = [...arr2, ...arr1]; // -> [3, 4, 5, 0, 1, 2]

이 concat()방법은 둘 이상의 배열을 결합하는 데 사용됩니다. 기존 배열은 변경하지 않고 결합 된 배열의 사본 만 반환합니다.

array1 = array1.concat(array2, array3, array4, ..., arrayN);

Array.prototype.concat.apply를 사용하여 여러 배열의 연결을 처리하십시오.

var resultArray = Array.prototype.concat.apply([], arrayOfArraysToConcat);

예:

var a1 = [1, 2, 3],
    a2 = [4, 5],
    a3 = [6, 7, 8, 9];
Array.prototype.concat.apply([], [a1, a2, a3]); // [1, 2, 3, 4, 5, 6, 7, 8, 9]

맵 / 필터 / 정렬 등을 통해 결과를 파이핑하는 동안 배열의 배열을 연결하려는 경우 사용할 수 있습니다 reduce

let sorted_nums = ['1,3', '4,2']
  .map(item => item.split(','))   // [['1', '3'], ['4', '2']]
  .reduce((a, b) => a.concat(b))  // ['1', '3', '4', '2']
  .sort()                         // ['1', '2', '3', '4']

여러 어레이 및 ES6의 경우

Array.prototype.concat(...arr);

예를 들면 다음과 같습니다.

const arr = [[1, 2, 3], [4, 5, 6], [7, 8 ,9]];
const newArr = Array.prototype.concat(...arr);
// output: [ 1, 2, 3, 4, 5, 6, 7, 8, 9 ]

이제를 사용하여 여러 배열을 결합 할 수 있습니다 ES6 Spread. concat()배열을 연결 하는 데 사용 하는 대신 확산 구문을 사용하여 여러 배열을 하나의 평평한 배열로 결합하십시오. 예 :

var a = [1,2];
var b = [3,4];
var c = [5,6,7];
var d = [...a, ...b, ...c];
// resulting array will be like d = [1,2,3,4,5,6,7]

이렇게 해결했습니다.

let arr = [[1, 2], [3, 4], [5, 6]];
 console.log([].concat(...arr));

jsperf.com 사이트를 사용 하여 성능을 비교할 수 있습니다 . concat에 대한 링크는 다음과 같습니다. 입니다.

다음 사이에 비교를 추가했습니다.

var c = a.concat(b);

과:

var c = [];
for (i = 0; i < a.length; i++) {
    c.push(a[i]);
}
for (j = 0; j < b.length; j++) {
    c.push(b[j]);
}

두 번째는 크롬에서 거의 10 배 느립니다.

concat 기능으로 쉽게 :

var a = [1,2,3];
var b = [2,3,4];
a = a.concat(b);
>> [1,2,3,2,3,4]

여러 배열을 연결할 수있는 함수는 다음과 같습니다.

function concatNarrays(args) {
    args = Array.prototype.slice.call(arguments);
    var newArr = args.reduce( function(prev, next) {
       return prev.concat(next) ;
    });

    return newArr;
}

예 -

console.log(concatNarrays([1, 2, 3], [5, 2, 1, 4], [2,8,9]));

출력합니다

[1,2,3,5,2,1,4,2,8,9]

배열 배열이 있고 요소를 단일 배열로 연결하려면 다음 코드를 시도하십시오 (ES2015 필요).

let arrOfArr = [[1,2,3,4],[5,6,7,8]];
let newArr = [];
for (let arr of arrOfArr) {
    newArr.push(...arr);
}

console.log(newArr);
//Output: [1,2,3,4,5,6,7,8];

또는 함수형 프로그래밍을하고 있다면

let arrOfArr = [[1,2,3,4],[5,6,7,8]];
let newArr = arrOfArr.reduce((result,current)=>{
    result.push(...current);
    return result;
});

console.log(newArr);
//Output: [1,2,3,4,5,6,7,8];

또는 스프레드 연산자없이 ES5 구문을 사용하면 더 좋습니다.

var arrOfArr = [[1,2,3,4],[5,6,7,8]];
var newArr = arrOfArr.reduce((result,current)=>{
    return result.concat(current);
});
console.log(newArr);
//Output: [1,2,3,4,5,6,7,8];

이 방법은 번호를 모르면 편리합니다. 코드 시간에 배열.

ES6로 줄이십시오.

new Set([].concat(...Array));

이것은 여러 배열을 연결 하고 독특하게 만듭니다 .

코드 펜 데모

푸시로 어레이 병합 :

const array1 = [2, 7, 4];
const array2 = [3, 5,9];
array1.push(...array2);
console.log(array1)

사용 CONCAT 및 확산 운영자 :

const array1 = [1,2];
const array2 = [3,4];

// Method 1: Concat 
const combined1 = [].concat(array1, array2);

// Method 2: Spread
const combined2 = [...array1, ...array2];

console.log(combined1);
console.log(combined2);

여기서 'n'은 몇 개의 배열, 아마도 배열의 배열입니다. . .

var answer = _.reduce (n, function (a, b) {return a.concat (b)})

연결할 두 개의 배열 만 있고 실제로 추가 해야하는 경우 새 배열을 만들지 않고 배열 중 하나 경우 푸시 또는 루프를 사용하는 방법입니다.

벤치 마크 : https://jsperf.com/concat-small-arrays-vs-push-vs-loop/

이 시도:

i=new Array("aaaa", "bbbb");
j=new Array("cccc", "dddd");

i=i.concat(j);

N 배열을 데이터베이스에서 가져 와서 하드 코딩하지 않은 경우 ES6을 사용하여 이와 같이 수행합니다.

let get_fruits = [...get_fruits , ...DBContent.fruit];