Symbol的基本使用

134 阅读3分钟

Symbol 是es6中新增的一个基本的数据类型,翻译为符号

变成一种新增的数据类型

image.png

在es6之前,对象的名字是key

key 和 value 存在

image.png

在底层中key 和 value 都是当成一个字符串来进行解读的

在这里拿key 的时候,都是字符串的

在对象中key 的名称是不允许重复的

当我们不清楚往里面添加什么值的时候,我们可以使用symbol,避免覆盖掉某个属性

我们在使用某个功能的时候,不确定使用的什么对象有没有name 这样的一种属性

这里可能会有一种边缘的情况存在

image.png

我们就可以使用symbol 来生成独立的值

这个是一个函数,这里是一个大写,但是这里是一个函数

const s1 = Symbol()

const s2 = Symbol()

调用这样的一种Symbol函数的时候,生成的key是唯一的

image.png

在es10中,symbol还有一个属性是用来进行描述的

在定义的时候使用 Symbol 来使用key

在定义对象字面量的时候使用

image.png

在特殊的场景来写

image.png

如果想要在里面想要获取Symbol里面的值的话

image.png

不能使用obj.s1的方式来进行获取

因为这个是找对象的属性,这样是找不到Symbol值的,因为Symbol的值是通过另外的一种方式来进行获取的

在获取的时候是通过这样的进行获取的

使用Symbol作为key的时候,遍历的时候是获取不到Symbol值的

Object.keys() 这个是获取不到的

image.png

可以通过getOwnPropertySymbols来获取里面的Symbol值

我们可以对于这里的keys进行遍历

image.png

-   `[[Configurable]]`:表示能否通过 `delete` 删除属性从而重新定义属性,能否修改属性的特性,或者能否把属性修改为访问器属性。默认为 `false`

-   `[[Enumerable]]`: 表示能否通过 `for-in` 循环返回属性。默认为 `false`

-   `[[Writable]]`: 表示能否修改属性的值。默认为 `false`

-   `[[Value]]`:包含这个属性的数据值。 读取属性值的时候,从这个位置读;写入属性值的时候,把新值保存在这个位置。这个特性的默认值为 `undefined`。

如果下面的属性不包含数据值

访问器属性不包含数据值;它们包含一对儿 `getter` 和 `setter` 函数(不过,这两个函数都不是必需的)。在读取访问器属性时,会调用 `getter` 函数,这个函数负责返回有效的值;在写入访问器属性时,会调用`setter`函数并传入新值,这个函数负责决定如何处理数据。访问器属性有如下 4 个特性。

-   `[[Configurable]]`:表示能否通过 `delete` 删除属性从而重新定义属性,能否修改属性的特性,或者能否把属性修改为访问器属性。默认为 `false`
-   `[[Enumerable]]`: 表示能否通过 `for-in` 循环返回属性。默认为 `false`
-   `[[Get]]`:在读取属性时调用的函数。默认值为 undefined。
-   `[[Set]]`:在写入属性时调用的函数。默认值为 undefined。

需要通过这样的方式进行获取

Symbol 值的时候是不一样的

在某些情况下Symbol的key值是一样的

Symbol.for('描述')

Symbol.for('描述')

在两个key相同的情况下会先进行寻找,然后覆盖

可以通过Symbol.keyFor的方式将里面的值进行取出

Symbol.for() 传入描述,指定key值
Symbol.keyfor() 传入keyFor 返回key值

箭头函数是有隐式原型的

[[prototype]] 这个是一个显示的原型

在一些浏览器中会显示 箭头函数中的 prototype,但其实并不存在的