关于jquery：如何在特定索引(javascript)处将项插入数组？

How to insert an item into an array at a specific index (JavaScript)?

我正在寻找一个javascript数组插入方法，其样式为：

1	arr.insert(index, item)

最好是在jquery中，但此时任何javascript实现都会这样做。

相关讨论

您需要的是本地数组对象上的splice函数。

arr.splice(index, 0, item);将把item插入到指定索引的arr中(先删除0项，即只是插入)。

在本例中，我们将创建一个数组，并将一个元素添加到索引2中：

1
2
3
4
5
6
7
8
9
10

var arr = [];
arr[0] ="Jani";
arr[1] ="Hege";
arr[2] ="Stale";
arr[3] ="Kai Jim";
arr[4] ="Borge";

console.log(arr.join());
arr.splice(2, 0,"Lene");
console.log(arr.join());

相关讨论

谢谢，我原以为我问这个问题会觉得很愚蠢，但现在我知道答案了，我不知道！当一个更可搜索的术语在同一个函数中被普遍使用时，他们为什么决定将其称为拼接？！
@tags2K：因为函数不仅仅是插入项，而且它的名称已经在Perl中建立了？
文档：developer.mozilla.org/en/javascript/guide/&hellip；
接头可以插入，但通常不会插入。例如：arr.splice(2,3)将从索引2开始删除3个元素。如果不传递第3…n个参数，则不会插入任何内容。所以这个名字也不公平。
我认为术语"拼接"是有意义的。拼接意味着连接或连接，也意味着改变。您已经建立了一个数组，现在您正在"更改"，这将涉及添加或删除元素。您可以指定数组的起始位置，然后指定要删除多少旧项(如果有)，最后还可以指定要添加的新元素列表。当然，拼接也是一个伟大的科幻术语。
有人能从性能的角度告诉我在这种情况下使用splicegood吗？我的意思是，如果我有一个包含数千个项的数组，并且我想在两个元素之间插入一个元素，那么javascript如何从我插入项到数组末尾的那一点更新数组的索引呢？
@Tonix我认为这是一个O(N)操作，因为它必须移动属于插入项后面的索引的所有值。在最坏的情况下(在开头插入一个项)，它将是数组中的所有(n)项。
我理解。它能有所改进吗？我的意思是，我刚刚发现了类似于creating two separate indexes placed in the middle of the array或rotating arrays的东西，但我不理解文章作者的意思(gamealcomist.wordpress.com/2013/05/01/&hellip；)，结尾的第6点和第7点。
我认为他在谈论通过跟踪有效索引避免调整数组大小的技术。除非您当前面临性能问题，否则我不会开始尝试编写自己的数组选项。根据应用程序的需要，另一个数据结构也可能工作得更好，比如说平衡树。
jsFiddle链接jsFiddle.net/emrefatih47/685qgmvn
@托尼-你有实际的表现问题吗？如果不这样做，您将过早地进行优化，这将导致难以维护代码而没有任何好处。编写JavaScript引擎/库的人有责任使拼接性能良好，而不是您的责任。除非你必须这样做，否则不要把它变成你的程序(即，除非你有一些丑陋的黑客程序，否则你的程序会慢得让人无法接受。)
@《战争的艺术》正如Tvanfosson所说，拼接的数量是O(n)。同时，我创建了一个我称之为LinkedOrderedMap的类，它允许我插入项目并保持它们的顺序，当我需要从列表中删除项目时，我只需取消链接项目位于列表中的节点，并告诉上一个节点它的下一个项目现在是我要删除的节点的下一个节点。要在列表中的其他元素之间插入元素，我也可以使用相同的策略。
@当然，在我对性能提升做出假设之前，我必须对它进行基准测试，但是有了这样的实现，所需的操作量是恒定的。名单有多长并不重要。我记得有一个在线网站，你可以在那里基准你的JS代码，但我记不起名字。如果你知道的话，能给我一个链接吗？然后，我将对编写的代码与拼接进行基准测试，并告诉结果是什么。
@Tonix-您的代码是用JavaScript编写的，需要进行解释。拼接的代码可能更原始。
@是的，我知道。但我还是很想做一个基准测试。我只是不记得你测试JS代码的站点名称…
考虑到新emcascript的新class和constructor元素只不过是现有方法的句法糖，那么制作insert函数/别名是否太多？
我一直在试图找到一种方法来保持数组与开始时的顺序相同，但每次我从API调用中获取结果时，它都会颠倒数组的顺序。我试过用reverse()，但没有运气。我真的需要一些东西来强制数组保持索引的顺序，这是可行的！8年前的答案：)
@有趣的是，javascript创建者决定创建一个可以做很多事情的函数，而不是创建一个可以做每件事情的单独函数。他们聪明的制作了一个函数，插入，删除，并方便地从一个函数一个字母远离重叠的实用程序。没问题！

您可以通过这样做来实现Array.insert方法：

1
2
3

