在javascript中将数组拼接成数组的更好方法

Question

有没有比这更好的方法将数组拼接到javascript中的另一个数组中

var string = 'theArray.splice('+start+', '+number+',"'+newItemsArray.join('","')+'");';
eval(string);

Answer 1

您可以使用apply来避免eval：

var args = [start, number].concat(newItemsArray);
Array.prototype.splice.apply(theArray, args);

apply函数用于调用另一个函数，具有给定的上下文和参数，以数组形式提供，例如：

如果我们打电话：

var nums = [1,2,3,4];
Math.min.apply(Math, nums);

apply函数将执行：

Math.min(1,2,3,4);

Answer 2

更新：ES6版本

如果您在ES6中编码，您可以使用“传播运营商”（...）

array.splice(index, 0, ...arrayToInsert);

要了解有关扩展运算符的更多信息，请参阅mozilla文档 。

'老'的ES5方式

如果你把最顶层的答案包装成一个函数你会得到这个：

function insertArrayAt(array, index, arrayToInsert) {
    Array.prototype.splice.apply(array, [index, 0].concat(arrayToInsert));
}

你会像这样使用它：

var arr = ["A", "B", "C"];
insertArrayAt(arr, 1, ["x", "y", "z"]);
alert(JSON.stringify(arr)); // output: A, x, y, z, B, C

你可以在这个jsFiddle中查看： http ： //jsfiddle.net/luisperezphd/Wc8aS/

Answer 3

这个问题真的很旧，但是使用ES6，有一种更简单的方法可以使用spread运算符：

sourceArray.splice(index, 0, ...insertedArray)

如果您在浏览器中使用未编译的javascript，请务必检查目标浏览器是否支持它， 网址为https://kangax.github.io/compat-table/es6/#test-spread_(...)_operator 。

---

此外，这可能稍微偏离主题，但如果您不想或不需要修改原始数组，但可以使用新数组，请考虑以下方法：

mergedArray = sourceArray.slice(0, index).concat(insertedArray, sourceArray.slice(index))

Answer 4

如果你想要一些与splice方法几乎相同的东西，你也可以将这样的函数添加到Array原型中。 例如

Array.prototype.spliceArray = function(index, n, array) {
    return Array.prototype.splice.apply(this, [index, n].concat(array));
}

那么用法就是：

var array = ["A","B","C","","E","F"];

array.splice(3,1,"D");
// array is ["A","B","C","D","E","F"]

array.spliceArray(3,3,["1","2","3"]);
// array is ["A","B","C","1","2","3"]

在这里看到它： http ： //jsfiddle.net/TheMadDeveloper/knv2f8bb/1/

一些说明：

• splice函数直接修改数组，但返回已删除的元素数组...而不是拼接数组。
• 虽然通常不建议扩展核心javascript类，但这对大多数标准框架来说都是相对温和的。
• 在使用专用数组类的情况下，扩展Array将不起作用，例如ImageData数据Uint8ClampedArray。

Answer 5

上面的答案涉及splice.apply并将数组插入一个衬里将在堆栈溢出中炸毁堆栈以获得大数组。 请参阅此处的示例： http ： //jsfiddle.net/gkohen/u49ku99q/您可能必须切片并推送原始数组的插入和剩余部分的每个项目才能工作。 请参阅小提琴： http ： //jsfiddle.net/gkohen/g9abppgy/26/

Array.prototype.spliceArray = function(index, insertedArray) {
   var postArray = this.splice(index);
   inPlacePush(this, insertedArray);
   inPlacePush(this, postArray);

   function inPlacePush(targetArray, pushedArray) {
// Not using forEach for browser compatability
       var pushedArrayLength = pushedArray.length;
       for (var index = 0; index < pushedArrayLength; index++) {
           targetArray.push(pushedArray[index]);
       }
   }
}

Answer 6

这里有很多聪明的答案，但你使用splice的原因是它将元素放入当前数组而不创建另一个。 如果你必须创建一个数组concat() ，所以你可以使用apply()然后你创建2个额外的垃圾数组！ Sorta打败了写作深奥的Javascript的整个目的。 如果你不关心那些内存使用的东西（你应该）只是dest = src1.concat(src2) ; 它更具可读性。 所以这是我最小的线数，同时保持高效的答案。

for( let item of src ) dest.push( item );

或者，如果您想要填充它并获得更好的浏览器支持：

src.forEach( function( x ) { dest.push(x); });

我敢肯定第一个是更高性能（这是一个词;），但在野外的所有浏览器中都不支持。

Answer 7

如果您不想将插入项连接到Array.splice()前两个参数，那么优雅的方法是将Function.bind()和Function.apply()一起使用。

theArray.splice.bind(null, startIndex, deleteCount).apply(newItemsArray);

Answer 8

我希望有一个函数只占用源数组的一部分，所以我根据CMS的答案略有不同

function spliceArray(array, index, howmany, source, start, end) {
    var arguments;
  if( source !== undefined ){
    arguments = source.slice(start, end);
    arguments.splice(0,0, index, howmany);
  } else{
   arguments = [index, howmany];
  }
    return Array.prototype.splice.apply(array, arguments)
}

Array.prototype.spliceArray = function(index, howmany, source, start, end) {
    return spliceArray(this, index, howmany, source, start, end);
}

您可以在以下网址查看： https ： //jsfiddle.net/matthewvukomanovic/nx858uz5/