乐趣区

关于javascript:如何将元素插入数组的指定索引

jiezi

作者：Guest Contributor
译者：前端小智
起源：stackabuse

点赞再看 ，微信搜寻【大迁世界】,B 站关注【前端小智】 这个没有大厂背景，但有着一股向上踊跃心态人。本文 GitHub https://github.com/qq44924588… 上曾经收录，文章的已分类，也整顿了很多我的文档，和教程材料。

简介

数组是一种线性数据结构，能够说是编程中最罕用的数据结构之一。批改数组是一种常见的操作，这里，咱们来探讨如何在 JS 中数组的任何地位增加元素。

元素能够增加到数组中的三个地位

  • 开始 / 第一个元素
  • 完结 / 最初元素
  • 其余中央

接着，咱们一个一个过一下：

数组对象中的 unshift() 办法将一个或多个元素增加到数组的结尾，并返回数组的新长度：

const startArray = [3, 4, 5];
const newLength = startArray.unshift(2);
console.log(newLength); 
console.log(startArray);

startArray.unshift(-1, 0, 2);
console.log(startArray);

下面输入的后果：

4
[2, 3, 4, 5]
[-1, 0, 2, 2, 3, 4, 5]

将元素增加到数组的开端

应用数组的最初一个索引

要在数组开端增加元素，能够应用数组的长度总是比下标 小 1 这一技巧。

const indexArray = [1, 2, 3];
console.log(indexArray.length);
console.log(indexArray[2]);
console.log(indexArray[3]);

indexArray[indexArray.length] = 4
console.log(indexArray);

下面输入的后果：

3
3
undefined
[1, 2, 3, 4]

数组的长度是 3，第二个元素是3。没有第三个元素，所以咱们用undefined 结尾。最初，在该地位插入值4。

应用 push() 办法

数组的 push() 办法将一个或多个元素增加到数组的开端。就像 unshift() 一样，它也会返回数组的新长度

const pushArray = [1, 2, 3]
const newLength = pushArray.push(4, 5, 6, 7);
console.log(newLength);
console.log(pushArray);

下面输入的后果：

7
[1, 2, 3, 4, 5, 6, 7]

应用 concat() 办法

通过数组的 concat() 办法实现两个或更多数组的合并。它创立新的正本，且不影响原始数组。与以前的办法不同，它返回一个新数组。应用该办法，要连贯的值始终位于数组的开端。

const example1Array1 = [1, 2, 3];
const valuesToAdd = [4, 5, 6];
const example1NewArray = example1Array1.concat(valuesToAdd);

console.log(example1NewArray);
console.log(example1Array1);

下面输入的后果：

[1, 2, 3, 4, 5, 6]
[1, 2, 3]

咱们能够将一个数组与一系列值连接起来：

const array = [1,2,3];
const newArray = array.concat('12', true, null, 4,5,6,'hello');
console.log(array);
console.log(newArray);

下面输入的后果：

[1, 2, 3]
[1, 2, 3, '12', true, null, 4, 5, 6, 'hello']

能够将一个数组与多个数组连接起来:

const array1 = [1, 2, 3];
const array2 = [4, 5, 6];
const array3 = [7, 8, 9];
const oneToNine = array1.concat(array2, array3);

console.log(oneToNine);

下面输入的后果：

[1, 2, 3, 4, 5, 6, 7, 8, 9]

在数组的任何地位增加元素

当初咱们将探讨一个 masterstroke 办法，它能够用于在数组的任何地位增加元素——开始、完结、两头和两头的任何地位。

splice()办法增加，删除和替换数组中的元素。它通常用于数组治理，此办法不会创立新数组，而是会更新调用它的数组。

咱们来看看 splice() 的理论利用。这里有一个 weekdays 数组，当初，咱们想在 '周二' 和'周四'之间增加一个 '周三' 元素

const weekdays = ['周一', '周三', '周四', '周五']
const deletedArray = weekdays.splice(2, 0, '周二');

console.log(weekdays);
console.log(deletedArray);

下面输入的后果：

["周一", "周二", "周三", "周四", "周五"]
[]

剖析一下下面的代码。咱们想在 weekdays 数组的第二个地位增加 '周二'。这里不须要删除任何元素。weekdays.splice(2, 0, 'wednesday') 被读取为第二个地位，不移除任何元素并增加'周二'。

上面是应用 splice() 的个别语法:

let removedItems = array.splice(start[, deleteCount[, item1[, item2[, ...]]]])
  • start- 开始批改数组的索引。
  • deleteCount - 从 start 删除的数组中可选的项目数。如果省略，则start 后的所有我的项目都将被删除。
  • item1, item2, ...- 从start 增加到数组的可选我的项目。如果省略，它将仅从数组中删除元素。

咱们看一下 slice() 的另一个示例，在该示例中咱们同时增加和删除数组。咱们将在第二个地位增加 '周三'，然而咱们还将在该处删除谬误的周末值：

const weekdays = ['周一', '周三', '周六', '周日', '周四', '周五']
const deletedArray = weekdays .splice(2, 2, '周二');

console.log(weekdays);
console.log(deletedArray);

下面输入的后果：

["周一", "周三", "周二", "周四", "周五"]
["周六", "周日"]

总结

在本文中，咱们钻研了 JS 中能够向数组增加元素的多种办法。咱们能够应用 unshift() 将它们增加到结尾。咱们能够应用索引，pop()办法和 concat() 办法将它们增加到开端。通过 splice() 办法，咱们能够更好地管制它们的搁置地位。

代码部署后可能存在的 BUG 没法实时晓得，预先为了解决这些 BUG，花了大量的工夫进行 log 调试，这边顺便给大家举荐一个好用的 BUG 监控工具 Fundebug。

原文：https://stackabse.com/javascr…

交换

文章每周继续更新，能够微信搜寻「大迁世界」第一工夫浏览和催更（比博客早一到两篇哟），本文 GitHub https://github.com/qq449245884/xiaozhi 曾经收录，整顿了很多我的文档，欢送 Star 和欠缺，大家面试能够参照考点温习，另外关注公众号，后盾回复 福利，即可看到福利，你懂的。

退出移动版