JavaScript的数组塌陷

关注微信公众号“大前端私房菜”,回复暗号【面试宝典】即可免费领取107页前端面试题。

 什么是数组塌陷


当数组执行删除单元操作时,被删除单元,之后的单元,会前移,进而顶替被删除单元,出现在被删除单元的位置上,造成数组长度减少的情况,这样的现象称为数组的坍塌

// 需求: 要求删除掉数组中的所有元素,但是要一个一个的删除
// 定义一个数组
var arr = [3, 4, 44, 65, 56]
console.log('原始数组 : ', arr);
// 遍历循环数组
for (var i = 0; i < arr.length; i++) {
    arr.splice(i, 1)
}
console.log('删除后的数组 : ', arr);
/* 
    分析:
    
    代码开始执行这个时候
    i===0  arr = [3, 4, 44, 65, 56]
    arr.length = 5  结果是true
    arr.splice(0,1)
    i===1 arr = [4, 44, 65, 56]
    arr.length = 4  结果是true
    arr.splice(1,1)
    i===2 arr = [4, 65, 56]
    arr.length = 3  结果是true
    arr.splice(2,1)
    i===3 arr = [4, 65]
    arr.length = 2  结果是falses
    循环结束
*/

解决方案一:
我们循环的时候倒着循环

// 解决方案 方案一
var arr = [3, 4, 44, 65, 56]
console.log('原始数组 : ', arr);
// 遍历循环数组
for (var i = arr.length - 1; i >= 0; i--) {
    arr.splice(i, 1)
}
console.log('删除后的数组 : ', arr);
/*
    分析:
    代码开始执行;
    i === 4  arr = [3, 4, 44, 65, 56]
    这个时候4是大于0的  条件成立
    arr.splice(4,1)
    i === 3  arr = [3, 4, 44, 65]
    这个时候3也是大于0 的  条件成立
    arr.splice(3,1)
    i === 2  arr = [3, 4, 44]
    这个时候也是大于0 的  条件成立
    arr.splice(2,1)
    i === 1  arr = [3, 4]
    这个时候1也是大于0 的  条件成立
    arr.splice(1,1)
    i === 0  arr = [3]
    这个时候0是等于0 的  条件成立
    arr.splice(0,1)
    i === -1  arr = []
    这个时候-1不大于等于0 的  条件不成立
    循环结束
*/

解决方法二
就是每执行一次删除就执行一次 i-- 操作

// 解决方案  方案二
var arr = [3, 4, 44, 65, 56]
console.log('原始数组 : ', arr);
// 遍历循环数组
for (var i = 0; i < arr.length; i++) {
    arr.splice(i, 1)
    i--
}
console.log('删除后的数组 : ', arr);
/*
    分析:
    代码开始执行
    i === 0  arr = [3, 4, 44, 65, 56]
    arr.length = 5  条件成立
    arr.splice(0, 1)
    这个时候执行了 i--
    i === 0  arr = [4, 44, 65, 56]
    arr.length = 4  条件成立
    arr.splice(0, 1)
    i === 0  arr = [ 44, 65, 56]
    arr.length = 3  条件成立
    arr.splice(0, 1)
    i === 0  arr = [ 65, 56]
    arr.length = 2  条件成立
    arr.splice(0, 1)
    i === 0  arr = [ 56]
    arr.length = 1  条件成立
    arr.splice(0, 1)
    i === 0  arr = []
    arr.length = 0  条件不成立
    循环结束
*/

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值