Object.keys()方法的运用与数组遍历

Object.keys()用于获得由对象属性名组成的数组,可与数组遍历相结合使用,用起来效果杠杠滴。数组遍历可以用for()或forEach()来实现,forEach()方法是ECMAScript5定义的遍历数组的一个新方法,按照索引的顺序挨个传递给定义的函数;接下来就Object.keys()分别结合for()和forEach()使用进行运用,用console.log输出到控制台,代码如下:

1.for()

 //创建对象
var person = {
ChineseName: "wjh",
EnglishName: "Bruce",
age: 10,
school:"HQ University"
}
var keys = Object.keys(person);//获得对象属性名组成的数组
varvalue = [];//用于存储匹配的属性值
//用for进行遍历
for (var i = 0,len = keys.length; i < len; i++) {
var key = keys[i];
value[i] = person[key];
console.log("person ", key, ": ", value[i]);
}

2.forEach()

//创建对象
var person = {
ChineseName: "wjh",
EnglishName: "Bruce",
age: 10,
school:"HQ University"
}
//用forEach()进行遍历
var keys = Object.keys(person).forEach(function(tz) {
console.log("person ", tz, ": ", person[tz]);
});

运行程序,两种方法的结果是一样的,效果如下图,至于使用哪种方法,就智者见智,仁者见仁啦,for(),用起来比较容易上手,但太罗嗦;forEach()和相关的遍历方法结合,使得数组拥有简单而强大的函数式编程风格,更加强大。

Object.keys() 遍历对象的更多相关文章

  1. Object.keys()返回对象自身可枚举属性组成的数组

    Object.keys()方法是对一个对象的key遍历,会把key组成一个数组返回 示例: // 参数为数组时,返回的是数组的索引 let arr1 = [1, 2, '3'] console.log ...

  2. Object.keys()返回对象的属性

    <script> // 传入对象,返回属性名 let obj = { 'a': '123', 'b': '456' } console.log(Object.keys(obj)) //[& ...

  3. JavaScript indexOf() 方法,获取元素的位置;Object.keys()获取对象的所有key的数组

    定义和用法 indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置. 语法 stringObject.indexOf(searchvalue,fromindex) 参数 描述 sea ...

  4. javascript traverse object attributes 遍历对象属性

    * for in for (var prop in o) { if (o.hasOwnProperty(prop)) { console.log(o[prop]); } } * Object keys ...

  5. for in 与 Object.keys 与 hasOwnProperty区别

    1.结论 for in遍历对象所有可枚举属性 包括原型链上的属性 Object.keys遍历对象所有可枚举属性 不包括原型链上的属性 hasOwnProperty 检查对象是否包含属性名,无法检查原型 ...

  6. or in 、Object.keys()以及Object.getOwnPropertyNames有什么区别?

    or in .Object.keys()以及Object.getOwnPropertyNames的区别 var obj= Object.create(parent, { b: { value: 2, ...

  7. js中遍历对象(5种)和遍历数组(6种)的方法总结(转载)

    一.遍历对象方法 1.for...in遍历输出的是对象自身的属性以及原型链上可枚举的属性(不含Symbol属性),原型链上的属性最后输出说明先遍历的是自身的可枚举属性,后遍历原型链上的 eg: var ...

  8. for in,Object.keys()与for of的区别

    for in 1.for in一般用于遍历对象的属性: 2.作用于数组的for in除了会遍历数组元素外,还会遍历自定义可枚举的属性,以及原型链上可枚举的属性:3.作用于数组的for in的遍历结果是 ...

  9. javaScript遍历对象、数组总结(转载)

    javaScript遍历对象.数组总结  转载来源 https://www.cnblogs.com/chenyablog/p/6477866.html 在日常工作过程中,我们对于javaScript遍 ...

随机推荐

  1. 使用url_for()时,会自动调用转换器的to_url()方法

    视图反推url,在动态url(转换器)反推中的应用 # -*- coding: utf-8 -*- from flask import Flask, url_for, redirect from we ...

  2. nginx搭建反向代理服务器详解

    一.反向代理:Web服务器的“经纪人” 1.1 反向代理初印象 反向代理(Reverse Proxy)方式是指以代理服务器来接受internet上的连接请求,然后将请求转发给内部网络上的服务器,并将从 ...

  3. git日常命令

    克隆项目:git clone addr dir 切换分支,分支并没有 git checkout -b production origin/production 分支已存在,单纯切换分支 git che ...

  4. Ceph 调整crush map

    目录 Ceph 调整crush map 1.前言 2.示例 1.创建新的replicated 2.修改当前pool的rule Ceph 调整crush map 1.前言 本文章适用于ceph n版 2 ...

  5. JavaScript展开操作符(Spread operator)介绍

    本文介绍JavaScript的展开操作符(Spread operator)....本文适合ES6初学者. 你可以通过展开操作符(Spread operator)...扩展一个数组对象和字符串.展开运算 ...

  6. ubuntu---记录.opencv多版本管理与切换

    首先当然准备两个不同版本opencv (比如2..9和3.1.0) cmake-gui 设置 CMAKE_INSTALL_PREFIX 安装路径:/usr/local/opencv2 安装路径 :/u ...

  7. 二分法:从一个只包含数字的list中查找某个数

    #!/usr/bin/env python # -*- coding: utf-8 -*- # @Time : 2017/4/10 19:03 # @Author : MnCu # @Site : # ...

  8. 甘特图控件如何自定义绘图?DevExpress Winforms帮你忙

    DevExpress Winforms Controls 内置140多个UI控件和库,完美构建流畅.美观且易于使用的应用程序.无论是Office风格的界面,还是分析处理大批量的业务数据,DevExpr ...

  9. phpstorm和ftp搭配使用

    简单使用

  10. Oracle 中文转字母 函数

    CREATE OR REPLACE FUNCTION F_TRANS_PINYIN_CAPITAL(P_NAME IN VARCHAR2) RETURN VARCHAR2 AS V_COMPARE V ...