JavaScript中对象的属性:如何遍历属性
for/in 语句循环遍历对象的属性。
js中获取key得到某对象中相对应的value的方法:obj.key
js中根据动态key得到某对象中相对应的value的方法有二:
一、var key = "name1";var value = obj[key];
二、var key = "name1";var value = eval("obj."+key);
object对象没有length属性,那么获取object对象的length就可以通过遍历得到key值的数组的长度来获取啦~
使用 for in 循环遍历对象的属性时,原型链上的所有属性都将被访问:
Object.prototype.bar = 10;// 修改Object.prototype
var obj={"name":"wjy","age":26,"sex":"female"};//定义一个object对象
var keys=[];//定义一个数组用来接受key
var values=[];//定义一个数组用来接受value
for(var key in obj){
keys.push(key);
values.push(obj[key]);//取得value
}
alert("keys is :"+keys+" and values is :"+values);
//keys is : name,age,sex,bar and values is : wjy,26,female,10
推荐总是使用 hasOwnProperty 方法, 这将会避免原型对象扩展带来的干扰:
function allpro(obj){
var keys=[];
var values=[];
for(var key in obj){
//只遍历对象自身的属性,而不包含继承于原型链上的属性。
if (obj.hasOwnProperty(key) === true){
keys.push(key);
values.push(obj[key]);
}
}
alert("keys is :"+keys+" and values is :"+values);
}
Object.prototype.bar = 1;// 修改Object.prototype
var o={"name":"wjy","age":26,"sex":"female"};//定义一个object对象
allpro(o);
//keys is : name,age,sex and values is: wjy,26,female
1.遍历可枚举的自身属性
可枚举的意思就是该属性的[[Enumerable]]特性为true,自身属性的意思就是该属性不是从原型链上继承下来的.
(function () {
var propertys = Object.keys(window);
alert(propertys.length); //3
alert(propertys.join("\n")); //window,document,InstallTrigger,除了最后一个是火狐私有的属性,原来window对象只有两个可枚举的自身属性.window属性指向window对象自身,一般没什么用.
})()
2.遍历所有的自身属性
特性为不可枚举的属性也并不是遍历不到,ES5给我们提供了getOwnPropertyNames方法,可以获取到一个对象的所有自身属性.
(function () {
var propertys = Object.getOwnPropertyNames(window);
alert(propertys.length); //72
alert(propertys.join("\n")); //Object,Function,eval等等
})()
3.遍历可枚举的自身属性和继承属性
继承属性怎么遍历,你应该知道,就是最常用的for in遍历
(function () {
var getEnumPropertyNames = function (obj) {
var props = [];
for (prop in obj) {
props.push(prop);
}
return props;
}
var propertys = getEnumPropertyNames(window);
alert(propertys.length); //185
alert(propertys.join("\n")); //addEventListener,onload等等
})()
4.遍历所有的自身属性和继承属性
这种遍历主要用在各种js调试工具的代码补全功能上.比如Firebug的.
(function () {
var getAllPropertyNames = function (obj) {
var props = [];
do {
props = props.concat(Object.getOwnPropertyNames(obj));
} while (obj = Object.getPrototypeOf(obj));
return props;
}
var propertys = getAllPropertyNames(window);
alert(propertys.length); //276
alert(propertys.join("\n")); //toString等
})()
JavaScript中对象的属性:如何遍历属性的更多相关文章
- JavaScript中对象的属性
在JavaScript中,属性决定了一个对象的状态,本文详细的研究了它们是如何工作的. 属性类型 JavaScript中有三种不同类型的属性:命名数据属性(named data properties) ...
- javascript中元素的scrollLeft和scrollTop属性说明
再说意义之前,前说一下这两个属性的适用范围: 注意:这两个属性只能用于元素设置了overflow的css样式中.否者这两个属性没有任何意义.且overflow的值不能为visible,但可以为hidd ...
- javascript中对象字面量的理解
javascript中对象字面量与数组字面量 第一部分 我们知道JavaScript中的数据类型有基本数据类型和引用类型,其中Object类型就是非常常用的类型.那么如果创建一个Object类型的实例 ...
- JavaScript 中的12种循环遍历方法
原文:JavaScript 中的12种循环遍历方法 题目:请介绍 JavaScript 中有哪些循环和遍历的方法,说说它们的应用场景和优缺点? 1.for 循环 let arr = [1,2,3];f ...
- 关于JavaScript中对象的继承实现的学习总结
一.原型链 JavaScript 中原型链是实现继承的主要方法.其主要的思想是利用原型让一个引用类型继承另一个引用类型的属性和方法.实现原型链有一种基本模式,其代码如下. function Super ...
- javascript中对象的深度克隆
记录一个常见的面试题,javascript中对象的深度克隆,转载自:http://www.2cto.com/kf/201409/332955.html 今天就聊一下一个常见的笔试.面试题,js中对象的 ...
- 【你不知道的javaScript 上卷 笔记7】javaScript中对象的[[Prototype]]机制
[[Prototype]]机制 [[Prototype]]是对象内部的隐试属性,指向一个内部的链接,这个链接的作用是:如果在对象上没有找到需要的属性或者方法引用,引擎就 会继续在 [[Prototyp ...
- JavaScript中对象转换为原始值的规则
JavaScript中对象转换为原始值遵循哪些原则? P52 对象到布尔值对象到布尔值的转换非常简单:所有的对象(包括数字和函数)都转换为true.对于包装对象亦是如此:new Boolean(fal ...
- [转] JavaScript中的属性:如何遍历属性
在JavaScript中,遍历一个对象的属性往往没有在其他语言中遍历一个哈希(有些语言称为字典)的键那么简单.这主要有两个方面的原因:一个是,JavaScript中的对象通常都处在某个原型链中,它会从 ...
随机推荐
- ZOJ3158 【DFS】
题意: 从上往下切割,不能切边缘,然后问你两个差值,要小于给出的值. 思路: 直接爆搜,枚举每一行的劈开位置: #include<bits/stdc++.h> using namespac ...
- CodeForces 723F【DFS瞎搞】
题意: 给你一幅图,你要用这些边构造一个树, s和t两个节点的度数不能超过ds dt 而且图是保证没有环 思路: 树的性质是:无环(已经保证),无向(保证),连通(还要判断) 首先把S,T点从图里剥离 ...
- hdoj2577【多种状态】(简单DP)
#include <stdio.h> #include <iostream> #include <sstream> #include <string.h> ...
- 安装Net::OpenSSH 库
perl 离线安装 Net::OpenSSH 库 Net::OpenSSH 库 下载地址https://metacpan.org/pod/Net::OpenSSH 直接获取安装包命令 wget htt ...
- 结合 webpack 使用 vue-router(七)
结合 webpack 使用 vue-router: 首先安装路由包vue-router: cnpm install vue-router 使用模块化工具导入 vue-router 后,必须手动调用 V ...
- Android近场通信---NFC基础(二)(转)
转自 http://blog.csdn.net/think_soft/article/details/8171256 应用程序如何调度NFC标签 当标签调度系统完成对NFC标签和它的标识信息封装的In ...
- MarkdownPad - win10环境下无法渲染HTML问题
问题 在win10平台安装了MarkdownPad 2之后,发现在渲染md文件时报错,在预览页面无法正常渲染HTML: 安装报错提示前往官网,可以看到如下的解决方法: LivePreview is n ...
- [題解](并查集)luogu_P2391 白雪皚皚
今天被老師留的作業搞死了,全是裸的水題,難題就那麼兩道我還沒寫......,狗屎 1.倒序處理,每個點至多會被更新一次 2.所以要做的就是快速找到下一個不同顏色的點, 3.然而不知道怎麼就 想到用并查 ...
- Codeforces Round #533(Div. 2) D.Kilani and the Game
链接:https://codeforces.com/contest/1105/problem/D 题意: 给n*m的地图,最多9个人,同时有每个人的扩张次数(我开始以为是直线扩张最大长度..实际是能连 ...
- D.出题人的手环
链接:https://ac.nowcoder.com/acm/contest/358/D 题意: 出题人的妹子送了出题人一个手环,这个手环上有 n 个珠子,每个珠子上有一个数. 有一天,出题人和妹子分 ...