对象属性Object.defineProperty()、hasOwnProperty()、propertyIsEnumerable()
Object.defineProperty()
对象的属性Object.defineProperty()
,深入了解一下这个属性:
它的语法:
Object.defineProperty(obj, prop, descriptor)
参数说明:obj
需要定义属性的对象。prop
需被定义或修改的属性名。descriptor
需被定义或修改的属性的描述符,是一个对象形式。
其中描述符有以下属性可选择:
-
configurable
: 仅当该属性的 configurable 为 true 时,能够被删除。默认为 false -
enumerable
: 仅当该属性的 enumerable 为 true 时,该属性才能够出现在对象的枚举属性中。默认为 false -
value
: 该属性对应的值。可以是任何有效的 JavaScript 值(数值,对象,函数等)。默认为 undefined -
writable
: 仅当仅当该属性的writable为 true 时,该属性才能被赋值运算符改变。默认为 false -
get
: 一个给属性提供 getter 的方法,如果没有 getter 则为 undefined。该方法返回值被用作属性值。undefined -
set
: 一个给属性提供 setter 的方法,如果没有 setter 则为 undefined。该方法将接受唯一参数,并将该参数的新值分配给该属性。默认为undefined。
下面写程序来了解一下所列举的属性:
var obj = {
name: "刘德华",
age: 18
};
Object.defineProperty(obj, "sex", {
value: "男"
});
obj.sex = "女";
obj.__proto__.job = "写程序";
console.log(obj);
结果如图:
这里我们看到把sex
属性成功加到对象中去了,但是这个属性与其它属性相比,相对暗淡一些,这是因为enumerable
默认为false,不会被枚举。这里我们试图将sex属性改为’女’也失败了,这是由于writable
默认为false。
var obj = {
name: "刘德华",
age: 18
};
Object.defineProperty(obj, "sex", {
value: "男",
enumerable: true,
writable: true
});
obj.sex = "女";
obj.__proto__.job = "写程序";
console.log(obj);
结果如图:
这里我们看到不仅sex属性变得与其他属性一样的颜色,而且成功把sex属性改为'女'
。这就是这两个属性的作用啦!
那个不可删除configurable
也是同样的道理,不设true
值会让这个属性不可删除了。
下面说说get()
和set()
吧:
属性值可以由一个或两个方法替代,这两个方法就是getter和setter
(a)由getter和setter定义的属性,称为“存取器属性”;
(b) 一般的只有一个值的属性称为“数据属性”;
与存取器属性同名的函数定义没有使用function关键字,而是使用get或set,也没有使用冒号将属性名和函数体分开,但函数体的结束和下一个方法之间有逗号隔开。
(c)查询存取器属性的值,用getter;拥有getter则该属性可读;
(d)设置存取器属性的值,用setter;拥有setter则该属性可写;
var obj = {
name: "刘德华",
age: 18
};
Object.defineProperty(obj, "sex", {
get:()=> {
if (this.sex) {
return this.sex;
} else {
return 1;
}
},
set:(value)=>{
this.sex = value;
},
});
obj.sex = "女";
obj.__proto__.job = "写程序";
console.log(obj.sex); //女
结果如图:
这个程序就是设值得值的过程。
hasOwnProperty()
hasOwnProperty()
:检查一个属性是否属于某个对象自有属性,不包括继承来的属性;
var person = {
name:'yourname',
age:10
};
person.__proto__.LastName = "deng"; //让person继承一个LastName属性
Object.defineProperty(person, "sex", {
value: "male",
enumerable: false //不可枚举
});
console.log(person.hasOwnProperty('name')); //true
console.log(person.hasOwnProperty('sex')); //true
console.log(person.hasOwnProperty('toString')); //false
console.log(person.hasOwnProperty('LastName')); //false
propertyIsEnumerable()
propertyIsEnumerable()
:是hasOwnProperty()的增强版,检查一个属性是否属于某个对象自有属性,不包括继承来的属性,且该属性可枚举。
此时继上面程序用上该语句会得到:
console.log(person.propertyIsEnumerable('sex')); //false
本文地址:https://blog.csdn.net/qq_48784569/article/details/107492928
上一篇: 美国签证新规:需要交出QQ、微博聊天记录
下一篇: 是时候辞旧迎新 元旦佳节优质手机推荐
推荐阅读
-
浅谈js使用in和hasOwnProperty获取对象属性的区别
-
详谈js使用in和hasOwnProperty获取对象属性的区别
-
浅谈js使用in和hasOwnProperty获取对象属性的区别
-
vue源码学习之Object.defineProperty对象属性监听
-
JS hasOwnProperty()方法检测一个属性是否是对象的自有属性的方法
-
对象属性Object.defineProperty()、hasOwnProperty()、propertyIsEnumerable()
-
详谈js使用in和hasOwnProperty获取对象属性的区别
-
vue源码学习之Object.defineProperty对象属性监听
-
JS hasOwnProperty()方法检测一个属性是否是对象的自有属性的方法
-
对象属性Object.defineProperty()、hasOwnProperty()、propertyIsEnumerable()