zoukankan      html  css  js  c++  java
  • 这次彻底理解了Object这个属性

    1.实例化Object对象

    实例化Object对象的方式有两种:使用Object构造器和使用对象的字面量。例如:

    var person1 = {
        name: '李四'
    };
    
    var person2 = new Object();
    person2.name = '王二';

    2.为实列添加属性

    我们可以随时随地为对象添加属性,也可以随时修改属性的值。

    var person1 = {
        name: '小明'
    };
    
    var person2 = new Object();
    person2.name = '小红';
    
    //给对象添加属性
    person1.age = 23;
    person2.age = 25;
    
    //修改属性的值
    person1.name = '张三';
    console.log(person1.name);      //'张三'
    person2.name = '李四';
    console.log(person2.name);      //'李四'

    3.删除对象中的属性

    var person1 = {
        name: '张三'
    };
    
    person1.name = null;
    
    
    
    console.log(person1.name);      //'张三'
    
    delete person1.name;
    
    console.log(person1.name);      //'undefined'

    4.检查属性

    由于对象的属性可以被随时随地被修改或删除,因此有时候我们需要检查对象的某个属性是否存在。使用下面的方式检查是不可靠的:

    var person1 = {
        name: '张三'
    };
    
    
    person1.name = '';//或者null/undefined
    
    if (person1.name) {
    
        console.log('存在');
    
    } else {
    
        console.log('不存在');         //'不存在'
    }

    使用这种方式可能会得不到正确的结果,如果属性的值是:对象,非空字符串,非零的数或者true,if条件语句会把它们转换成true。如果属性的值是:null,undefined,0,false,NaN,空字符串,if条件语句会把它们转换成false。检差对象中的属性是否存在的更可靠的方式是使用in操作符:

    var person1 = {
                name: '张三'
    };
    
    
    person1.name = '';//或者null/undefined
    
    if ('name' in person1) {
    
        console.log('存在');          //'存在'
    
    } else {
    
        console.log('不存在');
    }

    5.遍历实列的属性

    默认情况下,我们添加到对象上的属性都是可枚举的,这样的话我们就可以使用for-in循环遍历它们。

    var obj = {
        name: '王志龙',
        age: 23,
        gender: '男',
        address: '鹤壁'
    };
    
    var propertyName;
    
    for (propertyName in obj){
    
        console.log('属性名:' + propertyName);
        console.log('属性值:' + obj[propertyName]);
    }

    for-in循环每循环一次都会将一个属性名赋值给propertyName,直到所有的属性都被遍历一遍为止。

    如果我们只是想获取一个对象中的所有属性名,可以使用Object.keys()方法。该方法会以数组的形式返回所有的属性名。

    console.log(Object.keys(obj));     // ["name", "age", "gender", "address"]

    6.属性的分类

    属性的类型分两种:一种是数据属性,一个种是访问器属性。数据属性用来存储一个值,比如所上个例子中的name。访问器属性不包含值,而是定义了一个getset函数,当读取属性时,调用get函数,当写属性时,调用set函数。

    下面是一个使用字面量的形式定义访问器属性的语法:

    var obj = {
    
        _myname: 'clw',
    
        get name(){
    
            console.log('get方法被调用了');
            return this._myname + '1111';
    
        },
        set name(value){
    
            console.log('set方法被调用了');
            this._myname = value;
    
        }
    };
    
    console.log(obj.name);

    7.属性的内部

      7.1共享的属性:

    数据属性和访问器属性共享的内部特性有两个:一个是[[Enumerable]],这个特性决定了我们是否能够遍历该属性。另一个是[[Configurable]],这个特性决定了我们是否能够改变属性。默认情况下我们在对象上添加的属性都是可枚举、可配置的。

    如果我们向改变属性的特性,可以使用Object.defineProperty()方法。该方法接受3个参数:拥有被修改属性的对象、被修改的属性名、包含描述特性的对象。描述符和内部特性名称相同,但是没有方括号。例如,我们将一个属性改成不能枚举,不能配置:

    var person1 = {
        name: '张三',
        age: 22
    };
    
    console.log(person1.propertyIsEnumerable('name'));
    
    Object.defineProperty(person1, 'name', {
        enumerable: false
    });
    
    console.log('name' in person1);                     //true
    console.log(person1.propertyIsEnumerable('name'));  //false
    
    var properties = Object.keys(person1);
    console.log(properties);                            //["age"]
    
    //delete person1.name;
    //console.log(person1.name);                        //'undefined'
    
    Object.defineProperty(person1, 'name', {
        configurable: false
    });
    
    delete person1.name;
    console.log(person1.name);                          //'张三'

      7.2访问器属性内部的特性:

    var obj = {
    
        _myname: 'clw',
    
        get name(){
    
            console.log('get方法被调用了');
            return this._myname + '1111';
    
        },
        set name(value){
    
            console.log('set方法被调用了');
            this._myname = value;
    
        }
    };
    
    
    //上面的代码等价于:
    
    var obj2 = {
        _myname: 'clw'
    };
    
    
    Object.defineProperty(obj, 'name', {
        get: function() {
    
            console.log('get方法被调用了');
            return this._myname + '1111';
    
        },
        set: function(value) {
    
            console.log('set方法被调用了');
            this._myname = value;
    
        },
        configurable: true,
        enumerable: true
    });

      7.3定义多个属性的内部特性:

    定义单个属性的内部特性使用Object.defineProperty(),定义多个属性使用的是Object.defineProperties(),这个方法接受2个参数,第一个是属性所属的对象,第二个是包含被定义属性的对象。

      var person1 = {};
    
            Object.defineProperties(person1, {
                name: {
                    value: '张三',
                    enumerable: true,
                    configurable: true,
                    writable: true
                },
                age: {
                    value: 23,
                    enumerable: false,
                    configurable: false,
                    writable: false
                },
                address: {
                    get: function(){
    
                    },
                    set: function(value){
    
                    },
                    enumerable: true,
                    configurable: true
                }
            });
    
            console.log(person1.name);              //'张三'
            person1.name = '李四';
            console.log(person1.name);              //'李四'
    
            console.log(person1.age);               //23
            person1.age = 500;
            console.log(person1.age);               //23

      7.4获取属性内部的特性

    获取属性的内部特性的方法有两个:Object.getOwnPropertyDescriptor()Object.getOwnPropertyDescriptors()

    var person1 = {};
    
            Object.defineProperties(person1, {
                name: {
                    value: '张三',
                    enumerable: true,
                    configurable: true,
                    writable: true
                },
                age: {
                    value: 23,
                    enumerable: false,
                    configurable: false,
                    writable: false
                },
                address: {
                    get: function(){
    
                    },
                    set: function(value){
    
                    },
                    enumerable: true,
                    configurable: true
                }
            });
    
            //获取对象中单个属性的内部特性
            var descriptor = Object.getOwnPropertyDescriptor(person1, 'address');
            //获取对象中所有属性的内部特性
            var descriptors = Object.getOwnPropertyDescriptors(person1);
            console.log(descriptors);
  • 相关阅读:
    glog入门demo
    gflag的简单入门demo
    caffe库源码剖析——net层
    排序算法的c++实现——计数排序
    docker的/var/lib/docker目录迁移
    SpringCloud Ribbon 负载均衡 通过服务器名无法连接的神坑一个
    Spring Boot Cache使用与整合
    Navicat Keygen
    Windows / Office
    docker swarm 搭建与服务更新
  • 原文地址:https://www.cnblogs.com/zhoulifeng/p/7523113.html
Copyright © 2011-2022 走看看