ES6知识点

y乐悠

于 2022-07-11 21:26:11 发布

阅读量478

点赞数

分类专栏： js 文章标签： javascript 开发语言 ecmascript

本文链接：https://blog.csdn.net/m0_45077860/article/details/125235515

版权

js 专栏收录该内容

11 篇文章 0 订阅

订阅专栏

1，let关键字和const关键字的区别

var：

1）声明作用域：在函数内部，使用var定义一个变量（局部变量），在函数被调用完之后，该变量会被立即销毁。在定义变量时如果省略var,就会创建一个全局变量（不建议在局部作用域中定义全局变量，难维护，而且在严格模式下，会导致抛出ReferenceError）。

2）声明提升：把所有变量声明都拉到函数作用域的顶部。

function foo(){console.log(age);var age = 18;}

等价于function foo(){var age;console.log(age);age = 18;}foo();//undefined

3）可以反复多次使用var声明同一个变量。

function foo(){var age = 16;var age = 1;var age = 2;console.log(age);}foo();//2

4）全局声明：使用var在全局作用域中声明的变量会成为window对象的属性。

var age = 18;console.log(window.age);//18

let:

1）声明作用域：let声明的是块作用域，而var声明的是函数作用域。块作用域是函数作用域的子集，所以var作用域的限制同时也适用于let。

//varif(true){var age = 18;console.log(age);//18}console.log(age);//18

//letif(true){let age = 18;console.log(age);//18}console.log(age);//ReferenceError:age没有定义

2）声明提升：let声明的变量不会在作用域中被提升

3）不可以在一个块中反复多次使用let声明同一个变量

let age;let age;//SyntaxError,标识符age已经声明过了

4）全局声明：使用let在全局作用域中声明的变量不会成为window对象的属性，但是var声明的变量会。

let age = 18;console.log(window.age);//undefined

5）条件声明：在使用var声明变量时，由于声明会被提升，js会自动将多余的声明在作用域顶部合并为一个声明。而因为let的作用域是块，所以不可能检查前面是否已经使用let声明过同名变量。因此对于let，不能依赖条件声明模式。

6）for循环中的let声明：在用let声明迭代变量时，js在后台会为每个迭代变量声明一个新的迭代变量，每个setTimeout引用的都是不同的迭代变量。for-in 和for-of都适用。

for(var i=0;1<5;i++){}console.log(i); //5

for(let i=0;1<5;i++){}console.log(i); //ReferenceError:i没有定义

for(var i=0;1<5;i++){setTimeout(()=>console.log(i),0);}//会输出5，5，5，5，5

for(let i=0;1<5;i++){setTimeout(()=>console.log(i),0);}//会输出0，1，2，3，4

const:

1）const的行为和let基本相同，唯一的区别是const它声明变量时必须同时初始化变量，且尝试修改const声明的变量会导致运行时错误（TypeError）。

2）不允许重复声明

3）作用域也是块

4）const声明的限制只适用于它指向的变量的引用。换句话说，如果const变量引用的是一个对象，那么修改这个对象内部的属性并不违反const的限制。

const person = {};person.name = "QiuYing";

5)不能用const声明迭代变量，因为迭代变量会自增。但是可以声明一个不会被修改的for循环变量。这对for-in 和for-of循环特别有意义。

声明风格及最佳实践：先使用const,let次之，不使用var。

let声明的变量可以改变，值和类型都可以改变；而const声明的常量不可以改变，这意味着，const一旦声明，就必须立即初始化，不能以后再赋值。

let和const的不同点：

①　let声明的变量可以改变，值和类型都可以改变；const声明的常量不可以改变，这意味着，const一旦声明，就必须立即初始化，不能以后再赋值。

const i ; // 报错，一旦声明，就必须立即初始化

const j = 5;

j = 10; // 报错，常量不可以改变

②　数组和对象等复合类型的变量，变量名不指向数据，而是指向数据所在的地址。const只保证变量名指向的地址不变，并不保证该地址的数据不变，所以将一个复合类型的变量声明为常量必须非常小心。

const arr = [];

arr = [1,2,3];// 报错，[1,2,3]与[]不是同一个地址