Array.prototype.insert = function ( index, item ) {
this.splice( index, 0, item );
};

然后你可以像这样使用它：

1
2
3
4

var arr = [ 'A', 'B', 'D', 'E' ];
arr.insert(2, 'C');

// => arr == [ 'A', 'B', 'C', 'D', 'E' ]

相关讨论

除了拼接之外，您可以使用这种方法，这种方法不会改变原始数组，但会使用添加的项创建一个新数组。你应该尽可能避免变异。我在用ES6扩频器。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

const items = [1, 2, 3, 4, 5]

const insert = (arr, index, newItem) => [
// part of the array before the specified index
...arr.slice(0, index),
// inserted item
newItem,
// part of the array after the specified index
...arr.slice(index)
]

const result = insert(items, 1, 10)

console.log(result)
// [1, 10, 2, 3, 4, 5]

这可以用于添加多个项，方法是稍微调整函数以对新项使用rest运算符，并在返回的结果中散布该运算符。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

const items = [1, 2, 3, 4, 5]

const insert = (arr, index, ...newItems) => [
// part of the array before the specified index
...arr.slice(0, index),
// inserted items
...newItems,
// part of the array after the specified index
...arr.slice(index)
]

const result = insert(items, 1, 10, 20)

console.log(result)
// [1, 10, 20, 2, 3, 4, 5]

相关讨论

自定义数组insert方法1。具有多个参数和链接支持

1
2
3
4
5
6
7
8

/* Syntax:
array.insert(index, value1, value2, ..., valueN) */

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

它可以插入多个元素(与本机splice一样)，并支持链接：

1 2	["a","b","c","d"].insert(2,"X","Y","Z").slice(1, 6); // ["b","X","Y","Z","c"]

2。支持数组类型参数合并和链接

1
2
3
4
5
6
7
8
9
10

/* Syntax:
array.insert(index, value1, value2, ..., valueN) */

Array.prototype.insert = function(index) {
index = Math.min(index, this.length);
arguments.length > 1
&& this.splice.apply(this, [index, 0].concat([].pop.call(arguments)))
&& this.insert.apply(this, arguments);
return this;
};

它可以将参数中的数组与给定的数组合并，还支持链接：

1 2	["a","b","c","d"].insert(2,"V", ["W","X","Y"],"Z").join("-"); //"a-b-V-W-X-Y-Z-c-d"

演示：http://jsfiddle.net/upphh/

相关讨论

如果您想一次将多个元素插入一个数组，请查看这个堆栈溢出答案：用JavaScript将数组拼接到数组中的更好方法

下面还有一些功能可以说明这两个示例：

1
2
3
4
5
6
7
8
9

function insertAt(array, index) {
var arrayToInsert = Array.prototype.splice.apply(arguments, [2]);
return insertArrayAt(array, index, arrayToInsert);
}

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

最后，这里是一个jsiddle，您可以自己查看它：http://jsiddle.net/luisperezphd/wc8as/

这就是你如何使用这些函数：

1
2
3
4
5
6

// if you want to insert specific values whether constants or variables:
insertAt(arr, 1,"x","y","z");

// OR if you have an array:
var arrToInsert = ["x","y","z"];
insertArrayAt(arr, 1, arrToInsert);

相关讨论

为了实现正确的功能编程和链接目的，Array.prototype.insert()的发明是必不可少的。实际上，如果拼接返回的是可变数组，而不是完全没有意义的空数组，那么拼接可能是完美的。所以它在这里

1
2
3
4
5
6
7

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

var a = [3,4,8,9];
document.write("[cc lang="javascript"]" + JSON.stringify(a.insert(2,5,6,7)) +"

号)；>pre>

好吧，上面的Array.prototype.splice()一个改变了原来的数组，有些人可能会抱怨"你不应该修改不属于你的东西"，这也可能是对的。所以为了公共福利，我想给另一个Array.prototype.insert()，它不会改变原来的数组。在这里；

1
2
3
4
5
6
7
8

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

相关讨论

我建议在这种情况下使用纯javascript，在javascript中也没有insert方法，但是我们有一个方法，它是一个内置的数组方法，可以为您完成这项工作，它被称为splice…

让我们看看什么是拼接()…

The splice() method changes the contents of an array by removing
existing elements and/or adding new elements.

好吧，假设我们有下面这个数组：

1	const arr = [1, 2, 3, 4, 5];

我们可以这样删除3：

1	arr.splice(arr.indexOf(3), 1);

它将返回3，但如果我们现在检查ARR，我们有：

1	[1, 2, 4, 5]

到目前为止，还不错，但是我们如何使用拼接将新元素添加到数组中呢？让我们把3个放回ARR…

1	arr.splice(2, 0, 3);

让我们看看我们做了什么…

我们再次使用拼接，但这次对于第二个参数，我们传递0，意味着我们不想删除任何项，但同时，我们添加第三个参数，即将在第二个索引处添加的3…

您应该知道，我们可以同时删除和添加，例如现在我们可以：

