您当前的位置:首页 > 网站建设 > javascript
| php | asp | css | H5 | javascript | Mysql | Dreamweaver | Delphi | 网站维护 | 帝国cms | React | 考试系统 | ajax |

详细谈谈ES6中的symbol数据类型

51自学网 2022-05-02 21:34:07
  javascript

symbol数据类型

js语言中,ES6前有6种数据类型。

ES6新提出symbol数据类型,所以symbol是js的第七种数据类型,表示独一无二的值。是一种类似于字符串的数据类型。

目的是为了防止属性名的冲突,保证对象中每一个属性名都是独一无二的。

let s1 = Symbol('foo');let s2 = Symbol('foo');s1 === s2 // false

Symbol类型可以有一个字符串参数,表示对Symbol实例的描述。所以相同描述的两个Symbol类型实例也是不相等的。

symbol出现的原因

ES5 的对象属性名都是字符串,这容易造成属性名的冲突。比如,你使用了一个他人提供的对象,但又想为这个对象添加新的方法(mixin 模式),新方法的名字就有可能与现有方法产生冲突。如果有一种机制,保证每个属性的名字都是独一无二的就好了,这样就从根本上防止属性名的冲突。这就是 ES6 引入Symbol的原因

Symbol特点

  • Symbol的值是唯一的,用来解决命名冲突的问题
  • Slymbol 值不能与其他数据进行运算
  • Symbol 定义的对象属性不能使用fr..in 循环遍历,但是可以使用Reflect.ownKeys来获取对象的所有键名
  • Symbol函数前不能使用new命令,否则会报错。这是因为生成的 Symbol 是一个原始类型的值,不是对象。也就是说,由于 Symbol 值不是对象,所以不能添加属性。基本上,它是一种类似于字符串的数据类型。
//创建Symbollet s= Symbol();console.log(s, typeof s);// 试试创建2个symbol相同let s2 = Symbol(' 辣鸡rb');let s3 = Symbol(' 辣鸡rb');console.log(s2 === s3); //false//用Symbol.for创建一样的symbollet s4 = Symbol.for('辣鸡rb');let s5 = Symbol.for('辣鸡rb');console.log(s4 === s5); //true//不能与其他数据进行运算let result = s + 100;//报错,

文章结尾回顾一下js的数据类型

引用尚硅谷的一个记忆口诀

// USONB =>you are so .niubility 你是如此牛逼// u=>undefined// s=>string symbol// 0=>object// n=>null number// b=>boolean

思考一下,决定再写点,

symbol的应用

在rb对象中添加up和down方法

方法1

let rb = {    name: '日本战犯',    age: 500,};// 用symbol处理// 声明对象,里面包含两个方法,方法用symbol()写let methods = {    up: Symbol(),    down: Symbol()};// 把方法加进去rb[methods.up] = function () {    console.log('原谅说的是人');};rb[methods.down] = function () {    console.log('畜生没脸让中华儿女原谅它');};console.log(rb);

方法2

在rb对象中添加sb和dsb方法

let rb = {    name: '日本战犯',    age: 500,    [Symbol('sb')]: function () {        console.log('我喜欢日本动画');    },     [Symbol('dsb')]: function () {         console.log('但不妨碍我恨他们在华夏大地犯的罪');     },};console.log(rb);

Symbol内置的属性值

  • Symbol.hasInstance:其它对象使用instanceof运算符的时候会使用该属性名指向的内部方法。
  • Symbol.isConcatSpreadable
  • Symbol.species
  • Symbol.match
  • Symbol.replace
  • Symbol.search
  • Symbol.split
  • Symbol.iterator
  • Symbol.toPrimitive
  • Symbol.toStringTag
  • Symbol.unscopables

总结

到此这篇关于ES6中symbol数据类型的文章就介绍到这了,更多相关ES6的symbol数据类型内容请搜索wanshiok.com以前的文章或继续浏览下面的相关文章希望大家以后多多支持wanshiok.com!


js实现购物车加减以及价格计算功能
js实现购物车加减和价格运算
51自学网,即我要自学网,自学EXCEL、自学PS、自学CAD、自学C语言、自学css3实例,是一个通过网络自主学习工作技能的自学平台,网友喜欢的软件自学网站。
京ICP备13026421号-1