对象是由多个键值对的无序集合。定义新属性或者修改原有的属性可以使用“=”重新赋值,也可以使用Object.defineProperty定义。
语法:
Object.defineProperty(obj,prop,descriptor);
obj:必需,目标对象;
prop:必需,定义或者修改的属性名称;
descriptor:必需,目标属性所拥有的特性;
用例:
var obj={test:'val'};
bject.defineProperty(obj,'test',{
configurable:true|false,
enumerable:true|false,
value:任意类型的值,
writable:true|false,
get:function(){}|undefined,
set:function(){}|undefined
});
value(属性对应的值,默认undefined)
var obj={};
Object.defineProperty(obj,'txt',{});
console.log(obj.txt);//undefined
Object.defineProperty(obj,'txt',{
value:'name'
});
console.log(obj.txt);//name
writable(是否可以被重写);
enumerable(是否可以被枚举);
configurable(是否可以删除目标属性或者是否可以再次修改属性的特性---->configurable,enumerable,writable);
这个属性起到两个作用:
1.目标属性是否可以使用delete删除
//var obj={txt:'0'};delete obj.txt;------>删除属性
2.目标属性是否可以再次设置特性
getter(获得属性值)
setter(设置属性值)
var obj={};
var initValue="hello";
Object.defineProperty(obj,'newKey',{
get:function(){
//当获取值时触发get
return initValue;
},
set:function(value){
//当设置值时触发set
initValue=value;
}
})
//获取值,触发get
console.log(obj.newKey);
//设置值,触发set
obj.newKey='asc';
实例:
<!DOCTYPE html>
<html lang="en"><head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<input type="text">
<p></p>
<script>
var inp = document.getElementsByTagName('input')[0];
var p = document.getElementsByTagName('p')[0];
var obj = {};
Object.defineProperty(obj,'val',{
//当obj.val的值发生改变时,将会执行该get和set方法
get:function(){return inp.value;
},
set:function(val){
p.innerHTML = val;
}
});
//第一个参数:目标对象
//第二个参数:需要定义属性和方法的名字
//第三个参数:目标属性所拥有的特性,必须是对象
obj.val = inp.value;
};
</script>
</body>
</html>