JS数组方法shift()、unshift()用法实例分析

JS数组方法shift()和unshift()是数组操作中非常常用的方法，两个方法都可以用于向数组的开头添加或删除元素，下面详细讲解这两个方法的用法及实例分析。

shift() 方法的用法及实例分析

shift()方法用于删除数组的第一个元素，并返回被删除的元素。

语法：

array.shift()

参数说明：

shift()方法不需要任何参数。

返回值：

返回被删除的元素。

实例：

// 示例1：删除数组的第一个元素，并返回被删除的元素
var arr1 = [1, 2, 3, 4, 5];
console.log('删除前的数组：', arr1); // 输出：[1, 2, 3, 4, 5]
var deletedItem1 = arr1.shift();
console.log('删除后的数组：', arr1); // 输出：[2, 3, 4, 5]
console.log('被删除的元素：', deletedItem1); // 输出：1

// 示例2：使用循环和shift()方法从数组中删除元素
var arr2 = ['A', 'B', 'C', 'D', 'E'];
console.log('删除前的数组：', arr2); // 输出：['A', 'B', 'C', 'D', 'E']
while (arr2.length > 0) {
  var deletedItem2 = arr2.shift();
  console.log('当前删除的元素：', deletedItem2);
  console.log('当前数组状态：', arr2);
}

示例1中，我们首先定义了一个包含5个元素的数组arr1，使用shift()方法删除了数组的第一个元素，返回了被删除的元素1，最终输出了删除后的数组和被删除的元素。

示例2中，我们使用循环和shift()方法从数组中删除所有元素，每次删除一个元素并输出当前被删除的元素和当前数组的状态，用于直观地演示shift()方法的操作过程。

unshift() 方法的用法及实例分析

unshift()方法用于向数组的开头添加新的元素，并返回新的数组的长度。

语法：

array.unshift(item1, item2, ..., itemX)

参数说明：

unshift()方法可以向数组的开头添加一个或多个元素，每个元素之间使用逗号分隔，以此类推。

返回值：

返回新的数组的长度。

实例：

// 示例1：向数组的开头添加单个元素
var arr1 = [2, 3, 4, 5];
console.log('添加前的数组：', arr1); // 输出：[2, 3, 4, 5]
var newLength1 = arr1.unshift(1);
console.log('添加后的数组：', arr1); // 输出：[1, 2, 3, 4, 5]
console.log('新的数组长度：', newLength1); // 输出：5

// 示例2：向数组的开头添加多个元素
var arr2 = [4, 5];
console.log('添加前的数组：', arr2); // 输出：[4, 5]
var newLength2 = arr2.unshift(1, 2, 3);
console.log('添加后的数组：', arr2); // 输出：[1, 2, 3, 4, 5]
console.log('新的数组长度：', newLength2); // 输出：5

示例1中，我们首先定义了一个包含4个元素的数组arr1，使用unshift()方法向数组的开头添加了一个新的元素1，最终输出了添加后的数组和新的数组的长度。

示例2中，我们首先定义了一个包含2个元素的数组arr2，使用unshift()方法向数组的开头添加了3个新的元素1、2和3，最终输出了添加后的数组和新的数组的长度，与示例1的操作步骤类似。