前言
ECMAScript 6 中新增了 Symbol 符号这一基本数据类型,那么Symbol 是用来干什么的,对开发又有什么帮助呢?本文来总结记录一下 Symbol 的相关知识点。
正文
Symbol (符号)是 ECMAScript 6 新增的一种基本数据类型。符号是原始值,且符号实例是唯一、不可变的。符号的用途是确保对象属性使用唯一的标识符,不会发生属性冲突的危险,符号就是用来创建唯一记号,进而用作非字符串形式的对象属性。
1、符号的创建
var firstSymbol = Symbol() console.log(firstSymbol); //Symbol()
上面的代码直接调用Symbol()方法创建了一个符号类型的变量,也可以在Symbol方法中传入一个参数对符号变量进行描述,将来可以通过这个字符串来调试代码。但是,这个字符串参数与符号定义或标识完全无关。如下:
var secondSymbol = Symbol("foo") console.log(secondSymbol); //Symbol("foo") var thirdSymbol = Symbol("foo") console.log(secondSymbol == thirdSymbol); //false
Symbol 符号类型不像其他数据类型一样可以通过 new 来创建原始值的包装对象。若强行使用 new 会报语法错误。如果你确实想使用符号包装对象,可以借用 Object() 函数。如下:
var myStr = new String("name") console.log(typeof myStr);//object // var mySymbol = new Symbol()//Symbol is not a constructor at new Symbol (<anonymous>) var mySym = Symbol() var myWrapSym = Object(mySym) console.log(typeof myWrapSym);//object
2、从全局的 Symbol 注册表设置和取得 Symbol
如果运行时的不同部分需要共享和重用符号实例,那么可以用一个字符串作为键,在全局符号注册表中创建并重用符号。 (1)Symbol.for() Symbol.for() 对每个字符串键都执行幂等操作。第一次使用某个字符串调用时,它会检查全局运行时注册表,发现不存在对应的符号,于是就会生成一个新符号实例并添加到注册表中。后续使用相同字符串的调用同样会检查注册表,发现存在与该字符串对应的符号,然后就会返回该符号实例。var fooGlobalSymbol = Symbol.for('foo'); // 创建新符号 var otherFooGlobalSymbol = Symbol.for('foo'); // 重用已有符号 console.log(fooGlobalSymbol === otherFooGlobalSymbol); // true // 即使采用相同的符号描述,在全局注册表中定义的符号跟使用 Symbol() 定义的符号也并不等同: var localSymbol = Symbol('foo'); var globalSymbol = Symbol.for('foo'); console.log(localSymbol === globalSymbol); // false //此外,注册表中使用的键同时也会被用作符号描述。 console.log(localSymbol);//Symbol(foo) var emptyGlobalSymbol = Symbol.for(); console.log(emptyGlobalSymbol); // Symbol(undefined)
(2)Symbol.keyFor()
Symbol.keyFor() 来查询全局注册表,这个方法接收符号,返回该全局符号对应的字符串键。如果查询的不是全局符号,则返回 undefined 。var s = Symbol.for('foo'); console.log(Symbol.keyFor(s)); // foo // 创建普通符号 var ss = Symbol('bar'); console.log(Symbol.keyFor(ss)); // undefined //如果传给 Symbol.keyFor() 的不是符号,则该方法抛出 TypeError : // Symbol.keyFor(123); // TypeError: 123 is not a symbol
3、使用符号作为属性
凡是可以使用字符串或数值作为属性的地方,都可以使用符号。这就包括了对象字面量属性和Object.defineProperty() / Object.defineProperties() 定义的属性。对象字面量只能在计算属性语法中使用符号作为属性。后两者可以用于添加属性语法。var s1 = Symbol("s1"); var s2 = Symbol("s2"); var s3 = Symbol("s3"); var s4 = Symbol("s4"); var obj = { [s1]: "s1 val" } console.log(obj);//{Symbol(s1): "s1 val"} Object.defineProperty(obj, s2, { value: "s2 val" }); console.log(obj);//{Symbol(s1): 's1 val', Symbol(s2): 's2 val'} Object.defineProperties(obj, { [s3]: { value: "s3 val" }, [s4]: { value: "s4 val" } }) console.log(obj);//{Symbol(s1): "s1 val",Symbol(s2): "s2 val",Symbol(s3): "s3 val",Symbol(s4):"s4 val"}类似于 Object.getOwnPropertyNames() 返回对象实例的常规属性数组, Object.getOwnProperty-Symbols() 返回对象实例的符号属性数组。这两个方法的返回值彼此互斥。 Object.getOwnProperty-Descriptors() 会返回同时包含常规和符号属性描述符的对象。
var ss1 = Symbol('foo') var info = { name: 123, age: 1232 } console.log(Object.getOwnPropertyNames(info));//['name', 'age'] Object.defineProperty(info, ss1, { value: "ss1 val" }) console.log(Object.getOwnPropertySymbols(info));//[Symbol(foo)] console.log(typeof Object.getOwnPropertySymbols(info)[0]);//'symbol' console.log(Object.getOwnPropertyDescriptors(info));//{name: {…}, age: {…}, Symbol(foo): {…}} console.log(Reflect.ownKeys(info));// ['name', 'age', Symbol(foo)] console.log(info[ss1]);//'ss1 val'
Symbol 作为属性名,该属性不会出现在 for...in、for...of 循环中,也不会被 Object.keys()、Object.getOwnPropertyNames()、JSON.stringify() 返回。
var person = { name: "personName", age: 18 } var sym = Symbol("sex") Object.defineProperty(person, sym, { value: "sexValue" }) for (const key in person) { console.log(key); }// name age console.log(Object.keys(person));//["name","age"]
写在最后
以上就是本文的全部内容,希望给读者带来些许的帮助和进步,方便的话点个关注,小白的成长踩坑之路会持续更新一些工作中常见的问题和技术点。最后,祝各位coder,节日快乐。