JavaScript 数组元素替换与插入

交换两个元素位置

测试数据

// 原下标
let oldIndex = 1;
// 目的下标
let newIndex = 5;
// 测试数组
let arr = [0,1,2,3,4,5,6];

方法：注意方法 Array splice 参数 (start, ?deleteCount, ...items)，该方法会改变原数组

// 0,5,2,3,4,1,6
arr.splice(newIndex, 1, ...arr.splice(oldIndex, 1 , arr[newIndex]));

解析说明

第一步：第二个 splice，...arr.splice(oldIndex, 1 , arr[newIndex])

• 将 oldIndex 下标值 5 删除，再将 newIndex 下标值 0 替换到 oldIndex 下标。[0,1,2,3,4,0,6]
• splice 方法返回值是 [5]，注意返回值是数组类型
• 使用数组的展开运算符 …扩展，将作为第一个 splice 的第三个参数

第二步：第一个 splice，arr.splice(newIndex, 1, 5)

• 此时数组是 [0,1,2,3,4,0,6]
• 将 newIndex 下标值 0 删除，[1,2,3,4,0,6]
• 将第一步返回的值 5，替换到 newIndex 下标。[5,1,2,3,4,0,6]

某元素插入到指定位置

测试数据

// 原下标
let oldIndex = 1;
// 目的下标
let newIndex = 5;
// 测试数组
let arr = [0,1,2,3,4,5,6];

方法：注意方法 Array splice 参数 (start, ?deleteCount, ...items)，该方法会改变原数组

注意方法 splice 参数 (start, ?deleteCount, ...items)，该方法会改变原数组

// 0,2,3,4,5,1,6
arr.splice(newIndex, 0, ...arr.splice(oldIndex, 1));

解析说明

第一步：第二个 splice，...arr.splice(oldIndex, 1)

• 将 oldIndex 下标值 5 删除。[0,1,2,3,4,6]
• splice 方法返回值是 [5]，注意返回值是数组类型
• 使用数组的展开运算符 …，将作为第一个 splice 的第三个参数

第二步：第一个 splice，arr.splice(newIndex, 0, 5)

• 此时数组是 [0,1,2,3,4,6]
• 将第一步返回的值 5，替换到 newIndex 下标。[5,0,1,2,3,4,6]