概述
本教程操作环境:windows7系统、ECMAScript 6版、Dell G3电脑。
ES6新增数据结构
1、Symbol
Symbol
是ES6
中新增的一个基本数据类型之一,它是一个函数。每一个从Symbol
函数返回的Symbol
值都是独一无二的,symbol
值作为对象属性的标识符,也是唯一的用途的。
const s1 = Symbol()
const s2 = Symbol()
console.log(s1 === s2); // false
登录后复制
symbol作为key
第一种方式,直接在对象的字面量中添加。
// symbol作为key
const obj = {
[s1]:'abc',
[s2]:'cc',
}
登录后复制
第二种方式,通过添加数组方式添加。
// 需要用数组方式来获取,不能通过点语法,否则会获取到字符串key
console.log(obj[s1]);
登录后复制
第三种方式,通过对象中的defineProperty
方法添加。
const s4=Symbol()
Object.defineProperty(obj,s4,{
configurable:true,
enumerable:true,
writable:true,
value:'ff'
})
登录后复制
通过symbol获取对应的值
需要用数组方式来获取,不能通过点语法,否则会获取到字符串key。
console.log(obj[s1]);
登录后复制
symbol
不能被隐式转换成string
类型。
let Sym = Symbol("Sym")
alert(Sym) // TypeError: Cannot convert a Symbol value to a string
登录后复制
我们不能直接alert
一个symbol
对象,但是我们可以通过toString
的方式或者.description
来获取symbol
对象的描述符。
let sym = Symbol('a')
console.log(sym.description); // 'a'
登录后复制
遍历symbol
在使用for
遍历、object.keys
中是获取不到symbol
健的,对此object
还提供了getOwnPropertySymbols
方法,用于获取对象中所有symbol的key。
const sKeys=(Object.getOwnPropertySymbols(obj));
for(const skey of sKeys){
console.log(obj[skey]);
}
登录后复制
全局symbol对象注册
有时,我们可能需要多个symbol
的值是一致的,我们可以通过symbol
提供的静态方法for
方法传入一样的描述符来使它们的值一致。
Symbol.for
该方法会在使用给定键搜索运行时符号注册表中的现有符号,并在找到时返回它。否则,使用此键在全局符号注册表中创建一个新符号。
const sa=Symbol.for('cc')
const sb=Symbol.for('cc')
console.log(sa===sb); //true
登录后复制
Symbol.keyFor
该方法用于获取全局symbol
的描述符。
const key =Symbol.keyFor(sb)
console.log(key); // c
登录后复制
2、Set
Set
对象(类似数组)允许你存放任何数据类型,但里面的值不能重复。
const s1 = new Set()
s1.add(10)
s1.add(20)
s1.add(30)
s1.add(40)
console.log(s1) // Set(4) { 10, 20, 30, 40 }
s1.add(20)
console.log(s1) // Set(4) { 10, 20, 30, 40 }
登录后复制
Set常用方法
方法 | 返回值 | 说明 |
---|---|---|
size | set 对象中的数量 | 返回set对象中的数量 |
add | Set 对象 | 添加元素 |
delete | boolean | 删除元素 |
has | boolean | Set 对象中是否存在这个值 |
clear | 无 | 清空Set 对象中的值 |
3、WeakSet
WeakSet
是类似Set
的另外一种数据结构,内部数据也不能有重复值。
- 它与
Set
的区别WeakSet
只能存放对象类型,不能存放基本数据类型WeakSet
对元素是弱引用
基本使用
const weakSet = new WeakSet();
let obj = {
name: "_island"
};
weakSet.add(obj);
登录后复制
WeakSet常用方法
方法 | 返回值 | 说明 |
---|---|---|
add | weakset 对象 | 添加元素 |
delete | boolean | 删除元素 |
has | boolean | weakset 对象中是否存在这个值 |
关于遍历
WeakSet
不能被遍历,因为它只是对对象进行弱引用,如果遍历去获取元素,有可能导致对象不能被GC
回收。
所以WeakSet
中的对象是不能获取的
4、Map
ES6
新增的数据结构,用于存储映射关系。我们知道在JavaScript
中对象中是不能用对象来作为key
的。(假如我们把对象作为key
,其内部会将对象转换为字符串[object object]
)
const obj1 = { name: "_island" };
const obj2 = { name: "QC2125" };
const obj3={
[obj1]:'a',
[obj2]:'b',
}
console.log(obj3);
// { '[object Object]': 'b' }
登录后复制
而Map
则可以把对象作为key
进行存储,可以通过set
方法添加到Map
中,也直接通过字面量的方式添加。
const obj1 = { name: "_island" };
const obj2 = { name: "QC2125" };
const map = new Map();
map.set(obj1, "a");
map.set(obj2, "b");
console.log(map); // Map(2) { { name: '_island' } => 'a', { name: 'QC2125' } => 'b' }
// or
const map2 = new Map([[obj1,'a'],[obj2,'b']])
登录后复制
Map常用方法
方法 | 返回值 | 说明 |
---|---|---|
get | 获取对应的元素 | 通过key 获取对应元素 |
size | Map 对象中的数量 | 返回Map 对象中的数量 |
set | Map 对象 | 添加元素 |
delete | boolean | 删除元素 |
has | boolean | Set 对象中是否存在这个值 |
clear | 无 | 清空Set 对象中的值 |
遍历Map
通过foreach
语句遍历Map
map2.forEach((item) => console.log(item));
登录后复制
通过for..of
遍历Map
for ([val, key] of map2) {
console.log(`${key}---${val}`);
}
登录后复制
5、WeakMap
和Map
类似,也是以键值对的形式存在的
- 和Map的区别
WeakMap
的key
只能使用对象,不接受其他的类型作为key
WeakMap
的key
对对象是弱引用
基本使用
const weakMap = new WeakMap();
weakMap.set(obj, "a");
console.log(weakMap.get(obj)); // a
登录后复制
WeakMap常用方法
方法 | 返回值 | 说明 |
---|---|---|
get | weakmap 对象 | 获取元素 |
delete | boolean | 删除元素 |
has | boolean | weaksmap 对象中是否存在这个值 |
关于遍历
和WeakSet
一样,正因为它是弱引用,WeakMap
的key
是不可枚举的,如果key
可枚举那其列表将会受GC
影响。
【相关推荐:javascript视频教程、web前端】
以上就是新增的es6数据结构有哪些的详细内容,更多请关注靠谱客其它相关文章!
最后
以上就是健忘电灯胆为你收集整理的新增的es6数据结构有哪些的全部内容,希望文章能够帮你解决新增的es6数据结构有哪些所遇到的程序开发问题。
如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。
发表评论 取消回复