JS逆序遍历实现代码_javascript技巧
程序员文章站
2022-05-21 14:40:30
...
最常用的遍历方式为for语句(也有递归、while方式)。当我们遍历一个数组的时候,我们一般会这么做:
var arr = [1,2,3,4,5,6,7,8,9,10];
for(var i=0,total=arr.length;i
console.log(i,arr[i]);
}
//移除数组中的2
var arr = [1,2,2,2,2,1,1,2,2];
for(var i=0,total=arr.length;i
if(arr[i] == 2){
//符合条件,移除
arr.splice(i,1);
}
}
console.log(arr);
//移除数组中的2
var arr = [1,2,2,2,2,1,1,2,2];
for(var i=0,total=arr.length;i
if(arr[i] == 2){
//符合条件,移除
arr.splice(i,1);
//调整序列索引
i = i-1;
}
}
console.log(arr);
//移除数组中的2
var arr = [1,2,2,2,2,1,1,2,2];
for(var i = arr.length-1;i!=-1;i--){
if(arr[i] == 2){
//符合条件,移除
arr.splice(i,1);
}
}
console.log(arr);
复制代码 代码如下:
var arr = [1,2,3,4,5,6,7,8,9,10];
for(var i=0,total=arr.length;i
}
这就是最常用的遍历方式:正序遍历。它从数组的第一项依次走到最后一项。
那为什么今天小剧还会提到逆序遍历呢?
这里不得不提下小剧写的组件里最常用的一个模块:events。用于创建自定义事件模型,处理事件的监听及触发,最简单的发布订阅(pub/sub)模式。因为最近发现存在内存溢出的隐患,需要在原有的基础上增加一个解除绑定的方法。
因为同一事件名的回调函数是放在同一数组中,解除绑定也只需要从数组中找到对应的回调函数(同一回调函数可能绑定多次),并且移除即可。
很简单的需求,于是很自然地写出类似下面的代码:
复制代码 代码如下:
//移除数组中的2
var arr = [1,2,2,2,2,1,1,2,2];
for(var i=0,total=arr.length;i
//符合条件,移除
arr.splice(i,1);
}
}
console.log(arr);
很正常的代码有木有,可最终输出结果却是:[1, 2, 2, 1, 1, 2],显然执行结果不符合预期。
问题出在哪儿呢?
仔细分析了一下,发现问题出在了每次匹配成功,执行移除操作之后,都会跳过下一个待检查项,因为数组中之后的每一项都向前上升一位。
找到了问题所在,改了下代码,在执行移除操作之后,调整序列索引index(i)。
复制代码 代码如下:
//移除数组中的2
var arr = [1,2,2,2,2,1,1,2,2];
for(var i=0,total=arr.length;i
//符合条件,移除
arr.splice(i,1);
//调整序列索引
i = i-1;
}
}
console.log(arr);
问题解决了,但总感觉修改序列索引是件调戏for循环的事。于是灵光一闪,啪啪啪,敲出下面的代码:
复制代码 代码如下:
//移除数组中的2
var arr = [1,2,2,2,2,1,1,2,2];
for(var i = arr.length-1;i!=-1;i--){
if(arr[i] == 2){
//符合条件,移除
arr.splice(i,1);
}
}
console.log(arr);
遍历的过程不变,唯一变化的是遍历的顺序变了,对了,还少了一个变量total。
好吧,我承认今天写的东西很屌丝,但通过这个例子,给以后写代码的时候提了个醒,在遍历过程中,如果涉及到修改数组本身(增删),逆序遍历是个比较保险的遍历方式。
coding笔记,留给以后嘲笑自己!
上一篇: php里面布尔型和整数比较
下一篇: memcached 源码阅读之原理篇
推荐阅读
-
js实现点击注册按钮开始读秒倒计时的小例子_javascript技巧
-
js实现div的切换特效上一个下一个_javascript技巧
-
js按指定格式显示日期时间的样式代码_javascript技巧
-
js从10种颜色中随机取色实现每次取出不同的颜色_javascript技巧
-
使用js实现雪花飘落效果_javascript技巧
-
JS链式调用的实现方法_javascript技巧
-
遍历DOM对象内的元素属性示例代码_javascript技巧
-
判断文件是否正在被使用的JS代码_javascript技巧
-
JS取得绝对路径的实现代码_javascript技巧
-
如何用js 实现依赖注入的思想,后端框架思想搬到前端来_javascript技巧