JavaScript高级学习:ES6新特性12——Symbol类型

提示:
本文为JavaScript栏目:JavaScript高级学习:ES6新特性12——Symbol类型


前言

本文粗浅学习Symbol类型。


提示:以下是本篇文章正文内容,下面案例可供参考

Symbol类型

Symbol是JavaScript在ES6的规范中新增的数据类型,也就是说ES6中JS有7中数据类型。

Symbol可以单独使用,但是基本无意义,他的主要作用是给对象或者map作为key来用的。

Symbol类型的特点

1.独一无二

Symbol类型的变量只要被创建出来,一定是独一无二的,使用该类型作为key可以避兔很多bug。

Symbol类型的值只能通过symbol函数来声明,特别注意,他只是一个普通函数,不是构造函数。

let x=Symbol();     //这个x变量就是独一无二不可能重复的变量
console.log(x);     //Symbol()
let y=Symbol();
console.log(y);     //Symbol()

console.log(x==y);      //false
console.log(x===y);     //false

Symbol函数可以接受一个字符串作为他的描述值作为参数传递,起作用只是为了在控制台输出的时候便于区分,不会对比较结果产生任何影响。

let s1=Symbol("s1");
let s2=Symbol("s2");
console.log(s1);        //Symbol(s1)
console.log(s2);        //Symbol(s2)
console.log(s1===s2);   //false

Symbol类型的使用

1.Symbol类型的描述值参数会自动调用toString方法

let obj={name:"张三"};
console.log(obj.toString());    //[object Object]
let s3=Symbol(obj);
console.log(s3);        //Symbol([object Object])
let obj2={
      name:"李四",
      toString(){
          return this.name;
      }
    };

let s4=Symbol(obj2);
console.log(s4);            //Symbol(李四)

2.description获取Symbol的描述值

console.log(s4.description);        //李四
console.log(s4.description);        //s2

3.Symbol类型不能和点运算符一起使用

let obj1 = {};
obj1[symbolkey] = "nihao";

let obj2 = {
    [symbolkey]: "你好"
};

let obj3 = {};
Object.defineProperty(obj3, symbolkey, {
    value: "你好世界"
});
console.log(obj1);  //{Symbol(): "nihao"}
console.log(obj2);  //{Symbol(): "你好"}
console.log(obj3);  //{Symbol(): "你好世界"}
console.log(obj1[symbolkey]);   //nihao
console.log(obj2[symbolkey]);   //你好
console.log(obj3[symbolkey]);   //你好世界

但是可以使用[]

console.log(obj1[symbolkey]);   //nihao
console.log(obj2[symbolkey]);   //你好
console.log(obj3[symbolkey]);   //你好世界

4.Symbol类型的变量不能和其他任意类型参与计算,如果Symbol参与计算,直接报错

let age=5;
console.log(age+s4);       // Cannot convert a Symbol value to a number
console.log("你好"+s4);       //Cannot convert a Symbol value to a string
console.log(`你好${s4}`);     //Cannot convert a Symbol value to a string

const  BlUE=Symbol();   //BLUE和任何数据或变量比较结果都一定是false,并且常量不可更改。

5.重复声明Symbol

如何来重复声明Symbol:重复声明Symbol是不可能的,只是通过代码让我们看起来实现了重复声明的效果。也就是让两个Symbol比较的值相等。

let kakarot=Symbol();

参数是某个Symbol的变量名.

Symbol.for接受一个参数来自动根据这个参数查找有没有相同名字的Symbol类型变量如果有则返回Symbol,如果没有则会创建该Symbol,并且参数就作为Symbol的描述值和在Symbol注册列表中key.

let k2=Symbol.for("kakarot");       //k2不是新声明出的Symbol类型数据,而是之前的赋值过来的
console.log(kakarot);               //Symbol()
console.log(k2);                    //Symbol(kakarot)
console.log(kakarot===k2);          //false
console.log(Symbol.for("kakarot")===Symbol.for("kakarot")); //true

6.Symbol类型的key不能被for-in或者for-pf遍历时取到,Object.keys同样也无法获取Symbol类型的key

let obj4 = {
    name: "张三",
    age: 22,
    [symbolkey]: "我就是我。",
    [Symbol()]: "不一样的烟火"
};
for (let key in obj4) {
    console.log(key);   //name age
}
for (let value of Object.keys(obj4)) {
    console.log(value); //name age
}
let symbols = Object.getOwnPropertySymbols(obj4);
console.log(symbols);   //[Symbol(), Symbol()]
for (let v of symbols) {
    console.log(obj4[v]);
}
/*
    我就是我。
    不一样的烟火
*/
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值