• JS数组与对象的遍历方法大全


    本文主要介绍数组和对象属性的遍历方法:

    1. for-in和for-of
    2. map和forEach区别
    3. Object.keys()
    4. getOwnPropertyNames()

    一、for-in和for-of

    1.for-in循环是为了遍历对象而设计的,事实上for-in也能用来遍历数组,但定义的索引i是字符串类型的。如果数组具有一个可枚举的方法,也会被for-in遍历到

    2.ES6中,新增了for-of遍历方法。它被设计用来遍历各种类数组集合,例如DOM NodeList对象、Map和Set对象,甚至字符串也行。

    var obj={
            "name":"kebi",
            "age":40
       }
    var arr=["小明","小红","小黄"]
    1.for-in
    for(var index in obj){
      console.log(index)          //打印 name age 
      console.log(obj[index])     //打印 kebi 40
    }
    
    2.for-of
    for(var value in arr){
      console.log(value)           //打印 小明 小红 小黄
    }
    // for-of遍历字符串
    let iterable = "happy";
    for (let value of iterable) {
      console.log(value)              //打印 h a p p y
    }

      二、map和forEach区别

    1.forEach()方法不会返回执行结果,而是undefined。(IE9以下不支持)不能使用break语句中断循环,也不能使用return语句返回到外层函数。

    2.map()方法会得到一个新的数组并返回,map遍历支持使用return语句,支持return返回值(IE9以下不支持)

    1.forEach
    arr.forEach((item,index)=>{
        console.log(index+":"+item)     //打印 0:小明 1:小红 2:小黄
    })
    2.Map
    var returnArr=arr.map((item,index)=>{
        return item+"1"
    })
    console.log(returnArr)             //打印 ["小明1", "小红1", "小黄1"]            

    三、Object.keys()

    1.使用Object.keys()遍历 返回一个数组,包括对象自身的(不含继承的)所有可枚举属性(不含Symbol属性).

    Object.keys(obj).forEach(function(key){
        console.log(key +"   "+ obj[key])
            //打印 name kebi  age 40     
    })

    四、Object.getOwnPropertyNames() 

    1.Object.getOwnPropertyNames()方法返回对象的所有自身属性的属性名(包括不可枚举的属性)组成的数组,但不会获取原型链上的属性。

    Object.getOwnPropertyNames(obj).forEach(function(key){
        console.log(key +"   "+ obj[key])
             //打印 name kebi  age 40   
    })
  • 相关阅读:
    列表,表格与媒体元素
    【Mac + Appium + Python3.6学习(三)】之IOS自动化测试环境配置
    Mac 下的自动化学习
    【Mac + Appium + Python3.6学习(二)】之Android自动化测试,appium-desktop配置和简易自动化测试脚本
    【Mac + Appium学习(一)】之安装Appium环境前提准备
    anyproxy-初识使用
    fiddler 学习教程
    Linux学习
    python 接口自动化
    python 学习教程
  • 原文地址:https://www.cnblogs.com/heyushuo/p/8794043.html
Copyright © 2020-2023  润新知