const arr = [];

arr[0] = 1;

arr[1] = 2;

arr[2] = 3;// 不报错，变量名arr指向的地址不变，只是数据改变

console.log(arr.length); // 输出：3

若想让定义的对象或数组的数据也不能改变，可以使用object.freeze(arr)进行冻结。冻结指的是不能向这个对象或数组添加新的属性，不能修改已有属性的值，不能删除已有属性。

const arr = [];

Object.freeze(arr);

// 不报错，但数据改变无效

arr[0] = 1;

arr[1] = 2;

arr[2] = 3;

console.log(arr.length); // 输出：0

let和const的相同点：

①　只在声明所在的块级作用域内有效。

②　不提升，同时存在暂时性死区，只能在声明的位置后面使用。

③　不可重复声明

2.ES6解构赋值

解构赋值是对赋值运算符的扩展。

他是一种针对数组或者对象进行模式匹配，然后对其中的变量进行赋值。

在代码书写上简洁且易读，语义更加清晰明了；也方便了复杂对象中数据字段获取。

在解构中，有下面两部分参与：解构的源，解构赋值表达式的右边部分。解构的目标，解构赋值表达式的左边部分。

3.ES6 Symbol

ES6 引入了一种新的原始数据类型 Symbol ，表示独一无二的值，最大的用法是用来定义对象的唯一属性名。

ES6 数据类型除了 Number 、 String 、 Boolean 、 Object、 null 和 undefined ，还新增了 Symbol 。

使用Symbol函数可以生成一个Symbol类型的值，但是你不能在调用Symbol时使用new关键字，因为Symbol是基本数据类型，而不是对象。比如下面的写法是错误的：

//报错，Symbol is not a constructor

Symbol的特点：

Symbol的值是唯一的，用来解决命名冲突的问题；

（2）Symbol的值不能与其他数据进行运算；

（3）Symbol定义的对象属性不能使用 for...in循环遍历，但是可以使用Reflect.ownKeys来获取所有对象的键名；

Symbol 函数栈不能用 new 命令，因为 Symbol 是原始数据类型，不是对象。可以接受一个字符串作为参数，为新创建的 Symbol 提供描述，用来显示在控制台或者作为字符串的时候使用，便于区分。

let sy = Symbol("KK");

console.log(sy); // Symbol(KK)

typeof(sy); // "symbol"

// 相同参数 Symbol() 返回的值不相等

let sy1 = Symbol("kk");

sy === sy1; // false

Symbol 作为对象属性名时不能用.运算符，要用方括号。因为.运算符后面是字符串，所以取到的是字符串 sy 属性，而不是 Symbol 值 sy 属性。let syObject = {};

syObject[sy] = "kk";

syObject[sy]; // "kk"

syObject.sy; // undefined

4.ES6 Map和Set

js 中 map 和对象都是键值对的集合，

区别在于对象的 key值全部自动转成了字符串或者symbol值

而map 是完整的值-值

1、set指的是“集合”结构，而Map指的是“字典”结构；

2、set是以“[value, value]”的形式储存元素，而Map是以“[key, value]”的形式储存；

3、Map可用get()通过键查找特定值并返回，而set不行。

Set 和 Map 主要的应用场景在于数据重组和数据储存。

Set 是一种叫做集合的数据结构，Map 是一种叫做字典的数据结构。

集合与字典的区别：

共同点：集合、字典可以储存不重复的值

不同点：集合是以 [value, value]的形式储存元素，字典是以 [key, value] 的形式储存

集合（Set）：

ES6 新增的一种新的数据结构，类似于数组，但成员是唯一且无序的，没有重复的值。

Set 本身是一种构造函数，用来生成 Set 数据结构。

Set 对象允许你储存任何类型的唯一值，无论是原始值或者是对象引用。

const s = new Set()

[1, 2, 3, 4, 3, 2, 1].forEach(x => s.add(x))

for (let i of s) {

console.log(i) // 1 2 3 4

}

// 去重数组的重复对象

let arr = [1, 2, 3, 2, 1, 1]

[... new Set(arr)] // [1, 2, 3]

