Cách hiệu quả nhất để nối các mảng N là gì?

Cách hiệu quả nhất để nối N mảng của các đối tượng trong JavaScript là gì?

Các mảng có thể thay đổi và kết quả có thể được lưu trữ trong một trong các mảng đầu vào.

Nếu bạn đang nối nhiều hơn hai mảng, đó concat()là cách để thuận tiện và có khả năng thực hiện.

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];

Để ghép chỉ hai mảng, thực tế là pushchấp nhận nhiều đối số bao gồm các phần tử để thêm vào mảng thay vào đó để thêm các phần tử từ một mảng vào cuối mảng khác mà không tạo ra một mảng mới. Với slice()nó cũng có thể được sử dụng thay thế concat()nhưng dường như không có lợi thế về hiệu suất từ ​​việc này .

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

Trong ECMAScript 2015 trở lên, điều này có thể được giảm hơn nữa đến

a.push(...b)

Tuy nhiên, dường như đối với các mảng lớn (có thứ tự từ 100.000 thành viên trở lên), kỹ thuật chuyển một mảng các phần tử sang push(sử dụng apply()hoặc toán tử trải ECMAScript 2015) có thể thất bại. Đối với các mảng như vậy, sử dụng một vòng lặp là một cách tiếp cận tốt hơn. Xem https://stackoverflow.com/a/17368101/96100 để biết chi tiết.

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

chỉnh sửa : bằng chứng về hiệu quả: http://jsperf.com/multi-array-concat/7

edit2 : Tim Supinie đề cập trong các ý kiến rằng điều này có thể gây ra các thông dịch viên để vượt quá kích thước gọi stack. Điều này có lẽ phụ thuộc vào công cụ js, nhưng tôi cũng đã nhận được "vượt quá kích thước ngăn xếp cuộc gọi tối đa" trên Chrome. Trường hợp thử nghiệm : [].concat.apply([], Array(300000).fill().map(_=>[1,2,3])). .

Đối với những người sử dụng ES2015 (ES6)

Bây giờ bạn có thể sử dụng Cú pháp trải rộng để nối các mảng:

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]

Các concat()phương pháp được sử dụng để nối hai hoặc nhiều mảng. Nó không thay đổi các mảng hiện có, nó chỉ trả về một bản sao của các mảng đã tham gia.

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

Sử dụng Array.prototype.concat.apply để xử lý kết nối nhiều mảng:

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

Thí dụ:

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]

Nếu bạn đang ở giữa đường ống kết quả thông qua ánh xạ / bộ lọc / sắp xếp, v.v. và bạn muốn nối các mảng của mảng, bạn có thể sử dụng 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']

Đối với mảng nhiều mảng và ES6, hãy sử dụng

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

Ví dụ:

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 ]

Bây giờ chúng ta có thể kết hợp nhiều mảng bằng cách sử dụng ES6 Spread. Thay vì sử dụng concat()để nối các mảng, hãy thử sử dụng cú pháp trải rộng để kết hợp nhiều mảng thành một mảng phẳng. ví dụ:

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]

giải quyết như thế này

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

Bạn có thể sử dụng trang web jsperf.com để so sánh độ hoàn hảo. Đây là liên kết đến concat .

Đã thêm so sánh giữa:

var c = a.concat(b);

và:

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

Thứ hai là chậm hơn gần 10 lần trong chrome.

Dễ dàng với chức năng concat:

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

Đây là một hàm mà bạn có thể ghép nhiều số mảng

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

    return newArr;
}

Thí dụ -

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

sẽ xuất

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

Nếu bạn có mảng mảng và muốn ghép các phần tử thành một mảng duy nhất, hãy thử đoạn mã sau (Yêu cầu 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];

Hoặc nếu bạn tham gia lập trình chức năng

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];

Hoặc thậm chí tốt hơn với cú pháp ES5, không có toán tử trải

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];

Cách này rất hữu ích nếu bạn không biết không. của mảng tại thời điểm mã.

Rút ngắn với ES6.

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

Điều này không concat và duy nhất nhiều mảng;

Bản demo trên codepen

Hợp nhất mảng với đẩy:

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

Sử dụng toán tử concat và Spread:

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);

trong đó 'n' là một số mảng, có thể là một mảng của mảng. . .

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

Nếu chỉ có hai mảng để concat và bạn thực sự cần nối thêm một trong các mảng thay vì tạo một mảng mới, đẩy hoặc lặp là cách để đi.

Điểm chuẩn: https://jsperf.com/concat-small-arrays-vs-push-vs-loop/

thử cái này:

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

i=i.concat(j);

nếu mảng N được lấy từ cơ sở dữ liệu và không được mã hóa cứng, tôi sẽ làm như thế này bằng ES6

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