Object.assign() :拷贝。连接两个对象。第一个参数为目标对象(注意目标对象自身也会改变),第二个参数为原对象。
image.png
Object.create():创建新对象
Object.defineProperty():给对象添加新属性,只能设置一个属性。
var o = {};
Object.defineProperty(o, 'a', {
configurable: true, //是否可删除 true是可以删除,false是不可删除
writable: true, // 与get不可同时使用,当它为true时,value值才会被改变。
enumerable: true, //是否可枚举
value: 'duoduo', // 与get不可同时使用
// get() {
// return '六六六'
// }
})
console.log(o.a) // duoduo
image.png
Object.defineProperties():给对象添加新属性,能设置多个属性。
var o = {}
Object.defineProperties(o, {
name: {
configurable: true, // 是否可删除 delete
enumerable: true, // 是否可枚举
get: function() {
return "duoduo"
},
set: function(val) {
console.log("set")
},
}
})
console.log(o.name) // duoduo
双向绑定源码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<div>
<input id="test" type="text" value="">
</div>
<script>
// 双向绑定源码
var ipt = document.querySelector("#test")
var name = "duoduo"
var o = {}
Object.defineProperty(o, "name", {
get() {
return name
},
set(val) {
ipt.value = val
name = val
}
});
o.name = "duoduo"
ipt.addEventListener("input", () => {
name = ipt.value
})
</script>
</body>
</html>
Object.entries():枚举属性的键值,返回数组并按顺序排序。
<script>
const obj = {name: 'duoduo', age: 18};
console.log(Object.entries(obj)[1]); // ["age", 18]
const obj = {10: 'c',2: 'a',7: 'b'};
console.log(Object.entries(obj)); // ["2", "a"]["7", "b"]["10", "c"]
</script>
Object.freeze():冻结对象。不能向这个对象添加新的属性,不能修改其已有属性的值,不能删除已有属性,以及不能修改该对象已有属性的可枚举性、可配置性、可写性。也就是说,这个对象永远是不可变的。该方法返回被冻结的对象。
<script>
const obj = {age: 22};
const obj1 = Object.freeze(obj);
obj1.age = 55;
console.log(obj1.age); // 22
</script>
Object.getOwnPropertyDescriptor():返回指定对象的属性对应的属性描述符
<script>
var o, d;
o = { get foo() { return 22; } };
d = Object.getOwnPropertyDescriptor(o, "foo");
console.log(d)
</script>
打印结果:
image.png
Object.is():判断两个值是否相同
Object.keys():返回属性的key值,并组成数组
Object.values():返回属性的value值,并组成数组
网友评论