注意：向 Set 加入值的时候，不会发生类型转换，所以`5`和`"5"`是两个不同的值。Set 内部判断两个值是否不同，使用的算法叫做“Same-value-zero equality”，它类似于**精确相等**运算符（`===`），主要的区别是**`NaN`等于自身，而精确相等运算符认为`NaN`不等于自身。**

let set = new Set();

let a = NaN;

let b = NaN;

set.add(a);

set.add(b);

set // Set {NaN}

let set1 = new Set()

set1.add(5)

set1.add('5')

console.log([...set1]) // [5, "5"]

操作方法：

add(value)：新增，相当于 array里的push。

delete(value)：存在即删除集合中value。

has(value)：判断集合中是否存在 value。

clear()：清空集合。

遍历方法：遍历方法（遍历顺序为插入顺序）

keys()：返回一个包含集合中所有键的迭代器。

values()：返回一个包含集合中所有值得迭代器。

entries()：返回一个包含Set对象中所有元素得键值对迭代器。

forEach(callbackFn, thisArg)：用于对集合成员执行callbackFn操作，如果提供了 thisArg 参数，回调中的this会是这个参数，没有返回值。

字典（Map）：

是一组键值对的结构，具有极快的查找速度。

const m = new Map()

const o = {p: 'haha'}

m.set(o, 'content')

m.get(o) // content

m.has(o) // true

m.delete(o) // true

m.has(o) // false

操作方法：

set(key, value)：向字典中添加新元素。

get(key)：通过键查找特定的数值并返回。

has(key)：判断字典中是否存在键key。

delete(key)：通过键 key 从字典中移除对应的数据。

clear()：将这个字典中的所有元素删除。

遍历方法：

Keys()：将字典中包含的所有键名以迭代器形式返回。

values()：将字典中包含的所有数值以迭代器形式返回。

entries()：返回所有成员的迭代器。

forEach()：遍历字典的所有成员。

总结

Set：

指的是“集合”结构

[value, value]，键值与键名是一致的（或者说只有键值，没有键名）

不能通过键查找特定值

Map：

指的是“字典”结构

[key, value]，键值与键名是不一致的

Map可用get()通过键查找特定值并返回

5.ES6模块的导入和导出

ES6模块化导入与导出有三种方式，1默认导入导出，2按需导入导出，3默认导出和整体导出一起使用。接下来我们分别使用下这三种方式

1.默认导入导出

默认导出的语法： export default 默认导出的成员

默认导入的语法： import 接收名称 from '模块路径

es6的模块导出使用的方法：1、导出默认模块，一个模块文件只能有一个默认模块，语法为“export default 需要导出的成员”；2、导出普通模块，一个模块文件可以有多个普通模块，语法为“export 按需导出的成员”。

2.按需导入导出

按需导出的语法： export const s1 = 10

按需导入的语法： import { 按需导入的名称 } from '模块路径'

3.默认导出和整体导出一起使用

Symbol 是 ES6 新加入的数据类型，是一种原始数据类型。该类型的性质在于这个类型的值可以用来创建匿名的对象属性。该数据类型通常被用作一个对象属性的键值——当你想让它是私有的时候。对象的属性名现在可以有两种类型，一种是字符串，另一种就是 Symbol 类型。

Symbol 值通过Symbol函数生成，它是独一无二的，可以保证不会与其他属性名产生冲突。

let s1 = Symbol();// Symbol 函数前不能使用 new 命令，否则会报错// 因为生成的 Symbol 是一个原始类型的值，不是对象

let s2 = Symbol();

typeof s// "symbol"

s1 === s2 // false// Symbol 是独一无二的复制代码

打印 Symbol 类型都显示为 Symbol，这不好区分，这时就可以给它传递一个参数，来区分 Symbol。

const obj = {

toString() {

return 'abc';

}

};const sym = Symbol(obj);

sym // Symbol(abc)

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

s1 === s2 // false复制代码

Symbol 值不能与其他类型的值进行运算

let sym = Symbol('My symbol');

