当前位置: 首页 > 编程笔记 >

JS逆序遍历实现代码

沙海
2023-03-14
本文向大家介绍JS逆序遍历实现代码,包括了JS逆序遍历实现代码的使用技巧和注意事项,需要的朋友参考一下

最常用的遍历方式为for语句(也有递归、while方式)。当我们遍历一个数组的时候,我们一般会这么做:


var arr = [1,2,3,4,5,6,7,8,9,10];

for(var i=0,total=arr.length;i<total;i++){

  console.log(i,arr[i]);

}

这就是最常用的遍历方式:正序遍历。它从数组的第一项依次走到最后一项。

那为什么今天小剧还会提到逆序遍历呢?

这里不得不提下小剧写的组件里最常用的一个模块:events。用于创建自定义事件模型,处理事件的监听及触发,最简单的发布订阅(pub/sub)模式。因为最近发现存在内存溢出的隐患,需要在原有的基础上增加一个解除绑定的方法。

因为同一事件名的回调函数是放在同一数组中,解除绑定也只需要从数组中找到对应的回调函数(同一回调函数可能绑定多次),并且移除即可。

很简单的需求,于是很自然地写出类似下面的代码:


//移除数组中的2

var arr = [1,2,2,2,2,1,1,2,2];

for(var i=0,total=arr.length;i<total;i++){

  if(arr[i] == 2){

    //符合条件,移除

    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<total;i++){

  if(arr[i] == 2){

    //符合条件,移除

    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笔记,留给以后嘲笑自己!

转载请注明来源:http://bh-lay.com/blog/148c07761fa

 类似资料:
  • 本文向大家介绍python列表的逆序遍历实现,包括了python列表的逆序遍历实现的使用技巧和注意事项,需要的朋友参考一下 引题:该题源自一个网友的求助,作为水群龙王的我义不容辞的接下了这道题目,先来看题目: 拿到这道题,题目的意思已经很清楚了,列表里含有2的元素都需要删除,然后输出删除后的新列表。我首先想到的思路就是使用for循环遍历字符串,利用字符串操作符x in s(如果x是s的子串,返回T

  • 本文向大家介绍python中的逆序遍历实例,包括了python中的逆序遍历实例的使用技巧和注意事项,需要的朋友参考一下 如果你需要遍历数字序列,可以使用内置range()函数。它会生成数列。 range()语法: range(start,end,step=1):顾头不顾尾 正序遍历: range(10):默认step=1,start=0,生成可迭代对象,包含[0, 1, 2, 3, 4, 5, 6

  • 本文向大家介绍js遍历map javaScript遍历map的简单实现,包括了js遍历map javaScript遍历map的简单实现的使用技巧和注意事项,需要的朋友参考一下 js遍历map javaScript遍历map的简单实现 这样会把map给遍历掉,显示在浏览器上的控制器里。 以上这篇js遍历map javaScript遍历map的简单实现就是小编分享给大家的全部内容了,希望能给大家一个参

  • 本文向大家介绍javascript实现二叉树遍历的代码,包括了javascript实现二叉树遍历的代码的使用技巧和注意事项,需要的朋友参考一下 前言: 紧接着上篇 二叉树的javascript实现 ,来说一下二叉树的遍历。 本次一本正经的胡说八道,以以下这个二叉树为例子进行遍历: 接着是要引入二叉树实现的代码: 二叉树遍历的分类 二叉树的遍历分为先序、中序、后序遍历。这里说到的先序、中序、后序是相

  • 通过一次执行一行代码或一个函数,您可以观察数据和页面中的更改,来确切了解发生了什么。您还可以修改脚本中使用的数据值,甚至可以修改脚本本身。 为什么这个变量值为20而不是30?为什么这行代码似乎没有任何效果?为什么这个标志为真时应该是假的?每个开发人员都面临着这些问题,并逐步通过代码找出来。 设置断点后,返回页面并正常使用,直到运行到断点,将暂停页面上的所有JavaScript,焦点转移到DevTo

  • 本文向大家介绍flex 遍历Object对象内容的实现代码,包括了flex 遍历Object对象内容的实现代码的使用技巧和注意事项,需要的朋友参考一下 一直以为遍历Object只能obj.name这种方式,今天做数据比较,才发现   这种方式,其实觉得Object和java里的HashMap很类似,都是命值对。 具体例子: