在 ES5 Javascript 中，如何在不使用 concat 的情况下立即将项目添加到数组并 return 新数组？

Question

我经常发现自己处于这样一种情况，即我想在单个（原子）操作中向数组添加一个项目，然后 return 那个新数组。

['a', 'b'].push('c');

不会工作，因为它 return 是新的长度。

我知道以下代码有效

['a', 'b'].concat(['c']);

但我发现它的代码很丑陋（合并两个数组只是为了将一个项目添加到第一个数组的末尾）。

我不能使用 Array.splice()，因为它修改了原始数组（并且 returns 是删除的项目）。 Array.slice() 进行 return 浅拷贝，但您不能添加新项目。

ES6

我知道在 es6 中您可以使用

[...['a', 'b'], 'c']

但我正在寻找 es5 解决方案

Lodash

我可以使用 lodash

说清楚

我知道这可以通过几种不同的方式实现（如上面的 Array.concat() 方法），但我正在寻找一段直观的简单代码，"misuses" 其他运营商

Answer 1

我可以为 Array.prototype.insert() 提供两种方法，允许您从数组中的任何索引开始插入单个或多个元素。

1) 改变它调用的数组并 returns 它

Array.prototype.insert = function(i,...rest){
  this.splice(i,0,...rest)
  return this
}

var a = [3,4,8,9];
console.log(JSON.stringify(a.insert(2,5,6,7)));

上述代码段的 ES5 兼容版本。

Array.prototype.insert = function(i){
  this.splice.apply(this,[i,0].concat(Array.prototype.slice.call(arguments,1)));
  return this;
};

2) 不改变它所调用的数组和 returns 一个新数组

Array.prototype.insert = function(i,...rest){
  return this.slice(0,i).concat(rest,this.slice(i));
}

var a = [3,4,8,9],
    b = a.insert(2,5,6,7);
console.log(JSON.stringify(a));
console.log(JSON.stringify(b));

上述代码段的 ES5 兼容版本。

Array.prototype.insert = function(i){
  return this.slice(0,i).concat(Array.prototype.slice.call(arguments,1),this.slice(i));
}

Answer 2

I know the following code works ['a', 'b'].concat(['c']); But I find it ugly code (combining two arrays just to add a single item to the end of the first array).

concat()方法可以被赋予单个（或多个）值，而不需要先将值封装在数组中，例如：

['a', 'b'].concat('c');   // instead of .concat(['c']);

来自MDN（我强调）：

Arrays and/or values to concatenate into a new array.

除此之外，不使用扩展和现有方法的选项有限。

关于如何扩展数组的示例（尽管这将 return 当前数组）：

Array.prototype.append = function(item) {
  this.push(item);
  return this
};

var a = [1, 2, 3];
console.log(a.append(4))

可选地按照@torazaburo 的建议创建一个简单的函数，它可以将数组和项目作为参数：

function append(arr, item) {
  arr.push(item);
  return arr;
}

或使用concat():

function append(arr, item) {
  return arr.concat(item)
}

在 ES5 Javascript 中，如何在不使用 concat 的情况下立即将项目添加到数组并 return 新数组？

In ES5 Javascript, how do I add an item to an array and return the new array immediately, without using concat?

javascript

arrays

ecmascript-5

lodash