一、数组指定位置插入
数组是JavaScript编程中常用的一种数据结构。在JavaScript中,数组是一组按照顺序排列的数据项组成的集合,可以保存多个数据项并且这些数据可以是任意类型的。在数组中我们可以增加、删除、修改、查询数组的元素。对于数组来说,指定位置插入数据是一种改变数组形态的常用操作。我们可以采取splice方法,实现指定位置插入数据。
以往插入数据时,我们往往会采用for循环遍历的方式来实现插入操作,如下所示:
let arr = ['a', 'b', 'c', 'd']; let index = 2; // 在索引2位置插入元素 let item = 'x'; for (let i = arr.length; i > index; i--) { arr[i] = arr[i - 1]; } arr[index] = item; console.log(arr); // ['a', 'b', 'x', 'c', 'd']
可以看出,使用for循环的方式会将index后的元素全部向后移动,然后再插入数据。这种方式虽然可以实现功能,但是效率较低,代码量过于庞大。其实,JavaScript中给我们提供了一种更加简便的方式,即splice方法。
let arr = ['a', 'b', 'c', 'd']; let index = 2; // 在索引2位置插入元素 let item = 'x'; arr.splice(index, 0, item); console.log(arr); // ['a', 'b', 'x', 'c', 'd']
可以看出,使用splice方法可以在指定位置插入元素并且不需要手动移动其他元素。splice方法的使用方法是,第一个参数是插入元素的位置,第二个参数是要删除的元素个数,第三个参数是要插入的元素。如果第二个参数填0,则表示不删除任何元素。
二、JS数组指定位置添加
除了在指定位置插入一个元素,我们也可以在指定位置添加一个数值。即,在指定位置的数值上加上一个固定的值。这种方式是在原位置上修改数据,而不是插入新数据。
我们还是可以采用splice方法,实现在指定位置添加的效果。示例代码如下:
let arr = [1, 2, 3, 4, 5]; let index = 3; // 在索引3位置添加值 let value = 10; arr.splice(index, 1, arr[index] + value); //在索引3上加上10 console.log(arr); // [1, 2, 3, 14, 5]
可以看出,使用splice方法可以将指定位置的值进行修改,并且不需要手动移动其他元素。splice方法的使用方法是,第一个参数是修改元素的位置,第二个参数是要删除的元素个数,第三个参数是要插入的元素。在此情况下,要插入的元素为指定位置的原值加上固定的值。
三、JS数组指定位置添加元素
如果我们要在数组中添加多个元素,而不是修改或者插入单个元素,我们可以采用splice方法和apply方法相结合的方式。
apply方法可以将一组参数以数组的形式传递给某个方法,并运行这个方法。在这种情况下,我们可以利用apply方法来将一个数组插入到另一个数组的指定位置。示例代码如下:
let arr1 = ['a', 'b', 'c']; let arr2 = ['d', 'e', 'f']; let index = 2; // 在索引2位置添加arr2中的元素 Array.prototype.splice.apply(arr1, [index, 0].concat(arr2)); console.log(arr1); // ['a', 'b', 'd', 'e', 'f', 'c']
可以看出,使用apply方法可以将arr2中的元素添加到arr1中的指定位置,并且不需要手动移动其他元素。apply方法的使用方法是,第一个参数是要调用的方法,第二个参数是传递给方法的参数,以数组形式传递。在此情况下,第一个参数是splice方法,第二个参数是插入时需要的参数:第一个是插入的位置,第二个是要删除的元素个数(0表示不删除元素),第三个是要插入的元素,使用concat将要插入的数组进行拼接。
四、JS添加数据到数组的指定位置
除了使用splice方法之外,我们还可以使用数组对象的length属性和索引的方式来添加数据到指定位置。
如果我们要将数据添加在某个位置,需要先给数组扩容一个单位,然后将之后的元素向后移动一个位置。待到元素腾出位置后,再把新元素插到指定位置上。示例代码如下:
let arr = ['a', 'b', 'c', 'd']; let index = 2; // 在索引2位置插入元素 let value = 'x'; arr.length += 1; //扩容一个单位 for (let i = arr.length - 1; i > index; i--) { arr[i] = arr[i - 1]; } arr[index] = value; //将新增元素插在指定位置上 console.log(arr); // ['a', 'b', 'x', 'c', 'd']
可以看出,使用数组的length属性和索引的方式可以在指定位置插入元素并且不需要手动移动其他元素。方法是先扩容一个单位,再将指定位置以后的元素向后移动一个位置,之后将新元素插入到指定位置上。这种方式实现比较麻烦,但是在某些情况下仍然可以使用。