方法1: Symbol
- 作用: ES6 提供的一个函数; 用来创建一个数据;作为键放在对象中使用;
- 语法: Symbol(字符串)
- 返回值: 返回一个Symbol 数据
- 特点: 每一个Symbol 数据都是唯一的;
假设,我们使用一个别人提供的object,但是需要给这个object添加一个新的键值对,自己添加的键就有可能会跟object中原本的键冲突,symbol的主要作用就是创建对象中独一无二的键,可以从根本上防止对象中的键重复;
Object的键都是字符串,并且都是唯一的,不能重复.
也就是说,对象中的键除了是字符串外,还可以是symbol 数据;
从Symbol中还原原本的字符串 - Symbol数据.desciption
console.log(nameSymbol.description);
每个Symbol数据都是唯一的:
var a = Symbol('abc');
var b = Symbol('abc');
console.log(a, b);
console.log(a == b);
方法2: Reflect ES6提供的一个对象
- 作用: 用来操作对象的,访问对象的值,设置对象的键值对,删除对象的键值对;
- 语法:
- 返回值:
- 特点: Reflect操作对象的话,操作结束后我们可以知道操作是否成功;但是以前的操作语法,操作完成后我们无法确定操作是否成功,这对我们后续操作对象有影响;
访问对象中的值: Reflect.get(对象, 属性) 返回访问到的值/undefined;
var obj = {
name: '张三'
}
var value = Reflect.get(obj, 'name')
var value = Reflect.get(obj, 'age')
console.log(value);
设置对象中的键值对: Reflect.set(对象, 属性, 值) - 返回布尔值表示操作是否成功;
var bool = Reflect.set(obj, 'age', 12);
console.log(bool);
删除对象中的键值对 - Reflect.deleteProperty(对象, 属性) - 返回布尔值;
var bool = Reflect.deleteProperty(obj, 'name');
console.log(bool);
方法3: Proxy 是ES6提供的一个构造函数
- 作用: 用来创建一个所有键值对都被监视起来的对象;
- 重要特点: 一次性把所有键值对都监视起来了;
- 语法: new Proxy(对象)
var obj = {
name: '张三',
age: 12
}
Object.defineProperty(obj, 'name', {
});
var pbj = new Proxy(obj,{
get(){
console.log(666);
return 666
},
set(){
console.log(888);
}
});
Proxy 实现双向数据绑定:
双向绑定
var obj = {
msg: 'hello'
}
var pbj = new Proxy(obj, {
get(o, k) {
return ipt.value
},
set(o, k, v) {
o[k] = v
ipt.value = v
}
})
var ipt = document.querySelector('input')
ipt.oninput = function() {
pbj.msg = this.value
}