博客
关于我
js 各循环的区别
阅读量:714 次
发布时间:2019-03-21

本文共 1235 字,大约阅读时间需要 4 分钟。

for in和for of是JavaScript中用于遍历数据的两种不同方法,分别在ES5和ES6标准中首次引入。

for in方法用于遍历对象的属性。它会将所有可枚举的属性返回,但需要注意的是,这些属性可能包括从原型链上继承的属性。例如:

let obj = { a: 1 };let iterable = [3, 5, 7];iterable.foo = "hello";console.log(iterable.foo); // "hello"console.log(iterable.arrCustom); // 也会返回arrCustom吗?是的,因为它从数组的原型链中继承了这个属性。

while for of方法用于遍历具有Iterator接口的数据结构。这种数据结构如Array、Map、Set、String等都原生支持Iterator。它会逐个返回数据结构中的元素,这对于数组来说就是逐个数字,map中是每个键值对般的返回,但具体返回的格式取决于实现。

需要注意的是,从原型链继承的属性不会被for of遍历到。例如:

let iterable = [3, 5, 7];iterable.foo = "hello";for (let i of iterable) {    console.log(i); // 3,5,7}

下面我们进一步讨论它们的区别以及如何在实际开发中使用它们。

一、原生JS forEach()map() 遍历

共同点:

  • 都是用于遍历数组中的每一项。
  • 匿名函数接受item(当前项)、index(当前索引)、input(原始数组)三个参数。
  • 它们的this值都指向Window对象。
  • 只能用于数组遍历。
  • forEach() 的特点:

    • 没有返回值。
    • 适合执行一些操作,如批量修改数组中的元素。
    • 例如:
    var ary = [12, 23, 24, 42, 1];ary.forEach(function(item, index, input) {    input[index] = item * 10;});console.log(ary); // 会显示改变后的数组:[120, 230, 240, 420, 10]

    map() 的特点:

    • 有返回值,可以通过return赋值来创建新的数组。
    • 适合需要返回新数组的操作。
    • 例如:
    var res = ary.map(function(item, index, input) {    return item * 10;});console.log(res); // [120, 230, 240, 420, 10]

    在实际开发中,选择forEachmap取决于你是否需要修改原数组或是否需要返回一个新数组。forEach适合执行异步操作或只要遍历,而map适合生成新数组或依赖于回调函数的返回值。

    通过这些方法,我们可以对数组进行丰富的操作,同时保持代码的简洁和可读性。

    转载地址:http://oitrz.baihongyu.com/

    你可能感兴趣的文章
    MySQL执行SQL文件出现【Unknown collation ‘utf8mb4_0900_ai_ci‘】的解决方案
    查看>>
    Mysql执行update by id的过程
    查看>>
    mysql执行计划
    查看>>
    MySQL执行计划 EXPLAIN参数
    查看>>
    MySQL执行计划【explain】,看这一篇就够啦!
    查看>>
    Mysql执行计划字段解释
    查看>>
    mysql执行计划怎么看
    查看>>
    MySQL执行计划解读
    查看>>
    mysql执行顺序与索引算法
    查看>>
    mysql批量update优化_Mysql中,21个写SQL的好习惯,你值得拥有呀
    查看>>
    mysql批量update操作时出现锁表
    查看>>
    MYSQL批量UPDATE的两种方式
    查看>>
    mysql批量修改字段名(列名)
    查看>>
    MySQL批量插入数据遇到错误1213的解决方法
    查看>>
    mysql技能梳理
    查看>>
    MySQL报Got an error reading communication packets错
    查看>>
    Mysql报错Can‘t create/write to file ‘/tmp/#sql_3a8_0.MYD‘ (Errcode: 28 - No space left on device)
    查看>>
    MySql报错Deadlock found when trying to get lock; try restarting transaction 的问题解决
    查看>>
    MySQL报错ERROR 1045 (28000): Access denied for user ‘root‘@‘localhost‘
    查看>>
    Mysql报错Packet for query is too large问题解决
    查看>>