ES6引入了两种新的数据结构
- Set
- Map
Set是什么
Set()是一个构造函数。必须使用new调用
用来实例化一个set对象。
set对象用来存储任何类型的唯一值。
语法
new Set() //创建一个空set对象
new Set(iterable) //创建一个有值的
- iterable：可迭代对象。
返回值
返回⼀个 set 对象。
示例1: 创建⼀个空set
new Set()
输出
Set []
示例2:使用可迭代对象创建一个set对象
const arr = [1,2,3,4]
const sl = new Set(arr)
console.log(arr);
console.log(sl);
输出
Array(4) [ 1, 2, 3, 4 ]
Set(4) [ 1, 2, 3, 4 ] //看上去跟数组⼀模⼀样
示例3：使⽤包含重复值的数组创建⼀个set对象
const arr = [1,2,3,4,4,2,3,1]
const sl = new Set(arr)
console.log(arr);
console.log(sl);
输出
Array(8) [ 1, 2, 3, 4, 3, 4, 2, 1 ]
Set(4) [ 1, 2, 3, 4 ] //set对象会排重，包含的值都是唯一的。
示例4：set可以存储任意唯一值。对象也不例外，对象存储的是地址。
const obj = {x:1}
const arr = [obj,{x:2},3,4,3,4,{x:2},obj]
const sl = new Set(arr)
console.log(arr);
console.log(sl);
输出
Array(8) [ {…}, {…}, 3, 4, 3, 4, {…}, {…} ]
Set(5) [ {…}, {…}, 3, 4, {…} ]
Set.prototype.add()
定义
用于向Set对象中添加新值。(如果值已存在就不添加)
语法
set.add(value) //value：任意类型的值，每次只能添加一个值
返回值
返回更新后的Set对象。
示例1：基本用法
const set1 = new Set()
set1.add(1)
set1.add('hello')
set1.add(true)
set1.add(undefined)
set1.add(null)
set1.add(NaN)
set1.add([1,2,3,4])
set1.add({x:1})
console.log(set1);
示例2：支持链式调用
const set1 = new Set()
set1.add(1).add(2)//可以添加
set1.add('hello')
set1.add(true)
set1.add(undefined).add(undefined)//不会重复添加
set1.add(null)
set1.add(NaN).add(NaN)//不会重复添加，即使是NaN
set1.add([1,2,3,4])
set1.add({x:1})
console.log(set1);
Set.prorotype.has()
定义
Has()方法用于检索set对象中是否存在指定值。
语法
set.has(value) //value是你要检索的值。
返回值
返回一个布尔值
- true：存在
- false：不存在
示例
const find = set1.has(NaN)
console.log(find); //true
const find = set1.has(100)
console.log(find); //false
Set.prototype.delete()
定义
- 定义：从 Set 对象中删除指定的值（如果该值在 Set 中）
语法
set.delete(value)
返回值
返回布尔值
- 成功删除返回 true，否则返回 false。
示例
const set = new Set()
set.add(1).add(2).add(3).add(4)
console.log(set);
// 删除set中的2
set.delete(2)
console.log(set);
如何修改set对象中的值
setAPI没有提供一种直接的修改值的方法，我们只能曲线救国。
const set = new Set()
Set.prototype.faretch
定义：
-
MDN： forEach() ⽅法对 Set 对象中的每个值按插⼊顺序执⾏⼀次提供的函数。
⽩话： forEach() ⽤于遍历Set对象
语法
// 箭头函数
forEach(() => { /* ... */ } )
forEach((value) => { /* ... */ } )
forEach((value, key) => { /* ... */ } )
forEach((value, key, set) => { /* ... */ } )
// 回调函数
forEach(callbackFn)
forEach(callbackFn, thisArg)
// 内联回调函数
forEach(function() { /* ... */ })
forEach(function(value) { /* ... */ })
forEach(function(value, key) { /* ... */ })
forEach(function(value, key, set) { /* ... */ })
forEach(function(value, key, set) { /* ... */ }, thisArg)
-
callbackFn: 对set对象中的每⼀个值调⽤⼀次回调函数。回调有三个参数
value: 传⼊set的每⼀个值
key： 传⼊value对应的key
Set: 传⼊set对象本身
返回值
Undefined: 没有返回值
示例
关于Map的知识点
定义
如何创建map
增删改查 5⽅法（含删除全部)
查询key|value|元素： 3个⽅法
遍历：1个⽅法
map.size属性
-
Map和Object的区别
-
⻓度
map有⻓度
object没有
-
可迭代
map可迭代
object不可以迭代
-
key：
- map的key可以是任意类型
- object的可以只能是字符串、计算属性、Symbol
-
顺序
map是键值对的有序集合
object是键值对⽆序集合
-
Map对象是什么
Mam对象引入的一种新型数据结构
和JS中Object一样，也使用键值对形成存储数据
和Object不一样的地方
有序存储，Map会记录存储位置
Map对象中的key可以是任意数据类型,obj的key只能是字符串，symbol，计算属性
map有长度，Object没有；
map可迭代，obj不可以迭代
对象是键值的无序集合，map是键值的有序集合map是键值对的有序集合
Map构造函数
定义
- Map()是ES6新增的内置构造函数。
- Map()构造函数用于创建Map对象。
语法
//必须使用new调用，直接调用会报错
new Map()
new Map(iterable) //传入的可迭代对象必须是：key/value形式
返回值
示例1：直接调用会报错
const map = Map()
示例2：传入一个数组，也会报错
const arr = [1,2,3]
const map = new Map(arr)
console.log(map);//语法错误
示例3：必须传入一个键值对形式的对象。
const arr = [[1,'张三'],[2,'李四'],[3,'王五']]
const map = new Map(arr)
console.log(map); //{ 1 → "张三", 2 → "李四", 3 → "王五" }
Map对象是什么
定义
- Map对象是ES6引入的一种新型数据结构。
- 和ES6中object一样，也抵用键值对形式存储数据
- 和object不一样的地方 在于：
- 有序存储：Map会记录存储位置
- Map对象中的key可以是任何数据类型。
Map是键值对的有序集合。
创建Map对象
语法
new Map()
new Map(iterable)
iterable：1.必须可迭代对象。2.可迭代对象必须是键值对形式。 3.key可以是任意类型
new Map([1,2,3]) //报错
new Map([1,'a'],[2,'b'],[3,'c']) //ok
new Map({x:1})//报错 对象是不可迭代的
new Map('hello') //报错
new Map([
[0,'a'],
['hello','b'],
[true,'c'],
[undefinde,'d'],
[null,'e'],
[obj,'f']
//[{x:1},'f'], // => const obj = {x:1}
[arr,'g']
// [[1,2,3],'g'], //=> const arr = [1,2,3]
[fn,'h']
// [function(){},'h'] //=> const fn = function(){}
])
Map.prototype.set()
定义
set ⽤于向map对象添加或修改键值对。
语法
map.set(key, value)
返回值
返回更新后的map对象.
示例
let a = 1+1
function fn(){}
let obj = [[0,"a"],[a,"b"],[1,"c"],[fn(),"d"],[undefined,"e"],[NaN,"e"],["c","g"]]
const map =new Map(obj)
map.set("黄油符","投影仪")
console.log(map);//Map(7) { 0 → "a", 2 → "b", 1 → "c", undefined → "e", NaN → "e", c → "g", "黄油符" → "投影仪" }
Map.prototype.delete()
定义
delete()方法用于删除map对象中指定的key
语法
map.delete(key)
返回值
返回一个布尔值
true：删除成功
false：元素不存在
Map.prototype.has()
定义
has()方法用于检索map对象中是否具有指定的key
语法
map.has(key)
返回值
返回一个布尔值
- true：存在
- false：不存在
示例
let obj = [[null,"y"],[["a"+"b"],"2"],[1,"y"],[function(){},true],[undefined,"c"],[NaN,1]]
const map =new Map(obj)
console.log(map.get(null));//y
Map.prototype.get()
定义
get() ⽅法⽤于查询指定key的value。
语法
map.get(key)
返回值
- 返回查询的true
- undefined： 没找到
示例
Map.prototype.forEach()
定义
forEach() ⽅法⽤于遍历map对象。
语法
// 箭头函数
forEach(() => { /* … */ } )
forEach((value) => { /* … */ } )
forEach((value, key) => { /* … */ } )
forEach((value, key, map) => { /* … */ } )
// 回调函数
forEach(callbackFn)
forEach(callbackFn, thisArg)
// 内联回调函数
forEach(function() { /* … */ })
forEach(function(value) { /* … */ })
forEach(function(value, key) { /* … */ })
forEach(function(value, key, map) { /* … */ })
forEach(function(value, key, map) { /* … */ }, thisArg)
返回值
- undefined ：没有返回值
示例
const boy1 = {name:'陈有红'}
const girl1 = {name:'小红'}
const boy2 = {name:'路星辞'}
const map = new Map([
[boy1,'记录委员'],
[girl1,'门窗管理员'],
[boy2,'班长'],
])
// map.forEach((value,key,map) => {
// console.log(value);
// console.log(key);
// console.log(map);
// })
const k = map.keys()
// console.log(k);
for(key of map.keys()){
console.log(key);
// console.log(entrn);
}
Map.prototype.keys()
定义
keys()方法用于获取map对象的keys
语法
map.keys()
返回值
返回一个map对象
示例
const boy1 = {name:'陈有红'}
const girl1 = {name:'小红'}
const boy2 = {name:'路星辞'}
const map = new Map([
[boy1,'记录委员'],
[girl1,'门窗管理员'],
[boy2,'班长'],
])
// map.forEach((value,key,map) => {
// console.log(value);
// console.log(key);
// console.log(map);
// })
const k = map.keys()
// console.log(k);
for(key of map.keys()){
console.log(key);
// console.log(entrn);
}
Map.prototype.values()
定义
返回一个可迭代map对象，包含按照顺序返回map的value值
语法
map.values()
返回值
一个新的map可迭代对象
示例
const bod1 = {name:"cyh"}
const girl2 = {name:"wl"}
const bod2 = {name:"tl"}
const map = new Map([
[bod1,"记录"],
[girl2,'蒙城'],
[bod2,"插座"]
])
const values = map.values()
console.log(values.next().value);//记录
Map.prototype.entries()
返回一个新的迭代器map对象，其中包含 Map 对象中按插入顺序排列的每个元素的 [key, value] 对。
语法
map.entries()
返回值
返回一个可迭代map对象
示例
const bod1 = {name:"cyh"}
const girl2 = {name:"wl"}
const bod2 = {name:"tl"}
const map = new Map([
[bod1,"记录"],
[girl2,'蒙城'],
[bod2,"插座"]
])
const maps = map.entries()
console.log(maps.next().value);//Array [ {name:cyh}}, "记录" ]
map.prototype.size
定义
只读属性
返回map对象中有多少属性
语法
map.size
返回值
数值，返回map对象中有多少属性
示例
const bod1 = {name:"cyh"}
const girl2 = {name:"wl"}
const bod2 = {name:"tl"}
const map = new Map([
[bod1,"记录"],
[girl2,'蒙城'],
[bod2,"插座"]
])
console.log(map.size);//3
计算属性
定义
ES6新增属性名语法：计算属性是使用[]设置对象的属性名。
方括号 []
定义：方括号是一个从操作符，操作符是用来操作表达式的。
我们可以在方括号内传入一个表达式
[a]//变量表达式
[a + b]
[sym]
Set是指的无序集合
1.set对象是什么?
- set对象是一种新型数据结构
- set对象是一种存储任何数据类型的唯一值的新型数据结构。
2.创建set对象的语法是什么？
new Set() //创建一个空set对象
new Set(iterable) //创建一个有值的
3.NaN是什么？有什么特点？
NaN是不是数值的数值类型
NaN不能NaN
4.数组转字符串的方法？
array.toString（）/ array.join（）
5.字符串转数组的方法？
array.split()
6.字符串去重？'tomato'
const set2 = new Set('tamato')
console.log(set2);
console.log([...set2].join(''));
7.对象中的key的语法是什么？
对象属性名必须是一个字符串或计算属性或symbol。
8.什么是计算属性？
计算属性是ES6引入的一种命名对象key的方法。
