zoukankan      html  css  js  c++  java
  • 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("
    "));     //window,document,InstallTrigger,除了最后一个是火狐私有的属性,原来window对象只有两个可枚举的自身属性.window属性指向window对象自身,一般没什么用.
    })()
    

      

    2.遍历所有的自身属性

    特性为不可枚举的属性也并不是遍历不到,ES5给我们提供了getOwnPropertyNames方法,可以获取到一个对象的所有自身属性.

    (function () {
        var propertys = Object.getOwnPropertyNames(window);
        alert(propertys.length);       //72
        alert(propertys.join("
    "));   //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("
    "));   //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("
    "));      //toString等
    })()
    

      

  • 相关阅读:
    软考之操作系统
    牛腩javascript(二)之正则表达式
    牛腩javascript(一)
    软考之算法
    软考之数据结构
    软考之路之刷屏开始
    XML中的几种比较
    北大青鸟ASP.NET之总结篇
    Webassembly 学习2 -- Js 与C 数据交互
    nginx-proxy_redirect
  • 原文地址:https://www.cnblogs.com/laneyfu/p/7461955.html
Copyright © 2011-2022 走看看