翼度科技»论坛 编程开发 JavaScript 查看内容

[JS] 数组空位与遍历方法

9

主题

9

帖子

27

积分

新手上路

Rank: 1

积分
27
当数组中存在空位时,遍历数组需要选择合适的方法,不同的方法可能返回不同的结果。
示例数组:
  1. const arr = [1, 2, , 3, 4];
复制代码
数组空位不会影响数组长度,arr的长度是 5。
for循环

最朴素的 for 循环会遍历到数组的每一位,对于空位,访问时返回 undefined。
  1. for(let i=0; i<arr.length; i++){
  2.   console.log(arr[i]);
  3. }
复制代码
输出
  1. 1        
  2. 2        
  3. undefined
  4. 4        
  5. 5  
复制代码
for in 方法

for-of 和普通的 for循环结果是一样的,这里看 for-in 的结果。
for-in 遍历数组对象的可枚举属性键,会跳过空位。
  1. arr.forEach(el=>{
  2.   console.log(el);
  3. });
复制代码
输出
  1. 1        
  2. 2        
  3. 4        
  4. 5
复制代码
数组的entries方法

数组的 entries 方法返回一个包含数组中每个索引的键值对的迭代器对象。当遇到空位时,对应的值读取为 undefined。
  1. for(let key in arr){
  2.   console.log(arr[key]);
  3. }
复制代码
输出
  1. 1
  2. 2
  3. 4
  4. 5
复制代码
思考:什么时候会忽略空位?

根据上面4种简单的情形,可以看到 forEach方法和for-in 循环会跳过空位,而其它则不会。
事实上,除了 forEach 方法,传入一个回调函数遍历数组的方法都会忽略空位,包括但不限于:map, filter, reduce, find。
而 for-in 循环之所以会忽略空位,是因为空洞对应的索引没有被创建为可枚举属性,因此不会被 for-in 遍历到。
数组作为一种对象,key 是数字索引,value 是数组元素。
同理,如果使用 Object.keys(),Object.values(),Object.entries()遍历数组对象,会发现空洞都会被忽略。
但是,数组原型上的.keys,.values,.entries方法,是为数组特殊设计的,用这些方法遍历数组,就不会跳过空位。
for-of 循环遍历数组为什么不会跳过空位?for-of 一个数组对象,会调用它的 [Symbol.iterator] 方法返回一个迭代器。而 Array.prototype.values 是 Array.prototype[Symbol.iterator]的默认实现,于是 for-of 和.values方法保持一致,都不会跳过空位。
对比总结


  • for:不忽略
  • for in:忽略空位
  • for of:不忽略
这仨原理不一样,只是因为长得像所以放一起。
for in 忽略空位是和下面的对象方法一个道理。
而 for of 不忽略空位和下面数组的values等方法是一个道理。


  • 对象方法 Object.keys(),Object.values(),Object.entries():忽略空位
  • 数组方法:

    • forEach,map,filter,every,reduce等:忽略空位
    • keys,values,entries:不忽略空位


来源:https://www.cnblogs.com/feixianxing/p/18393497/javascript-array-empty-items-and-iterate-methods
免责声明:由于采集信息均来自互联网,如果侵犯了您的权益,请联系我们【E-Mail:cb@itdo.tech】 我们会及时删除侵权内容,谢谢合作!

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有账号?立即注册

x

举报 回复 使用道具