"your symbol is " + sym// TypeError: can't convert symbol to string`your symbol is ${sym}`// TypeError: can't convert symbol to string复制代码

Symbol 值可以显式转为字符串和布尔值，但是不能转为数值。

let sym = Symbol('My symbol');

String(sym) // 'Symbol(My symbol)'

sym.toString() // 'Symbol(My symbol)'

let sym = Symbol();Boolean(sym) // true

!sym // false

Number(sym) // TypeError

sym + 2 // TypeError复制代码

作为属性名

Symbol 值可以作为属性名，一般用来实现私有属性。

let mySymbol = Symbol();let s = Symbol();

// 第一种写法let a = {};

a[mySymbol] = 'Hello!';

// 第二种写法let a = {

[mySymbol]: 'Hello!',

[s] (arg) { }

};

// 第三种写法let a = {};Object.defineProperty(a, mySymbol, { value: 'Hello!' });

// 以上写法都得到同样结果

a[mySymbol] // "Hello!"复制代码

遍历属性名

Symbol 作为属性名，该属性不会出现在for...in、for...of循环中，也不会被Object.keys()、Object.getOwnPropertyNames()、JSON.stringify()返回。

但是，Object.getOwnPropertySymbols方法，可以获取指定对象的所有 Symbol 属性名，Reflect.ownKeys方法可以返回所有类型的键名，包括常规键名和 Symbol 键名。

const obj = {};let a = Symbol('a');let b = Symbol('b');

obj[a] = 'Hello';

obj[b] = 'World';

const objectSymbols = Object.getOwnPropertySymbols(obj);

objectSymbols// [Symbol(a), Symbol(b)]

复制代码

Symbol 的静态方法

Symbol 一共有两个静态方法Symbol.for(key)和Symbol.keyFor(sym)。

for

Symbol.for(key)方法会根据给定的键key，来从运行时的symbol注册表中找到对应的 symbol，如果找到了，则返回它，否则，新建一个与该键关联的symbol，并放入全局symbol 注册表中。

Symbol.for("foo"); // 创建一个 symbol 并放入 symbol 注册表中，键为 "foo"Symbol.for("foo"); // 从 symbol 注册表中读取键为"foo"的 symbol

Symbol.for("bar") === Symbol.for("bar"); // true，证明了上面说的Symbol("bar") === Symbol("bar"); // false，Symbol() 函数每次都会返回新的一个 symbol

var sym = Symbol.for("mario");

sym.toString(); // "Symbol(mario)"，mario 既是该 symbol 在 symbol 注册表中的键名，又是该 symbol 自身的描述字符串复制代码

keyFor

Symbol.keyFor(sym)方法用来获取symbol注册表中与某个symbol关联的键。

// 创建一个 symbol 并放入 Symbol 注册表，key 为 "foo"var globalSym = Symbol.for("foo"); Symbol.keyFor(globalSym); // "foo"

// 创建一个 symbol，但不放入 symbol 注册表中var localSym = Symbol(); Symbol.keyFor(localSym); // undefined，所以是找不到 key 的

// well-known symbol 们并不在 symbol 注册表中Symbol.keyFor(Symbol.iterator) // undefined

let s1 = Symbol.for("foo");Symbol.keyFor(s1) // "foo"

let s2 = Symbol("foo");Symbol.keyFor(s2) // undefined// Symbol()写法没有登记机制，所以每次调用都会返回一个不同的值复制代码

内置的 Symbol 值（Well-known symbols）

ES6 提供了 12 个内置的 Symbol 值，指向语言内部使用的方法。

迭代 symbols

Symbol.iterator

指向该对象的默认遍历器方法。

Symbol.asyncIterator

指向该对象的默认异步遍历器方法。

正则表达式 symbols

Symbol.match

指向一个函数。String.prototype.match()方法执行时如果该属性存在，会调用此函数，返回该方法的返回值。

String.prototype.match(regexp)// 等同于

regexp[Symbol.match](this)

