• 获取对象属性(所有属性、可枚举、不可枚举、自身属性【非原型链继承】)个数详解


    一、获取可枚举的属性

    方法一:for......in

    方法一:Object.keys()

    Object.keys() 方法会返回一个由一个给定对象的自身可枚举属性组成的数组,数组中属性名的排列顺序和使用 for...in 循环遍历该对象时返回的顺序一致 。

    语法

    Object.keys(obj)

    参数

    obj:要返回其枚举自身属性的对象。

    返回值

    一个表示给定对象的所有可枚举属性的字符串数组。

    例子

    // simple array
    var arr = ['a', 'b', 'c'];
    console.log(Object.keys(arr)); // console: ['0', '1', '2']
    
    // array like object
    var obj = { 0: 'a', 1: 'b', 2: 'c' };
    console.log(Object.keys(obj)); // console: ['0', '1', '2']
    
    // array like object with random key ordering
    var anObj = { 100: 'a', 2: 'b', 7: 'c' };
    console.log(Object.keys(anObj)); // console: ['2', '7', '100']
    
    // getFoo is a property which isn't enumerable
    var myObj = Object.create({}, {
      getFoo: {
        value: function () { return this.foo; }
      } 
    });
    myObj.foo = 1;
    console.log(Object.keys(myObj)); // console: ['foo']

    注意

    在ES5里,如果此方法的参数不是对象(而是一个原始值),那么它会抛出 TypeError。在ES2015中,非对象的参数将被强制转换为一个对象。

    Object.keys("foo");
    // TypeError: "foo" is not an object (ES5 code)
    
    Object.keys("foo");
    // ["0", "1", "2"]                   (ES2015 code)

    二、获取可枚举和不可枚举属性

    Object.getOwnPropertyNames()方法返回一个由指定对象的所有自身属性的属性名(包括不可枚举属性但不包括Symbol值作为名称的属性)组成的数组,数组中枚举属性的顺序与通过 for...in 循环(或 Object.keys)迭代该对

    象属性时一致。数组中不可枚举属性的顺序未定义。

    如果你想获取一个对象的所有属性,,甚至包括不可枚举的,请查看Object.getOwnPropertyNames

    语法

    Object.getOwnPropertyNames(obj)

    参数

    obj:一个对象,其自身的可枚举和不可枚举属性的名称被返回。

    返回值

    在给定对象上找到的自身属性对应的字符串数组。

    示例

    var arr = ["a", "b", "c"];
    console.log(Object.getOwnPropertyNames(arr).sort()); // ["0", "1", "2", "length"]
    
    // 类数组对象
    var obj = { 0: "a", 1: "b", 2: "c"};
    console.log(Object.getOwnPropertyNames(obj).sort()); // ["0", "1", "2"]
    
    // 使用Array.forEach输出属性名和属性值
    Object.getOwnPropertyNames(obj).forEach(function(val, idx, array) {
      console.log(val + " -> " + obj[val]);
    });
    // 输出
    // 0 -> a
    // 1 -> b
    // 2 -> c
    
    //不可枚举属性
    var my_obj = Object.create({}, {
      getFoo: {
        value: function() { return this.foo; },
        enumerable: false
      }
    });
    my_obj.foo = 1;
    
    console.log(Object.getOwnPropertyNames(my_obj).sort()); // ["foo", "getFoo"]

    三、获取不可枚举的属性

    filter()方法创建一个新数组, 其包含通过所提供函数实现的测试的所有元素。 

    使用了 Array.prototype.filter() 方法,从所有的属性名数组(使用Object.getOwnPropertyNames()方法获得)中去除可枚举的属性(使用Object.keys()方法获得),剩余的属性便是不可枚举的属性了:

    var target = myObject;
    var enum_and_nonenum = Object.getOwnPropertyNames(target);
    var enum_only = Object.keys(target);
    var nonenum_only = enum_and_nonenum.filter(function(key) {
        var indexInEnum = enum_only.indexOf(key);
        if (indexInEnum == -1) {
            // 没有发现在enum_only健集中意味着这个健是不可枚举的,
            // 因此返回true 以便让它保持在过滤结果中
            return true;
        } else {
            return false;
        }
    });
    
    console.log(nonenum_only);

    提示

    在 ES5 中,如果参数不是一个原始对象类型,将抛出一个 TypeError  异常。在 ES2015 中,非对象参数被强制转换为对象 

    Object.getOwnPropertyNames('foo');
    // TypeError: "foo" is not an object (ES5 code)
    
    Object.getOwnPropertyNames('foo');
    // ['length', '0', '1', '2']  (ES2015 code)

    四、自身属性【非原型链继承】

    使用obj.hasOwnProperty()方法,Object.prototype.hasOwnProperty()返回一个布尔值,指示对象自身属性中是否具有指定的属性(也就是,是否有指定的键),该方法会忽略掉那些从原型链上继承到的属性。

    语法

    obj.hasOwnProperty(prop)

    参数

    prop:要检测的属性的 String 字符串形式表示的名称,或者 Symbol

    返回值

    用来判断某个对象是否含有指定的属性的布尔值 Boolean

    示例

    1、使用 hasOwnProperty 方法判断属性是否存在

    下面的例子检测了对象 o 是否含有自身属性 prop

    o = new Object();
    o.hasOwnProperty('prop'); // 返回 false
    o.prop = 'exists';
    o.hasOwnProperty('prop'); // 返回 true
    delete o.prop;
    o.hasOwnProperty('prop'); // 返回 false

    2、自身属性与继承属性

    下面的例子演示了 hasOwnProperty 方法对待自身属性和继承属性的区别:

    o = new Object();
    o.prop = 'exists';
    o.hasOwnProperty('prop');             // 返回 true
    o.hasOwnProperty('toString');         // 返回 false
    o.hasOwnProperty('hasOwnProperty');   // 返回 false

    备注

    即使属性的值是 null 或 undefined,只要属性存在,hasOwnProperty 依旧会返回 true

    o = new Object();
    o.propOne = null;
    o.hasOwnProperty('propOne'); // 返回 true
    o.propTwo = undefined;  
    o.hasOwnProperty('propTwo'); // 返回 true

    3、使用 hasOwnProperty 作为属性名

    JavaScript 并没有保护 hasOwnProperty 这个属性名,因此,当某个对象可能自有一个占用该属性名的属性是,就需要使用外部的 hasOwnProperty 获得正确的结果:

    var foo = {
      hasOwnProperty: function() {
        return false;
      },
      bar: 'Here be dragons'
    };
    
    foo.hasOwnProperty('bar'); // 始终返回 false
    
    // 如果担心这种情况,
    // 可以直接使用原型链上真正的 hasOwnProperty 方法
    ({}).hasOwnProperty.call(foo, 'bar'); // true
    
    // 也可以使用 Object 原型上的 hasOwnProperty 属性
    Object.prototype.hasOwnProperty.call(foo, 'bar'); // true

    注意,只有在最后一种情况下,才不会新建任何对象。

    备注

    即使属性的值是 null 或 undefined,只要属性存在,hasOwnProperty 依旧会返回 true

    o = new Object();
    o.propOne = null;
    o.hasOwnProperty('propOne'); // 返回 true
    o.propTwo = undefined;  
    o.hasOwnProperty('propTwo'); // 返回 true

    4、获取对象属性的个数

    var attributeCount = function(obj) {
            var count = 0;
            for(var i in obj) {
                if(obj.hasOwnProperty(i)) {  // 建议加上判断,如果没有扩展对象属性可以不加
                    count++;
                }
            }
            return count;
        }
    alert(attributeCount(testObj));

    或 

    循环,只取自身的属性
    var count = 0;
    for(var i in obj){
        if(obj.hasOwnProperty(i)){
            count++
        }
    }
    console.log(count);

    参数

    MDN:Object.getOwnPropertyNames()

    MDN:Object.keys()

    MDN:Object.prototype.hasOwnProperty()

     

     

     

  • 相关阅读:
    【Maven】项目打包-war包-Jar包[IDEA将项目打成war包]
    intellij idea 配置web 项目
    centos7启动iptables时报Job for iptables.service failed because the control process exited with error cod
    shell-运算符
    shell-流程控制
    shell-流程控制
    shell-变量,字符串,数组,注释,参数传递
    shell-变量,字符串,数组,注释,参数传递
    json解析
    json解析
  • 原文地址:https://www.cnblogs.com/kunmomo/p/12005794.html
Copyright © 2020-2023  润新知