วิธีที่มีประสิทธิภาพมากที่สุดในการเชื่อมต่ออาร์เรย์ N คืออะไร?

วิธีที่มีประสิทธิภาพมากที่สุดในการเชื่อมอาเรย์ของออบเจ็กต์ N กับ JavaScript คืออะไร?

อาร์เรย์ไม่แน่นอนและผลลัพธ์สามารถเก็บไว้ในหนึ่งในอาร์เรย์อินพุต

หากคุณเชื่อมต่อมากกว่าสองอาร์เรย์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)

อย่างไรก็ตามดูเหมือนว่าสำหรับอาร์เรย์ขนาดใหญ่ (จากสมาชิก 100,000 คนหรือมากกว่านั้น) เทคนิคที่ผ่านอาร์เรย์ขององค์ประกอบต่างๆpush(ไม่ว่าจะใช้apply()หรือตัวดำเนินการแพร่กระจาย ECMAScript 2015) อาจล้มเหลวได้ สำหรับอาร์เรย์ดังกล่าวการใช้การวนซ้ำเป็นวิธีที่ดีกว่า ดูhttps://stackoverflow.com/a/17368101/96100สำหรับรายละเอียด

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

แก้ไข : พิสูจน์ประสิทธิภาพ: http://jsperf.com/multi-array-concat/7

แก้ไข 2 : ทิม 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 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]

ผสานอาร์เรย์ด้วยการกด:

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

ใช้ตัวดำเนินการConcatและ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);

หากคุณมีอาร์เรย์ของอาร์เรย์และต้องการเชื่อมองค์ประกอบเข้าด้วยกันให้ลองใช้รหัสต่อไปนี้ (ต้องใช้ 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));

การทำเช่นนี้จะเป็นการเชื่อมโยงและสร้างหลายอาร์เรย์ที่ไม่ซ้ำกัน

การสาธิตเกี่ยวกับ codepen

โดยที่ 'n' คือจำนวนอาร์เรย์บางตัวซึ่งอาจเป็นอาร์เรย์ของอาร์เรย์ . .

var answer = _.reduce (n, ฟังก์ชั่น (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];