美文网首页
Symbol、set、proxy

Symbol、set、proxy

作者: 追逐_e6cf | 来源:发表于2018-10-14 12:13 被阅读0次

一、Symbol
symbol是es6一种新的数据类型:用于设置对象的值,使得这个值独一无二
作用:确保每个属性名都是独一无二的,这样就可以防止属性名的冲突
即使参数相同,他们的===对比,还是不同

let s = Symbol();
console.log(s)
console.log(typeof s)

let s1 = Symbol("s1");
let s2 = Symbol("s2");
console.log(s1 === s2)
//报错:Symbol is not a constructor
let s1 = new Symbol();

let s2 = Symbol(123);
let s3 = Symbol("123");
console.log(s2, s3)
s2+s3  //报错:不能进行数值的运算
//不能强制类型转换为数字类型
Number(s3)
Boolean(s3)
//用点操作不一定能够拿到对象的值
//第一种拿Symbol做法:
let a = {};
let s4 = Symbol();
a[s4] = '123';
console.log(a)
console.log(a.Symbol())  //a.Symbol is not a function
console.log(a.s4)  //undefined  使用对象的Symbol值作为属性名时,获取相应的属性值不能用点运算符
console.log(a[s4])  //String:123

//第二种Symbol方法
let obj = {
  s4:3,  //普通写法
  [s4]:5,  //Symbol
  ['a'+'b']:4
}
console.log(obj.s4)  //3
console.log(obj[s4])  //5
console.log(obj["s4"])  //3
console.log(obj['a'+'b'])  //4
console.log(obj.ab)  //特殊情况

第三种Symbol方法
let a = {};
let s4 = Symbol()
Object.defineProperty(a, s4, {value:'mySymbol'});
a.s4;  //undefined
a.s4 = "mySymbol";
a[s4]  //undefined
a['s4']  //mySymbol

二、Symbol遍历问题

let s1 = Symbol('s1');
let s2 = Symbol('s2');
let obj = {
  [s1]:'s1',
  [s2]:'s2'
}
for(let k in obj){
  console.log(k)
}
//遍历Symbol值使用getOwnPropertySymbols
Object.getOwnPropertySymbols(obj);
let s1 = Symbol.for("s33");
let s2 = Symbol.for("s33");
let s3 = Symbol("s33")
console.log(s1 === s2)
console.log(s1 === s3)

三、set
通过add方法向Set结构加入成员,结果表明Set结构不会添加重复的值

const s = new Set();
[2, 3, 4, 5, 2, 2].forEach(x => s.add(x));
[2, 3, 4, 5, 2, 2].forEach(function(x){
  return s.add(x)
});
console.log(s)  //Set(4)  {2, 3, 4, 5}
for(let i of s){
  console.log(i)
}
const set = new Set([1, 2, 3, 4, 4]);  //对数组去重
//add(value):添加某个值,返回Set结构本身
//delete(value):删除某个值,返回一个布尔值,表示删除是否成功
//has(value):返回一个布尔值,表示该值是否为Set的成员
//clear():清除所有成员,没有返回值
[...set]  //[1, 2, 3, 4]
set.delete(1)  //set底层的函数 true
set  //Set(3){2, 3, 4}
set.delete(1)  //false

//Array.from()  可以将Set结构转为数组
const items = new Set([1, 2, 3, 4, 5]);
const array = Array.from(items);

四、WeakSet
WeakSet的成员只能是对象,而不能是其他类型的值

const b = [3, 4];
const ws = new WeakSet(b);
const a = [[1, 2], [3, 4]];
const ws = new WeakSet(a);

五、Map

const m = new Map();
const o = {p: 'Hello World'};
//设置
m.set(o, 'content')
//获取
m.get(o)  //"content"
//进行判断是否有值
m.has(o)  //true
//删除
m.delete(o)  //true
m.has(o)  //false

六、proxy
Proxy 可以理解成,在目标对象之前架设一层“拦截”

let obj = {
  a:1,
  b:2
}
//target参数表示所要拦截的目标对象
//handler用来定制拦截行为
let obj1 = new Proxy(obj, {
  get(){
    return 123
  },
  set(){
    console.log("我是set")
  }
});
var obj = new Proxy({
  a:1,
  b:2
},{
  get:function(target, key, receiver){
    console.log(`getting ${key}!`);
    console.log(receiver)
    return Reflect.get(target, key, receiver);
  },
  set:function(target, key, value, receiver){
    console.log(`setting ${key}!`);
    return Reflect.set(target, key, value, receiver);
  }
})

相关文章

网友评论

      本文标题:Symbol、set、proxy

      本文链接:https://www.haomeiwen.com/subject/jaszaftx.html