2019-03-26 | JavaScript

JavaScript之可变函数

JavaScript拥有一组可变函数，使用它们，可以不必引用数组中的某个元素，就能改变数组内容。

1.为数组添加元素

1.1 push()方法

push()方法会将一个元素或多个元素添加到数组末尾。
例子：

var nums = [1,2,3,4,5];
   console.log(nums);    //1,2,3,4,5
   nums.push(6);
   console.log(nums);   //1,2,3,4,5,6

1.2 unshift()方法

unshift()方法可以将一个或多个元素添加在数组的开头
例子：

var nums = [2,3,4,5];
   console.log(nums);   // 2,3,4,5
   var newnum = 1;
   nums.unshift(newnum);
   console.log(nums);   //1,2,3,4,5
   nums = [3,4,5];
   nums.unshift(newnum,2);
   console.log(nums);   //1,2,3,4,5

由于在数组开头添加元素比在数组结尾添加元素更难，如果不使用数组提供的可变函数unshift()的话，当新的元素添加进来的时候，我们需要将数组后面的每一个元素都相应地向后移动一个位置。下面是不用unshift()方法实现的一个例子：

var nums = [2,3,4,5];
   var newnum = 1;
   var N = nums.length;
   for(var i = N ; i >= 0 ; --i){
   nums[i] = nums[i-1];
   }
   nums[0] = newnum;
   console.log(nums);    // 1,2,3,4,5

注意：如果不用unshift()的方法，而用上面写的代码的话，会随着数组中存储的元素越来越多而使得代码变得越来越低效。

2.从数组中删除元素

2.1 pop()方法

pop()方法可以删除数组末尾的元素。

1
2
3

var nums = [1,2,3,4,5,9];
    nums.pop();
    console.log(nums);   // 1,2,3,4,5

如果没有可变函数pop()的话，从数组中删除一个元素将后续元素各自向前移动一个位置，代码如下：

var nums = [9,1,2,3,4,5];
   console.log(nums);
   for(var i = 0 ; i < nums.length ; ++i){
   nums[i] = nums[i+1];
   }
   console.log(nums);   //1,2,3,4,5,undefined

注意：除了要将后续元素前移一位，还多出了一个元素。

2.2 shift()方法

shift()方法可以删除数组的第一个元素

1
2
3

var num = [9,1,2,3,4,5];
nums.shift();
console.log(nums);    //1,2,3,4,5

此时你会发现数组末尾多余的逗号消失了

3.从数组中间位置添加和删除元素

3.1 splice()方法

splice(index,howmany,item1, …, itemX)
index: 起始索引（也就是你希望开始添加元素的地方）；
howmany: 需要删除的元素个数（添加元素时该参数设为0）；
item1, …, itemX: 想要添加进数组的元素；
在数组中间插入元素，代码如下：

var nums = [1,2,3,7,8,9];
var newElements = [4,5,6];
nums.splice(3,0,newElements);
console.log(nums);    // [1,2,3,[4,5,6],7,8,9]

注意：要插入数组的元素不必组织成一个数组，它可以是任意的元素序列。比如:

1
2
3

var nums = [1,2,3,7,8,9];
nums.splice(3,0,4,5,6);
console.log(nums);   //  1, 2, 3, 4, 5, 6, 7, 8, 9

比如我想用splice()方法来从数组中删除元素，代码如下：

1
2
3

var nums = [1,2,3,100,200,300,400,4,5];
nums.splice(3,4);
console.log(nums);  // 1,2,3,4,5