class MyMatcher {

[Symbol.match](string) {

return 'hello world'.indexOf(string);

}

'e'.match(new MyMatcher()) // 1

"/bar/".startsWith(/bar/);

// Throws TypeError, 因为 /bar/ 是一个正则表达式// 且 Symbol.match 没有修改。

var re = /foo/;

re[Symbol.match] = false;"/foo/".startsWith(re); // true"/baz/".endsWith(re); // false

// 如果将 Symbol.match 置为 false，// 使用 match 属性的表达式检查会认为该对象不是正则表达式对象复制代码

Symbol.replace

指向一个方法，当该对象被String.prototype.replace方法调用时，会返回该方法的返回值。

String.prototype.replace(searchValue, replaceValue)// 等同于

searchValue[Symbol.replace](this, replaceValue)

const x = {};

x[Symbol.replace] = (...s) => console.log(s);

'Hello'.replace(x, 'World') // ["Hello", "World"]复制代码

Symbol.search

指向一个方法，当该对象被String.prototype.search方法调用时，会返回该方法的返回值。

String.prototype.search(regexp)// 等同于

regexp[Symbol.search](this)

class MySearch {

constructor(value) {

this.value = value;

}

[Symbol.search](string) {

return string.indexOf(this.value);

}

}'foobar'.search(new MySearch('foo')) // 0

复制代码

Symbol.split

指向一个方法，当该对象被String.prototype.split方法调用时，会返回该方法的返回值。

class MySplitter {

constructor(value) {

this.value = value;

}

[Symbol.split](string) {

let index = string.indexOf(this.value);

if (index === -1) {

return string;

}

return [

string.substr(0, index),

string.substr(index + this.value.length)

];

}

'foobar'.split(new MySplitter('foo'))// ['', 'bar']

'foobar'.split(new MySplitter('bar'))// ['foo', '']

'foobar'.split(new MySplitter('baz'))// 'foobar'复制代码

其他 symbols

Symbol.hasInstance

指向一个内部方法。当其他对象使用instanceof运算符，判断是否为该对象的实例时，会调用这个方法。

class Even {

static [Symbol.hasInstance](obj) {

return Number(obj) % 2 === 0;

}

// 等同于const Even = {

[Symbol.hasInstance](obj) {

return Number(obj) % 2 === 0;

}

};

1 instanceof Even // false2 instanceof Even // true12345 instanceof Even // false复制代码

Symbol.isConcatSpreadable

等于一个布尔值，表示该对象用于Array.prototype.concat()时，是否可以展开。

let arr1 = ['c', 'd'];

['a', 'b'].concat(arr1, 'e') // ['a', 'b', 'c', 'd', 'e']

arr1[Symbol.isConcatSpreadable] // undefined

let arr2 = ['c', 'd'];

arr2[Symbol.isConcatSpreadable] = false;

['a', 'b'].concat(arr2, 'e') // ['a', 'b', ['c','d'], 'e']

// ----------

let obj = {length: 2, 0: 'c', 1: 'd'};

['a', 'b'].concat(obj, 'e') // ['a', 'b', obj, 'e']

obj[Symbol.isConcatSpreadable] = true;

['a', 'b'].concat(obj, 'e') // ['a', 'b', 'c', 'd', 'e']复制代码

Symbol.unscopables

指向一个对象。该对象指定了使用with关键字时，哪些属性会被with环境排除。

Array.prototype[Symbol.unscopables]// {// copyWithin: true,// entries: true,// fill: true,// find: true,// findIndex: true,// includes: true,// keys: true// }

// 数组有 7 个属性，会被with命令排除复制代码

Symbol.species

指向一个构造函数。创建衍生对象时，会使用该属性。

class MyArray extends Array {

}

const a = new MyArray(1, 2, 3);const b = a.map(x => x);const c = a.filter(x => x > 1);

b instanceof MyArray // true

c instanceof MyArray // true// b 和 c 是 a 的衍生对象

// ---------

class MyArray extends Array {

static get [Symbol.species]() { return Array; }

}

const a = new MyArray();const b = a.map(x => x);

b instanceof MyArray // false

b instanceof Array // true复制代码

Symbol.toPrimitive

指向一个方法。该对象被转为原始类型的值时，会调用这个方法，返回该对象对应的原始类型值。

可以接受一个字符串参数，表示当前运算的模式，一共有三种模式。

Number：该场合需要转成数值
String：该场合需要转成字符串
Default：该场合可以转成数值，也可以转成字符串

let obj = {

[Symbol.toPrimitive](hint) {

switch (hint) {

case 'number':

return 123;

case 'string':

return 'str';

case 'default':

return 'default';

default:

throw new Error();

}

};

2 * obj // 2463 + obj // '3default'

obj == 'default' // trueString(obj) // 'str'复制代码

Symbol.toStringTag

指向一个方法。在该对象上面调用Object.prototype.toString方法时，如果这个属性存在，它的返回值会出现在toString方法返回的字符串之中，表示对象的类型。

这个属性可以用来定制[object Object]或[object Array]中object后面的那个字符串。

({[Symbol.toStringTag]: 'Foo'}.toString())// "[object Foo]"

class Collection {

get [Symbol.toStringTag]() {

return 'xxx';

}

}let x = new Collection();Object.prototype.toString.call(x) // "[object xxx]"复制代码

ES6 内置对象属性值：

JSON[Symbol.toStringTag]：'JSON' Math[Symbol.toStringTag]：'Math' Module 对象M[Symbol.toStringTag]：'Module' ArrayBuffer.prototype[Symbol.toStringTag]：'ArrayBuffer' DataView.prototype[Symbol.toStringTag]：'DataView' Map.prototype[Symbol.toStringTag]：'Map' Promise.prototype[Symbol.toStringTag]：'Promise' Set.prototype[Symbol.toStringTag]：'Set' %TypedArray%.prototype[Symbol.toStringTag]：'Uint8Array'等 WeakMap.prototype[Symbol.toStringTag]：'WeakMap' WeakSet.prototype[Symbol.toStringTag]：'WeakSet' %MapIteratorPrototype%[Symbol.toStringTag]：'Map Iterator' %SetIteratorPrototype%[Symbol.toStringTag]：'Set Iterator' %StringIteratorPrototype%[Symbol.toStringTag]：'String Iterator' Symbol.prototype[Symbol.toStringTag]：'Symbol' Generator.prototype[Symbol.toStringTag]：'Generator' GeneratorFunction.prototype[Symbol.toStringTag]：'GeneratorFunction'

Symbol 原型

Symbol 一共有 4 个原型方法。

Symbol.prototype.toSource()

返回代表该对象源码的字符串。该方法通常由JavaScript内部调用。

对于内建Symbol对象, toSource 返回以下字符串，表明源代码不可见：

function Symbol() {

[native code]

}

`复制代码

对于Symbol实例, toSource 返回代表源码的字符串。

"Symbol()"复制代码

Symbol.prototype.toString()

返回当前 symbol 对象的字符串表示。

Symbol.prototype.valueOf()

返回当前 symbol 对象所包含的 symbol 原始值。

Symbol.prototype[@@toPrimitive]

可将 Symbol 对象转换为原始值。返回该原始值为指定的 Symbol 对象。

Symbol()[Symbol.toPrimitive](hint);

一般不需要自己调用 JS 会自动地调用该方法。

Symbol 静态属性

除了prototype属性，Symbol 还有一个length属性，值为0。

。

Map

Map对象保存键值对。任何值(对象或者原始值) 都可以作为一个键或一个值。它和 JS 对象不同，JS 对象只能用字符串和Symbol作为键，而Map可以使用任何值。

除了键类型上的不同，它和Object还有以下不同：

Map中的键值是有序的，而添加到对象中的键则不是。
Map可以通过size获取键值对个数，而Object的键值对个数只能手动计算。
Map可直接进行迭代，而 Object 的迭代需要先获取它的键数组，然后再进行迭代。
Object都有自己的原型，原型链上的键名有可能和你自己在对象上的设置的键名产生冲突。虽然ES5开始可以用map = Object.create(null) 来创建一个没有原型的对象，但是这种用法不太常见。
Map在涉及频繁增删键值对的场景下会有些性能优势。

const data = {};const element = document.getElementById('myDiv');

data[element] = 'metadata';

data['[object HTMLDivElement]'] // "metadata"

// -----------------------

var myMap = new Map();

myMap.set(NaN, "not a number");

myMap.get(NaN); // "not a number"

var otherNaN = Number("foo");

myMap.get(otherNaN); // "not a number"// NaN 作为 Map 的键来说是没有区别的复制代码

Map是一个构造函数，它接受一个可选的参数，可以是一个数组或者其他iterable 对象，其元素或为键值对，或为两个元素的数组。每个键值对都会添加到新的Map。

let m1 = new Map([[1,2], ['key', 'value'], [false, undefined], [null, null], [undefined, 1], [undefined, undefined]])console.log(m1)// Map(5) {1 => 2, "key" => "value", false => undefined, null => null, undefined => undefined}复制代码

Map是可以直接被迭代的，一个Map对象在迭代时会根据对象中元素的插入顺序来进行 — 一个for...of循环在每次迭代后会返回一个形式为[key，value]的数组。

var myMap = new Map();

myMap.set(0, "zero");

myMap.set(1, "one");for (var [key, value] of myMap) {

console.log(key + " = " + value);

}// 将会显示两个log。一个是"0 = zero"另一个是"1 = one"

// 合并两个 Mapvar first = new Map([

[1, 'one'],

[2, 'two'],

[3, 'three'],

]);

var second = new Map([

[1, 'uno'],

[2, 'dos']

]);

// 合并两个Map对象时，如果有重复的键值，则后面的会覆盖前面的。// 展开运算符本质上是将Map对象转换成数组。var merged = new Map([...first, ...second]);复制代码

Map 的原型属性

除了constructor，Map原型上还有一个size属性，它返回Map对象键值对的数量。

Map 的原型方法

Map一共有 10 个原型方法。

set(key, value)

为Map对象添加或更新一个指定了键（key）和值（value）的（新）键值对。它返回Map对象。

let m2 = new Map()

m2.set(1,2).set(2,3).set(2,100)console.log(m2)// Map(2) {1 => 2, 2 => 100}复制代码

get(key)

返回键对应的值，如果不存在，则返回undefined。

has(key)

如果指定元素存在于Map中，则返回true。否则返回false。

delete(key)

移除Map对象中指定的元素，如果Map对象中存在该元素，则移除它并返回 true；否则如果该元素不存在则返回false。

clear()

移除Map对象中的所有元素。返回undefined。

keys()

返回一个新的Iterator对象。它包含按照顺序插入Map对象中每个元素的key值。

var myMap = new Map();

myMap.set("0", "foo");

myMap.set(1, "bar");

myMap.set({}, "baz");

var mapIter = myMap.keys();

console.log(mapIter.next().value); // "0"console.log(mapIter.next().value); // 1console.log(mapIter.next().value); // Object复制代码

values()

返回一个新的Iterator对象。它包含按顺序插入Map对象中每个元素的value值。

entries()

返回一个新的包含[key, value]对的Iterator对象，返回的迭代器的迭代顺序与Map 对象的插入顺序相同。它就像直接迭代Map对象一样。

forEach(callback[, thisArg])

将会以插入顺序对Map对象中的每一个键值对执行一次参数中提供的回调函数。第二参数是回调函数的this指向，返回undefined。

第一个参数回掉函数的参数为：

value 元素的值
key 元素的键
Map 当前正在被遍历的对象

function logMapElements(value, key, map) {

console.log("m[" + key + "] = " + value);

}Map([["foo", 3], ["bar", {}], ["baz", undefined]]).forEach(logMapElements);// logs:// "m[foo] = 3"// "m[bar] = [object Object]"// "m[baz] = undefined"复制代码

[@@iterator]()

@@iterator属性的初始值与entries属性的初始值是同一个函数对象。

var myMap = new Map();

myMap.set('0', 'foo');

myMap.set(1, 'bar');

myMap.set({}, 'baz');

var mapIter = myMap[Symbol.iterator]();//返回的其实是个generatorconsole.log(mapIter.next().value); // ["0", "foo"]console.log(mapIter.next().value); // [1, "bar"]console.log(mapIter.next().value); // [Object, "baz"]