1	arr.splice(2, 2, 3);

它将删除索引2处的2项，然后在索引2处添加3项，结果将是：

1	[1, 2, 3, 5];

这显示了拼接中的每个项目是如何工作的：

array.splice(start, deleteCount, item1, item2, item3 ...)

在特定索引处附加单个元素

1
2
3
4
5
6
7

//Append at specific position(here at index 1)
arrName.splice(1, 0,'newName1');
//1: index number, 0: number of element to remove, newName1: new element

//Append at specific position (here at index 3)
arrName[3] = 'newName1';

在特定索引处附加多个元素

1
2
3
4
5

//Append from index number 1
arrName.splice(1, 0,'newElemenet1', 'newElemenet2', 'newElemenet3');
//1: index number from where append start,
//0: number of element to remove,
//newElemenet1,2,3: new elements

相关讨论

另一种可能的解决方案是使用Array#reduce。

1
2
3
4
5
6
7
8
9
10
11
12
13

var arr = ["apple","orange","raspberry"],
arr2 = [1, 2, 4];

function insert(arr, item, index) {
arr = arr.reduce(function(s, a, i) {
i == index ? s.push(item, a) : s.push(a);
return s;
}, []);
console.log(arr);
}

insert(arr,"banana", 1);
insert(arr2, 3, 2);

尽管已经回答了这个问题，我还是添加了这个注释，作为一种替代方法。

我想把已知数量的项目放入一个数组中，放入特定的位置，因为它们来自一个"关联数组"(即一个对象)，根据定义，这个数组不能保证排序顺序。我希望得到的数组是一个对象数组，但是对象在数组中的顺序是特定的，因为数组保证了它们的顺序。所以我做到了。

首先是源对象，从PostgreSQL中检索到的JSONB字符串。我希望在每个子对象中按"order"属性对其进行排序。

1
2
3

var jsonb_str = '{"one": {"abbr":"","order": 3},"two": {"abbr":"","order": 4},"three": {"abbr":"","order": 5},"initialize": {"abbr":"init","order": 1},"start": {"abbr":"","order": 2}}';

var jsonb_obj = JSON.parse(jsonb_str);

因为对象中的节点数已知，所以我首先创建一个具有指定长度的数组：

1 2	var obj_length = Object.keys(jsonb_obj).length; var sorted_array = new Array(obj_length);

然后迭代对象，将新创建的临时对象放置到数组中所需的位置，而不真正进行任何"排序"。

1
2
3
4
5
6
7
8
9

for (var key of Object.keys(jsonb_obj)) {
var tobj = {};
tobj[key] = jsonb_obj[key].abbr;

var position = jsonb_obj[key].order - 1;
sorted_array[position] = tobj;
}

console.dir(sorted_array);

我试过了，效果很好！

1 2	var initialArr = ["India","China","Japan","USA"]; initialArr.splice(index, 0, item);

index是要插入或删除元素的位置。0，即第二个参数定义要删除的索引中的元素数项是要在数组中创建的新项。它可以是一个或多个。

1 2	initialArr.splice(2, 0,"Nigeria"); initialArr.splice(2, 0,"Australia","UK");

相关讨论

减持法利润如下：

1
2
3
4
5

function insert(arr, val, index) {
return index >= arr.length
? arr.concat(val)
: arr.reduce((prev, x, i) => prev.concat(i === index ? [val, x] : x), []);
}

因此，通过这种方式，我们可以返回一个新的数组(这将是一种很酷的功能性方法，比使用push或splice要好得多)，元素插入索引，如果索引大于数组的长度，它将插入到末尾。

任何一个仍然对这一个有问题，并尝试了以上所有的选择，但从来没有得到。我正在分享我的解决方案，这是为了考虑到您不希望显式地声明对象与数组的属性。

1
2
3
4
5
6
7
8
9
10
11

这是迭代引用数组并将其与要检查的对象进行比较的组合，将这两个数组都转换为字符串，然后在匹配时进行迭代。然后你就可以数数了。这是可以改进的，但这是我安顿下来的地方。希望这有帮助。

这是我在一个应用程序中使用的一个工作函数。

这将检查项目是否退出

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

let ifExist = (item, strings = [ '' ], position = 0) => {
// output into an array with empty string. Important just in case their is no item.
let output = [ '' ];
// check to see if the item that will be positioned exist.
if (item) {
// output should equal to array of strings.
output = strings;
// use splice in order to break the array.
// use positition param to state where to put the item
// and 0 is to not replace an index. Item is the actual item we are placing at the prescribed position.
output.splice(position, 0, item);
}
//empty string is so we do not concatenate with comma or anything else.
return output.join("");
};

然后我把它叫做下面。

1
2
3

ifExist("friends", [ ' ( ', ' )' ], 1)} // output: ( friends )
ifExist("friends", [ ' - '], 1)} // output: - friends
ifExist("friends", [ ':'], 0)} // output: friends: