Object.defineProperty() 是 ES5 中的新对象方法。
它允许您定义对象属性和/或更改属性的值和/或元数据。
Object.defineProperty()
语法：
Object.defineProperty(obj, prop, descriptor)参数说明：
obj：必需。目标对象
prop：必需。需定义或修改的属性的名字
descriptor：必需。目标属性所拥有的特性
返回值：
传入函数的对象。即第一个参数obj
针对属性，我们可以给这个属性设置一些特性，比如是否只读不可以写；是否可以被for..in或Object.keys()遍历。
给对象的属性添加特性描述，目前提供两种形式：数据描述和存取器描述。
实例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>js学习</title>
<script src="jquery-2.0.3.js"></script>
</head>
<body>
<div id="demo"></div>
<script>
var person = {
firstName: "Bill",
lastName: "Gates",
language : "NO",
}
//更改属性
Object.defineProperty(person,"language",{
value:"EN",
writable :true,
enumerable : true,
configurable : true
});
//枚举属性
var txt = "";
for(var x in person){
txt += person[x] + "<br/>"
}
document.getElementById("demo").innerHTML = txt;
</script>
</body>
</html>结果：
writable
属性的值是否可以被重写。设置为true可以被重写；设置为false，不能被重写。默认为false。
enumerable
此属性是否可以被枚举（使用for...in或Object.keys()）。设置为true可以被枚举；设置为false，不能被枚举。默认为false。
configurable
是否可以删除目标属性或是否可以再次修改属性的特性（writable, configurable, enumerable）。设置为true可以被删除或可以重新设置特性；设置为false，不能被可以被删除或不可以重新设置特性。默认为false。
这个属性起到两个作用：
- 目标属性是否可以使用delete删除
- 目标属性是否可以再次设置特性
实例：隐藏了枚举中的语言属性
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>js学习</title>
<script src="jquery-2.0.3.js"></script>
</head>
<body>
<div id="demo"></div>
<script>
var person = {
firstName: "Bill",
lastName: "Gates",
language : "NO",
}
//更改属性
Object.defineProperty(person,"language",{
value:"EN",
writable :true,
enumerable : false,//此属性是否可以被枚举（使用for...in或Object.keys()）。设置为true可以被枚举；设置为false，不能被枚举。默认为false。
configurable : true
});
//枚举属性
var txt = "";
for(var x in person){
txt += person[x] + "<br/>"
}
document.getElementById("demo").innerHTML = txt;
</script>
</body>
</html>结果：
实例：此例创建一个 setter 和 getter 来确保语言的大写更新：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>js学习</title>
<script src="jquery-2.0.3.js"></script>
</head>
<body>
<div id="demo"></div>
<script>
//创建对象
var person = {
firstName: "Bill",
lastName: "Gates",
language : "NO",
}
//更改属性
Object.defineProperty(person,"language",{
get:function(){
return language
},
set:function(value){
language = value.toUpperCase();
}
});
//更改语言
person.language = "en";
//显示语言
document.getElementById("demo").innerHTML = person.language;
</script>
</body>
</html>结果：
存取器描述
当使用存取器描述属性的特性的时候，允许设置以下特性属性：
var obj = {};
Object.defineProperty(obj,"newKey",{
get:function (){} | undefined,
set:function (value){} | undefined
configurable: true | false
enumerable: true | false
});注意：当使用了getter或setter方法，不允许使用writable和value这两个属性
getter/setter
当设置或获取对象的某个属性的值的时候，可以提供getter/setter方法。
- getter 是一种获得属性值的方法
- setter是一种设置属性值的方法。
在特性中使用get/set属性来定义对应的方法
ar obj = {};
var initValue = 'hello';
Object.defineProperty(obj,"newKey",{
get:function (){
//当获取值的时候触发的函数
return initValue;
},
set:function (value){
//当设置值的时候触发的函数,设置的新值通过参数value拿到
initValue = value;
}
});
//获取值
console.log( obj.newKey ); //hello
//设置值
obj.newKey = 'change value';
console.log( obj.newKey ); //change value注意：get或set不是必须成对出现，任写其一就可以。如果不设置方法，则get和set的默认值为undefined
