对象的迭代方法 ES8/ES2017

对象的自我看法

在JavaScript中,对象的定义范围很广阔。Js面向对象开发,又说一切皆对象。

number,string,array,function,object。。。都可以称之为对象。

概念很是玄乎,似乎与玄学沾了一点儿边。自我认为,这样的对象只是Js中一切事物的通称。

而我们此处所言之对象,只是这个通称细分下的一个具体数据结构类型。

简而言之,便是多对键值对(key-value)的集合。

类似的数据结构类型,在python中称为字典(dict)。

一般而言,大多数编程语言所定义拥有的数据结构类型是大抵相同的。无非叫法不同而已。因此掌握的语言不在于多,而在于所具有的编程逻辑思维,语言只是工具,思维是通用的。

1
2
3
4
5
6
7
8
9
10
11
12
// 如:把一个人的信息抽象化为一一对应的键值对。
用这个menIntro对象来描述一个人的各种属性。
这个对象,便是一个人的抽象化

let menIntro = {
name: 'aning',
age: 18,
height: 175
hobby: ['music', 'movie'],
}

需要获取单个属性值我们可以 obj[key] || obj.key 视具体情况选择(当键名为字符串类型时)

如何迭代对象

对象的数据结构类型不同于数组,每个项都由一对键值对组成。

  • 迭代方法选择
  1. Object.keys(menIntro)
  • 返回由该对象obj的所有key所组成的数组
  • [‘name’, ‘age’, ‘hobby’]
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    Object.keys(menIntro).forEach((key, index) => {
    console.log(key, menIntro[key])
    })

    // 当我们进入ES6时代后
    for(key of Object.keys(menIntro)){
    console.log(key, menIntro[key])
    }

    以上本质都是通过key索引对应键值,不仅曲折又进行了多余操作令人别扭。
  1. Object.values(menIntro) ES2017/ES8
  • 返回由该对象的所有value所组成的数组
  • [‘aning’, 18, [‘music’, ‘movie’]]
1
2
3
4
5
6
7
// 通过  Object.values() 我们便可以把单纯的键值取出

for(item of Object.values(menIntro)){
console.log(item)
}

// 直接了然,代码逻辑贴近直觉。
  1. Object.entries(menIntro) ES2017/ES8

    • 把该对象每一键值对都放入一个数组进行包裹,键名在index 0处,键值在index 1处。
    • 再将所有的数组又用一个数组包裹。
    • [ [“name”, “luojun”], [“age”, 18], [“like”, [“music”, “movie”] ] ]
      1
      2
      3
      4
      5
      for(item of Object.entries(obj)){
      console.log(item)
      }

      // for...of...遍历的每一项便是每一键值对转换成的数组。可利用下标索引。
文章作者: Luo Jun
文章链接: /2018/02/01/iteratorOfObject/
版权声明: 本博客所有文章除特别声明外,均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来自 Aning