所在的位置: js >> js介绍 >> 解析vuejs的defineProper

解析vuejs的defineProper

北京治疗白癜风的好医院 https://baike.baidu.com/item/%E5%8C%97%E4%BA%AC%E4%B8%AD%E7%A7%91%E7%99%BD%E7%99%9C%E9%A3%8E%E5%8C%BB%E9%99%A2/9728824?fr=aladdin

正是因为Object.defineProperty()这个方法的存在,vue.js才可以那么容易的实现双向绑定的。所以我们更有必要了解一下defineProperty怎么用。

Object.defineProperty(object,prop,descriptor);这个函数接受三个参数,而且都是必填的。

Obj:第一个参数:目标对象(要操作的对象,为这个对象定义属性)

Prop:第二个参数:需要定义的属性或方法的名字。

descriptor:第三个参数:目标属性所拥有的特性。

varobj={}

Object.defineProperty(obj,kai,{

value:

})

console.log(a.kai);//

我们来看看第三个参数descriptor。

value:属性对应的值,可以使任意类型的值,默认为undefined

writable:属性的值是否可以被重写。设置为true可以被重写;设置为false,不能被重写。默认为false。

configurable:是否可以删除目标属性或是否可以再次修改属性的特性(writable,configurable,enumerable)。设置为true可以被删除或可以重新设置特性;设置为false,不能被可以被删除或不可以重新设置特性。默认为false

enumerable:此属性是否可以被枚举(使用for...in或Object.keys())。设置为true可以被枚举;设置为false,不能被枚举。默认为false。

get和set:这两个属性不能和(value、wriable)一起使用。

descriptor的用法。

varobj={}

Object.defineProperty(obj,kai,{

value:

})

console.log(obj.kai);//

我们只设置了value,别的并没有设置,其它属性都默认给了false,我们可以理解它会默认帮我们把writable,configurable,enumerable都设上值,而且值还都是false。上面代码和下面是等价的。

varobj={}

Object.defineProperty(obj,kai,{

value:,

writable:false,

enumerable:false,

configurable:false

})

console.log(obj.kai);//

并且以上理解对set和get不起作用哦。configurable总开关,第一次设置false之后,第二次其它任何属性都不能设置了或改变了,比如说

varobj={}

Object.defineProperty(obj,kai,{

configurable:false

})

Object.defineProperty(obj,kai,{

configurable:true

})

一旦设置configurable就不能改变了。变了就会报错了。如果第一次不设置,它会帮你设置为false,一旦默认后面也不能改变了,变了也会报错。所以configurable只能在第一次初始化的时候设置。

writable如果设置为fasle,就变成只读了,不能改变其值。

varobj={}

Object.defineProperty(obj,kai,{

value:,

writable:false

});

console.log(obj.kai);//打印

obj.kai=;

console.log(obj.kai);//打印

enumerable定义了对象的属性是否可以在for…in循环和Object.keys()中被枚举。

varobj={}

Object.defineProperty(obj,kai,{

value:,

enumerable:true

})

console.log(Object.keys(obj));//打印[kai]

改为false

varobj={}

Object.defineProperty(obj,kai,{

value:,

enumerable:false

})

console.log(Object.keys(obj));//打印[]

descriptor中set和get。

varobj={}

Object.defineProperty(obj,kai,{

set:function(newVal){

this._value=newVal;

console.log(你要赋的值是:+newVal);

},

get:function(){

console.log(你取的值)

returnthis._value;//返回值

}

}

obj.kai=;//你要赋的值是:

console.log(obj.kai);//打印你取的值,打印




转载请注明:http://www.aierlanlan.com/rzfs/1233.html