js数组的 entries() 获取迭代方法

 更新时间:2021年10月29日 11:32:10   作者:Serendipity  
这篇文章主要介绍了js数组的 entries() 获取迭代方法,entries() 方法返回一个数组的迭代对象,该对象包含数组的键值对 (key/value)。下面来详细介绍该neural,需要的朋友可以参考一下

1、entires() 方法语法详解

entries() 方法返回一个数组的迭代对象,该对象包含数组的键值对 (key/value)

迭代对象中数组的索引值作为 key, 数组元素作为 value。它的原型(__proto__:Array Iterator)上有一个next方法,可用用于遍历迭代器取得原数组的[key,value] 。这里需要知道相关迭代器的知识。

2、entires() 方法常见使用及注意

2.1 返回迭代器对象

    var arr = ["red", "blue", "green"]
    var x = arr.entries()
    console.log(x); // Array Iterator {}
    console.log(x.next()) //{value: Array:[0, "red"],done:false}
    console.log(x.next()) //{value: Array:[1, "blue"],done:false}
    console.log(x.next()) //{value: Array:[2, "green"],done:false}
    console.log(x.next()) //{value: undefined, done: true}

2.2 for...of...的使用

    const options = [1, , , , 5];
    for (const [index, value] of options.entries()) {
      console.log(value);
    }
    // 0 1
    // 1 undefined
    // 2 undefined
    // 3 undefined
    // 4 5

2.3 二维数组行排序

    function sortTwo(arr) {
      var entries = arr.entries()
      var flag = true
      while (flag) {
        var res = entries.next()
        if (!res.done) {
          res.value[1].sort((a, b) => a - b);
          flag = true
        } else {
          flag = false
        }
      }
      return arr
    }
    var arr = [[1, 3, 2], [44, 33], [11, 55, 44, 33]]
    sortTwo(arr)
    console.log(arr);// [[1, 2, 3], [33, 44], [11, 33, 44, 55]]

上面的代码中 sortTwo 方法中首先获取传入数组的迭代对象,然后通过定义一个初始化标识为 true,通过递归调用迭代对象 entires next 方法赋值给 res 对象,判断res对象的d one 属性,若该值为 true 表示可以递归,res.value 对应的是二维数组的每一行,对该项进行排序即可,若值为 flase 表示结束递归。

总结:

到此这篇关于js数组的 entries() 获取迭代方法的文章就介绍到这了,更多相关js数组 entries() 获取迭代内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • elementui实现标签页与菜单栏联动的示例代码

    elementui实现标签页与菜单栏联动的示例代码

    多级联动是一种常见的交互方式,本文主要介绍了elementui实现标签页与菜单栏联动的示例代码,具有一定的参考价值,感兴趣的可以了解一下
    2024-06-06
  • vue父子组件之间的传参的几种方式小结

    vue父子组件之间的传参的几种方式小结

    本文主要介绍了vue父子组件之间的传参的几种方式小结,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2023-04-04
  • vue在使用element组件出现<el-input>标签无法输入的问题

    vue在使用element组件出现<el-input>标签无法输入的问题

    这篇文章主要介绍了vue在使用element组件出现<el-input>标签无法输入的问题,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2023-04-04
  • vue3+vite+ts父子组件之间的传值

    vue3+vite+ts父子组件之间的传值

    随着vue2的落幕,vue3越来成熟,有必要更新一下vue3的父子组件之间的传值方式,这里介绍下vue3+vite+ts父子组件之间的传值方式实例详解,感兴趣的朋友一起看看吧
    2023-12-12
  • vue中el-table实现穿梭框(数据可以上移下移)

    vue中el-table实现穿梭框(数据可以上移下移)

    本文主要介绍了vue中el-table实现穿梭框(数据可以上移下移),文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2023-06-06
  • 手把手教你用vue3开发一个打砖块小游戏

    手把手教你用vue3开发一个打砖块小游戏

    这篇文章主要给大家介绍了关于如何利用vue3开发一个打砖块小游戏的相关资料,通过一个小游戏实例可以快速了解vue3开发小游戏的流程,需要的朋友可以参考下
    2021-07-07
  • 为什么vue中不建议使用空字符串作为className

    为什么vue中不建议使用空字符串作为className

    本文主要介绍了为什么vue中不建议使用空字符串作为className,文中通过示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-09-09
  • Vue 递归多级菜单的实例代码

    Vue 递归多级菜单的实例代码

    这篇文章主要介绍了Vue 递归多级菜单的实例代码,本文通过实例代码给大家介绍的非常详细,具有一定的参考借鉴价值,需要的朋友可以参考下
    2019-05-05
  • Vue3将虚拟节点渲染到网页初次渲染详解

    Vue3将虚拟节点渲染到网页初次渲染详解

    这篇文章主要为大家介绍了Vue3将虚拟节点渲染到网页初次渲染详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-03-03
  • vue简单实现购物车结算功能

    vue简单实现购物车结算功能

    这篇文章主要为大家详细介绍了vue简单实现购物车结算功能,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-04-04

最新评论