Object属性
Object.defineProperty();
Object.defineProperties();
这两种写法分别是设置一个属性与同时设置多种属性。
每种写法里的描述对象都有冲突的情况:
writable、value与set、get冲突
属性的描述对象的两种属性情况:
第一种 只存在writable与value的情况。
var obj={};
设置一个属性:
Object.defineProperty(obj,"a",{
configurable:true,//该属性是否可以删除,并且该属性的描述对象是否可以更改
enumerable:true,//该属性是否可枚举
writable:true,//该属性是否可写(不是只读)
value:10,//该属性的值
})
设置多个属性:
Object.defineProperties(obj,{
a:{
enumerable:false,
writable:true,
configurable:true,
value:20
},
b:{
writable:true,
configurable:true,
value:function(){
}
},
c:{
configurable:true,
value:100
}
})
console.log(obj);
描述属性省略时默认是false,当使用点语法添加新属性的时候,例如div.a,则默认除了value外的描述对象值都为true.
configurable
false时不能删除,且不能修改该属性的描述对象
enumerable
false不可枚举,不能用for in遍历出来,
console.log(“a” in obj); 可以用in找出来,显示true
var o=Object.assign({},obj);
var o={…obj};//不能复制不可枚举属性,assign和…解构都不行
var {a}=obj;//但是可以通过解构赋值给a赋值console.log(a)===obj.a(那个不可枚举属性)
writable
obj.a=100 修改无效,
但是可以通过修改描述对象的value修改值
value
value可以设置为一个函数
Object.defineProperty(obj,"a",{
configurable:true,
enumerable:true,
writable:true,
value:function(){
console.log("aaa");
}
})
console.log(obj);
第二种 只存在set与get的情况(详细版在后面的文章)
Object.defineProperty(obj,"b",{
configurable:true,
enumerable:true,
set:function(_v) {},
get:function() {},
})
冻结 freeze
变成静态属性,ES6的类里面是没有常量(constructor里不能用const)
obj.a=10;
obj.b=20;
Object.freeze(obj);
delete obj.a;
obj.a=100;
console.log(obj);//一旦冻结了obj,则不能修改obj,更不能删除
var arr=[1,2,3,4];
Object.freeze(arr);
arr[2]=100;
console.log(arr);//数组也是,不能再有变化
对象属性相关方法
1、Object.getOwnPropertyNames(obj); 获取对象的所有对象属性名
2、Object.getOwnPropertyDescriptor(obj,属性名) 获取对象属性的描述对象
3、Object.is(a,b) 相当于=== 和===不同在于 NaN判断NaN是相同的
例如 var a=NaN; var b=NaN;
console.log(Object.is(a,b)); //true
4、Object.isExtensible(obj) 判断是否可以增加新属性
5、Object.isFrozen(obj) 判断对象是否冻结
6、obj.hasOwnProperty(“e”) 判断obj中是否有e属性,in也可以判断
var o={a:1,b:2};
var o1=Object.create(o);
o1.c=10;
var o2=Object.create(o1);
console.log(o.hasOwnProperty("a")); true
console.log(o1.hasOwnProperty("a")); false
因为对象原型链上的属性不是它的属性
console.log(o2);
var arr=[1,,2,3,undefined,4];
console.log(4 in arr);
console.log(arr.hasOwnProperty(1)); false
7、o.isPrototypeOf(o2) 判断o是否是o2的原型链
重新写的添加DOM元素
appendTo(parent){
if(parent.constructor===String) parent=document.querySelector(parent);
//判断是否是HTML标签
if(!HTMLElement.isPrototypeOf(parent.constructor)) parent=document.body;
parent.appendChild(this.elem);
}
同时还可以判断继承关系中的父类
console.log(Box.isPrototypeOf(Ball));//Ball的父类是否有Box类
var b=new Ball();
console.log(Box.isPrototypeOf(b.constructor));//b对象的父类中有没有Box类
HTMLElement.isPrototypeOf(div.constructor)//是不是HTML标签
8、obj.propertyIsEnumerable(“b”) 查询属性是否是不可枚举属性
9、instanceof 一个对象是否为一个类的实例
var b=new Box();
console.log(b instanceof Box); true
console.log(b.constructor===Box); true
如果Ball是Box的子类。即继承与Box
console.log(b instanceof Ball); false 即b不是Ball的实例