Object.defineProperty

1. 概念
    1. mdn定义的defineProperty
    2. Object.defineProperty() 方法
        1. 会直接在一个对象上定义一个新属性,或者修改一个已经存在的属性,
        2. 并返回这个对象。
2. 语法
    1. Object.defineProperty(obj, prop, descriptor)
    2. 参数:
        1. obj  需要定义属性的对象。
        2.  prop 需定义或修改的属性的名字。
        3.  descriptor  将被定义或修改的属性的描述符。
    3. 返回值
        1. 返回传入函数的对象,即第一个参数obj
3. 学习这个属性的目的
    1. 该方法允许精确添加或修改对象的属性。
    2. 一般情况下,
        1. 我们为对象添加属性是通过赋值来创建并显示在属性枚举中
        2. (for...in 或 Object.keys 方法), 但这种方式添加的属性值可以被改变,
        3. 也可以被删除。而使用 Object.defineProperty() 则允许改变这些额外细节的默认设置。
    3. 在写框架的时候
        1. 例如,默认情况下,使用  Object.defineProperty() 增加的属性值是不可改变的。
4. 注意:
    1. 第三个参数都会为第二个参数(属性的操作)
    2. 第二个参数可以是之前已经存在的,也可以是新增加的,对属性的用法的限制
5. 第三个参数对象的取值
    1.  configurable : true,可以被删除的;默认是false,不可以被删除的;
    2.   enumerable : true, 可以对第二个参数的属性进行遍历;false默认值,不可以;
    3.   value : 该属性对应的值。默认为 undefined//新增的就是直接赋值,对象中就存在的就是修改
    4.   writable : 
        1.   当且仅当该属性的 writable 为 true 时,该属性才能被赋值运算符改变。
        2.   默认为 false。
    5. get 和  set
        1. 5.1 get
            1.  一个给属性提供 getter 的方法,
            2.  如果没有 getter 则为 undefined。
            3.  该方法返回值被用作属性值
            4.  undefined
        2. set
            1. 一个给属性提供 setter 的方法,
            2. 如果没有 setter 则为 undefined。
            3. 该方法将接受唯一参数,并将该参数的新值分配给该属性。
            4. 默认为 undefined。


6. 代码
    1. 正常的直接进行创建一个对象
        1. 利用对象的动态操作特性进行给对象操作属性
        2. 代码

                          /*
			    * 一般情况下:
			    *       动态给对象添加属性
			    * 添加的属性值可以被改变
			    * */
			    /*var obj = {};
			    obj.name = 'waxun';
			    obj['age'] = 18;
			    //Object {name: "waxun", age: 18}
			    console.log(obj);*/

 

 2. 使用可以自己控制
       1. 代码

/*
			    * Object.defineProperty()
			    * */
			    var obj = {
			        age : 18
			    };
			    var nameV;//只是一个给set和get的一个中间变量
				    Object.defineProperty(obj,'name',{
				//        configurable : false,
				//        enumerable : false,
				//        value : 'waxun',
				//        writable : false,
				        get : function(){
				            console.log('get方法被调用');
				            return nameV;//进行返回set进行设置的值
				        },
				        set : function(newVal){
				            console.log('set方法被调用');
				            nameV = newVal;
				        }
				    });
				    //Object {age: 18, name: undefined}
				    //给obj添加了name属性,值为undefiend
				//    console.log(obj);
				
				    //Object {} 设置configurable : true,可以被删除的
				   /* delete obj['name'];
				   //Object {age: 18, name: undefined}
				    console.log(obj);
				    */
				
				    //Object {age: 18, name: undefined},true还是打印原来的值,不可以被删除
				   /* delete obj['name'];
				    //Object {name: undefined}
				    delete obj['age'];
				    console.log(obj);*/
				
				    //Object {age: 18, name: undefined}
				    //enumerable : true18  undefined/false 只打印18
				   /* console.log(obj);
				    for(var k in obj){
				        console.log(obj[k]);
				    }*/
				
				    //Object {age: 18, name: "waxun"}
				//    console.log(obj);
				
				    //writable true:可写,Object {age: 18, name: "kaguo"}
				    //false :Object {age: 18, name: undefined},不可以进行赋值运算
				//    obj.name = 'kaguo';
				//    console.log(obj);
				
				    //get
				    //get方法被调用  waxun
				    //直接在获得通过defineProperty定义的属性的时候,就进行get获取值的操作,并且将get的返回值给
				    //第二参数的属性赋值
				
				
				    //set  和 get  的配合使用
				    //set方法被调用,将右边的kaguo,调用     set方法进行设置值
				    obj.name = 'kaguo';
				    //通过取值的方式,调用get方法,进行取值   get方法被调用
				    console.log(obj.name);

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值