在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 documentation。

“旧”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

如果您想要与 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 4

上面涉及 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 5

我想要一个函数，它只占用源数组的一部分，所以我的略有不同 基于CMS's answer

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/

Answer 6

这个问题真的很老了，但是在 ES6 中，有一种更简单的方法可以使用扩展运算符来做到这一点：

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 7

这里有很多聪明的答案，但是您使用 splice 的原因是它可以将元素放入当前数组而不创建另一个数组。如果您必须针对concat() 创建一个数组，以便您可以使用apply()，那么您将创建2 个额外的垃圾数组！ Sorta 违背了编写深奥 Javascript 的全部目的。此外，如果你不关心内存使用的东西（你应该）只是dest = src1.concat(src2)；它具有无限的可读性。所以这是我保持有效答案的最少行数。

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

或者，如果您想对其进行 polyfill 并获得更好的浏览器支持：

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

我确信第一个性能更好（它是一个词；），但并非所有浏览器都支持。

Answer 8

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

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