JavaScript高级学习笔记（含ES6）

在学习JavaScript高级+ES6过程记录下的一些笔记，内容的知识点不够齐全。

1 ES6中的类和对象

1.1 创建类

语法：

class Name {}

1.2 类 constructor 构造函数

constructor() 方法是类的构造函数（默认方法），用于传递参数，返回实例对象，通过 new 命令生成对象实例时，自动调用该方法。如果没有显示定义，类内部会自动给创建一个 constructor()

1.3 类的继承

语法：

class Father{   // 父类
       
}
class Son extends Father {

}

1.4 super 关键字

super 关键字用于访问和调用对象父类上的函数，可以调用父类的构造函数，也可以调用父类的普通函数

语法：

class Person {  // 父类
	constructor(uname) {
		this.uname = uname;
	}
}
class Stuent extends Person {
	constructor(uname, firstuname) {
		super(uname);    // 调用父类的constructor(uname)
		this.firstname = firstname;  // 定义子类独有的属性
	}
}

注意： 子类在构造函数中使用super，必须放到 this前面（必须先调用父类的构造函数方法，再使用子类构造函数）

1.5 es6中的类和对象的注意点

1 在 ES6 中类没有变量提升，所以必须先定义类，才能通过类实例化对象

2 类里面的共有的属性和方法一定要加 this 使用

3 类里面的this指向问题

4 constructor 里面的this指向实例对象，方法里面的this指向这个方法的调用者

2 构造函数和原型

2.1 概述

在典型的OOP的语言中都存在类的概念，类就是对象的模板，对象就是类的实例，在ES6之前，JS中没有引入类的概念

ES6，全程 ECMAScript6.0，2015.06发版，但是目前浏览器的JavaScript是ES5版本，大多数高版本的浏览器也支持ES6，不过只实现了ES6的部分特性和功能

在ES6之前，对象不是基于类创建的，而是用一种称为构建函数的特殊函数来定义对象和它们的特征

2.2 构造函数

构造函数是一种特殊函数，主要用来初始化对象，即为对象成员变量赋初始值，它总与new一起使用。可以把对象中一些公共的属性和方法抽取出来，然后封装到这个函数里面。

在JS中，使用构造函数时要注意一下两点：

1. 构造函数用于创建一类对象，其首字母要大写
2. 构造函数要和 new 一起使用才有意义

new 在执行时会做四件事情：

1. 在内存中创建一个新的空对象
2. 让this指向这个新的对象
3. 执行构造函数里面的代码，给这个新对象添加属性和方法
4. 返回这个新对象（所以构造函数里面不需要 return)

2.3 构造函数

JavaScript的构造函数中可以添加一些成员，可以构造函数本身上添加，也可以在构造函数内部的this上添加。通过这两种方式添加的成员，就分别称为静态成员和实例成员。

静态成员：在构造函数本身上添加的成员称为静态成员，只能由构造函数本身来访问。

实例成员：在构造函数内部创建的对象成员称为实例成员，只能由实例化的对象来访问

2.4 构造函数原型 prototype

构造函数通过原型分配的函数时所有对象所共享的

JavaScript 规定，每一个构造函数都有一个prototype属性，指向另一个对象。注意这个prototype就是一个对象，这个对象的所有属性和方法，都会被构造函数所拥有。

可以把那些不变的方法，直接定义在prototype对象上，这样所有对象的实例就可以共享这些方法。

2.5 对象原型 proto

对象都会有一个属性 proto 指向构造函数的prototype原型对象，之所以我们对象可以使用构造函数prototype原型对象的属性和方法，就是因为对象有__proto__原型的存在。

__proto__对象原型和原型对象prototype是等价的

__proto__对象原型的意义就在于为对象的查找机制提供了一个方向，或者说是一条线路，但是它是一个非标准属性，因此实际开发中，不可以使用这个属性，它只是内部指向原型对象 prototype

2.6 原型 constructor

对象原型(proto)和构造函数（prototype)原型对象里面都有一个属性constructor属性，constructor 即为构造函数，因为它指回构造函数本身。

如果修改了原来的原型对象，给原型对象赋值的是一个对象，则必须手动的利用 constructor 指回原来的构造函数

2.7 原型链

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-FFLypAnZ-1620835466848)(C:\Users\lenovo\AppData\Roaming\Typora\typora-user-images\image-20210416104854306.png)]

2.8 JS的成员查找机制（规则）

1 当访问一个对象的属性（包括方法时），首先查找这个对象自身有没有改属性

2 如果没有就查找它的原型（也就是__proto__指向的prototype原型对象）。

3 如果还没有就查找原型对象的原型（Object的原型对象）

4 依次类推一直找到Object为止（null)

__proto__对象模型的意义就在于为对象成员查找机制提供一个方向。

2.8 拓展内置对象

可以通过原型对象，对原来的内置对象进行拓展自定义的方法。

**注意：**数组和字符串内置对象不能给原型对象覆盖操作 Array.prototype = {}，只能是 Array.prototype.xxx = function() {} 的方式

3 继承

ES6之前没有给我们提供 extends继承，可以通过构造函数+原型对象模拟实现继承，被称为组合继承

3.1 call()

调用这个函数，并且修改函数运行时的this指向

fun.call(thisArg, arg1, arg2, ...)

• thisArg：当前调用函数this的指向对象
• arg1，arg2：传递的其他参数

	function fn(x, y) {
            console.log('我想睡觉');
            console.log(x + y);
        }
        var A = {
            name : 'Tom'
        } 
        // call() 调用函数
        // fn.call();
        // call() 改变this的指向，这时这个this指向A对象
        fn.call(A, 1, 2);

3.2 借用构造函数继承父类型属性

核心原理：通过 call() 把父类的this指向子类的this，这样就可以实现子类型继承父类型的属性

	// 借用父构造函数继承属性
        // 父构造函数
        function Father(uname, age) {
            // this 指向父构造函数的对象实例
            this.uname = uname;
            this.age = age;
        }
        // 子构造函数
        function Son(uname, age, score) {
            // this 指向子构造函数的对象实例
            Father.call(this, uname, age);
            this.score = score;
        }
        var son = new Son('Tom', 18, 100);
        console.log(son);

4 ES5新增方法

4.1 数组方法

迭代（遍历）方法：forEach()、map()、filter()、some()、every();

4.1.1 forEach()

array.forEach(function(value, index, array))

• value：数组当前项的值
• index：数组当前项的索引
• array：数组对象本身

4.1.2 filter()

array.filter(function(value, index, arr))

• filter()方法创建一个新的数组，新数组中的元素时通过检查指定数组中符合条件的所有元素，主要用于筛选数组
• 注意 它直接返回一个新数组

4.1.3 some()

array.some(function(value, index, arr))

• some()方法·用于检测数组中的元素是否满足指定条件，通俗点就是查找数组中是否有满足条件的元素
• 返回值是布尔值，如果查找到这个元素，就返回true，如果查找不到就返回false
• 如果找到第一个满足条件的元素，则终止循环，不再继续查找

4.2 字符串方法 trim()

trim() 方法会从一个字符串的两端清除空白字符

str.trim()

trim() 方法不影响原字符串本身，它返回的是一个新的字符串

4.3 对象方法

4.3.1 keys()

Object.keys()用于获取对象自身所有的属性

Object.keys(obj)

返回一个由属性名组成的数组

4.3.2 defineProperty()

Object.defineProperty() 定义对象中新属性或者修改原有的属性

Object.defineProperty(obj, prop, descriptor)

• obj：必需，目标对象
• prop：必需，需定义或修改的属性的名字
• descriptor：必需，目标属性所拥有的特性

第三个参数descriptor说明：以对象形式 {} 书写

• value：设置属性的值 默认为 undefined
• writable：值是否可以重写，true | false 默认是 false
• enumerable：目标属性是否可以被枚举，true | false 默认是 false
• configurable：目标属性是否可以被删除或者是否可以再次修改特性，true | false 默认是 false

5 函数进阶

5.1 函数的定义

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-f3Pazr2b-1620835466856)(C:\Users\lenovo\AppData\Roaming\Typora\typora-user-images\image-20210422163616862.png)]

5.2 函数内this的指向

这些this的指向，是当我们调用函数的时候确定的，调用方式的不同决定了this的指向不同，一般指向调用者

调用方式	this指向
普通函数调用	window
构造函数调用	实例对象，原型对象里面的方法也指向实例对象
对象方法调用	该方法所属对象
事件绑定调用	绑定事件对象
定时器函数	window
立即执行函数	window

5.3 改变函数内部this指向

JavaScript专门提供了一些函数方法来帮处理函数内部 this 的指向问题，常用的有 bind()、call()、apply()三种方法

5.3.1 apply() 方法

apply() 方法调用一个函数，简单理解为调用函数的方式，但是它可以改变函数的this指向

fun.apply(thisArg, [argsArray])

• thisArg：在fun函数运行时指定的 this值
• argsArray：传递的值，必须包含在数组里面
• 返回值就是函数的返回值，因为它就是调用者

	var obj = {
            id: 1,
            uname: '小米'
        }
        function fn(arr) {
            console.log(this);
            console.log(arr);
        }
        fn.apply(obj, ['pink']);
        var arr = [2, 4, 99, 10];
        var max = Math.max.apply(Math, arr);
        var min = Math.min.apply(Math, arr);
        console.log(max);
        console.log(min);

5.3.2 bind() 方法

bind()方法不会调用函数，但是能改变函数内部this指向

fun.bind(thisArg, arg1, arg2, ...)

• thisArg : 在fun 函数运行时指定的this值
• arg1, arg2 ：传递的其它参数
• 返回由指定的this值和初始化参数改造的原函数拷贝

5.4 call apply bind 总结

相同点：

都可以改变函数内部的this指向

区别点：

（1） call 和 apply 会调用函数，并且改变函数内部this指向

（2）call 和 apply 传递的参数不一样，call 传递参数 arg1, arg2, …形式，apply 必须是数组形式[arg]

（3）bind 不会调用函数，可以改变函数内部this指向

主要应用场景

（1）call经常做继承

（2）apply 经常跟数组有关系，比如借助数学对象实现数组最大值、最小值等

（3）bind 不调用函数，但是还想改变this指向，比如 改变定时器内部的this指向

6 严格模式

6.1 什么是严格模式

JavaScript 除了提供正常模式外，还提供了严格模式（strict mode)。ES5的严格模式是采用具有限制性JavaScript变体的一种方式，即在严格的条件下运行JS代码。

严格模式在IE10以上版本的浏览器才会支持，旧版本浏览器中会被忽略。

严格模式对正常的JavaScript语义做了一些更改：

（1）消除了JavaScript语法的一些不合理、不严谨之处，减少了一些怪异行为

（2）消除了代码运行的一些不安全之处，保证代码运行的安全

（3）提高编译器效率，增加运行速度

（4）禁用了ECMAScript的未来版本中可能会定义的一些语法，为未来新版本的JavaScript做好铺垫。比如一些保留字 如：class、enum、import、super等不能做变量名

6.2 开启严格模式

严格模式可以应用到整个脚本或个别函数中。因此，在使用时，可以将严格模式分为为脚本开始严格模式和为函数开启严格模式两种情况

（1）为脚本开启严格模式

为脚本文件开启严格模式，需要在所有语句之前放一个特定语句 “use strict”;

	<script>
        // 为脚本开启严格模式
        "use strict";
        // 下面的JS代码就会按照严格模式执行代码
    </script>

有的 script 基本是严格模式，有的script脚本是正常模式，这样不利于文件合并，所以可以将整个脚本文件放在一个立即执行的匿名函数之中。这样独立创建一个作用域而不影响其它script脚本文件。

	<script>
        (function() {
            'usr strict';
        })()
    </script>

(2) 为脚本开启严格模式

要给摸个函数开启严格模式，需要把 ‘use strict’; 声明放在函数体所有语句之前。

	 <!-- 为某个函数开启严格模式 -->
    <script>
        function fun() {
            'usr strict';
        }
    </script>

6.3 严格模式中的变化

严格模式对JavaScript的语法和行为，都做了一些变化

（1）变量规定

① 在正常模式中，如果一个变量没有声明就赋值，默认是全局变量。严格模式禁止这种用法，变量都必须先声明，然后再使用。

② 严禁删除已经声明变量的，例如：delete x; 语法是错误的

（2）this 指向问题

① 以前在全局变量作用域函数中的this指向 window对象

② 严格模式下全局作用域中函数中的this是 undefined

③ 以前构造函数不加 new 也可以调用，当普通函数，this指向全局变量

④ 严格模式下，如果构造函数不加 new 调用，this 会报错

⑤ new 实例化的构造函数指向创建的对象实例

⑥ 定时器this还是指向window

⑦ 事件、对象还是指向调用者

（3）函数变化

① 函数不能有重名的参数

② 函数必须声明在顶层新版本的 JavaScript 会引入 “块级作用域”（ES6中已引入），为了与新版本接轨，不允许在非函数的代码内声明函数。

7 高阶函数

高阶函数是对其他函数进行操作的函数，它接受函数作为参数或将函数作为返回值输出

8 闭包

8.1 什么是闭包

闭包（closure）指有权访问另一个函数作用域中变量的函数

简单理解：一个作用域可以访问另外一个函数内部的局部变量

8.2 闭包的作用

延伸了变量的作用范围

	function fn() {
            var num = 10;

            function fun() {
                console.log(num);
            }

            return fun;
        }
        var f = fn();
        f();

9 递归

9.1 什么是递归

如果一个函数在内部可以调用其本身，那么这个函数就是递归函数

简单理解：函数内部自己调用自己，这个函数就是递归函数

10 浅拷贝

		// 浅拷贝: 浅拷贝只拷贝一层，更深层次对象级别的只拷贝引用
        var obj = {
            id: 1,
            name: '小明'
        };
        var o = {};
        // for(var k in obj) {
        //     o[k] = obj[k];
        // }
        // console.log(o);
        Object.assign(o, obj);
        console.log(o);

11 深拷贝

  <!-- 深拷贝：拷贝多层 每一级别的数据都会拷贝 -->
    <script>
        var obj = {
            id: 1,
            name: 'andy',
            msg: {
                age: 18,
            },
            color: ['pink', 'red']
        };
        var o = {};

        function deepCopy(newObj, oldObj) {
            for(var k in oldObj) {
                // 获取属性值
                var item = oldObj[k];
                // 判断这个值是否属于数组
                if(item instanceof Array) {
                    newObj[k] = [];
                    deepCopy(newObj[k], item);
                } 
                // 判断这个值是否属于对象
                else if(item instanceof Object) {
                    newObj[k] = {};
                    deepCopy(newObj[k], item);
                }
                // 属于数据类型
                else {
                    newObj[k] = item;
                }
            }
        }
        deepCopy(o, obj);
    </script>

12 正则表达式

12.1 什么是正则表达式

正则表达式（Regular Expression）是用于匹配字符串中字符组合的模式。在JavaScript中，正则表达式也是对象。

正则表达式通常被用来检索、替换那些符合摸个模式（规则）的文本，例如验证表单：用户名表单只能输入英文字母、数字或者下划线，昵称输入框中可以输入中文（匹配）。此外，正则表达式还常用于过滤页面内容中的一些敏感词（替换），或从字符串中获取我们想要的特定部分（提取）等。

12.2 创建正则表达式

（1）通过调用 RegExp 对象的构造函数创建

		var regexp = new RegExp(/123/);
        console.log(regexp);	

（2）通过字面量创建

		var rg = /123/;
        console.log(rg);

12.3 测试正则表达式 test

test() 正则对象方法，用于检测字符串是否符合规则，该对象会返回 true 或 false，其参数是测试字符串。

regexObj.test(str);

• regexObj：是写的正则表达式
• str：需要测试的文本
• 就是检测 str 文本是否符合写的正则表达式规格。

		var rg = /123/;
        console.log(rg.test(123)); // true
        console.log(rg.log('abc')); // false

12.4 正则表达式中的特殊字符

12.4.1 边界符

正则表达式中的边界符（位置符）用来提示字符所处的位置，主要有两个字符。

边界符	说明
^	表示匹配行首的文本（以谁开始）
$	表示匹配行尾的文本（以谁结束）

如果 ^ 和 $ 在一起，表示必须是精确匹配

12.4.2 字符类

字符类表示有一系列字符可供选择，只要匹配其中一个就可以了。所有可供选择的字符都放在方括号内。

[-] 方括号内部 范围符 - ，例如，[abcd] 和[a-d]是一样的。

/¹$/表示匹配26个英文字符(大小写)和0-9的任意数字。

/^[0-9a-zA-Z]$/如果中括号里面有^ 表示取反的意思 千万和 我们边界符 ^ 别混淆

12.4.3 量词符

量词符用来设定某个模式出现的次数

量词	说明
*	重复零次或更多次
+	重复一次或更多次
？	重复零次或一次
{n}	重复n次
{n,}	重复n次或更多次
{n,m}	重复n到m次

12.5 括号总结

大括号：量词符，里面表示重复次数，

中括号：字符集合，匹配方括号中的任意字符

小括号：表示优先级

12.6 预定义类

预定义类	说明
\d	匹配0-9之间的任意数字，相当于[0-9]
\D	匹配所有0-9以外的字符，相当于[^0-9]
\w	匹配任意的字母、数字和下划线，相当于[a-zA-Z0-9]
\W	除所有字母、数字和下划线以外的字符
\s	匹配空格（包括换行符、制表符、空格等），相当于[\t\r\n\v\f]
\S	匹配非空格的字符

12.7 replace 替换

repalce() 方法可以实现替换字符串操作，用来替换的参数可以是一个字符串或是一个正则表达式

stringObject.replace(regexp/substr, replacement)

1. 第一个参数：被替换的字符串 或者 正则表达式
2. 第二个参数：替换为的字符串
3. 返回值是一个替换完毕的新字符串

/表达式/[switch]

switch(也称为修饰符) 按照什么样的模式来匹配，有三种：

• g：全局匹配
• i：忽略大小写
• gi: 全局匹配 + 忽略大小写

ES6 简介

1 为什么使用ES6

每一次标准的诞生都意味着语言的完善。JavaScript语言本身也有一些令人不满意的地方。

变量提升特性增加了程序运行时的不可预测性

语法过于松散，实现相同的功能，不同的人可能会写出不同的代码

2 let

ES6中新增的用于声明变量的关键字

特点：

• let 声明的变量只在所处于的块级有效
• 不存在变量提升
• 防止循环变量变成全局变量
• 暂时性死区

注意：使用let关键字声明的变量才具有块级作用域，使用var声明的变量不具备块级作用域特性。

3 const

作用：声明常亮，常亮就是值（内存地址）不能变化的量。

特点：

• 具有块级作用域
• 声明常量时必须赋值
• 常量赋值后，值不能修改

4 let、const、var 的区别

使用var声明的变量，其作用域为该语句所在的函数内，且存在变量提升现象。

使用let声明的变量，其作用域为该语句所在的代码内，不存在变量提升

使用const声明的是常量，在后面出现的代码中不能再修改常量的值

var	let	const
函数级作用域	块级作用域	块级作用域
变量提升	不存在变量提升	不存在变量提升
值可更改	值可更改	值不可更改

5 解构赋值

ES6中允许从数组中提取值，按照对应位置，对变量赋值，对象也可以实现解构

5.1 数组结构

数组结构允许我们按照一一对应的关系从数组中提取值，然后将值赋值给变量

如果解构不成功，变量的值为undefined

	<script>
        let [a, b, c, d] = [1, 2, 3];
        console.log(a);  // 1
        console.log(b);  // 2
        console.log(c);  // 3
        console.log(d);  // undefined
    </script>

5.2 对象解构

按照一定模式，从数组中或对象中提取值，将提取出来的值赋值给另外的变量

	let person = {
            name: '小明',
            age: 18,
            sex: '男'
        }
        let {name, age, sex} = person;
        console.log(name);  // 小明
        console.log(age);  // 18
        console.log(sex);  // 男
		

	let person = {
            name: '小明',
            age: 18,
        }
	let {name: myName, age: myAge} = person;
        console.log(myName); // 小明
        console.log(myAge);  // 18

5.3 箭头函数

() => {}

• ( ) : 用于放形参
• { } : 写函数体

	const fn = () => {
            console.log('箭头函数');
        }
        fn();

函数体中只有一句代码，且代码的执行结果就是返回值，可以省略大括号

		const sum = (num1, num2) => num1 + num2;
        const s = sum(1, 2);
        console.log(s);  // 3

如果形参只有一个，可以省略小括号

		const fun = v => v;
        console.log(fun(10));  // 10

5.3.1 箭头函数this指向

箭头函数不绑定this关键字，如果在箭头函数中使用this，this关键字将指向箭头函数定义位置中的this

优点：箭头函数的优点在于解决了this执行环境所造成的一些问题。比如：解决了匿名函数this指向的问题（匿名函数的执行环境具有全局性），包括setTimeout和setInterval中使用this所造成的问题

	<script>
        function fn() {
            console.log(this);  // this指向obj对象
            return () => {
                console.log(this);  // this指向obj对象
            }
        }
        const obj = {
            name: 'andy'
        }
        const result = fn.call(obj);
        result();  // 调用箭头函数
    </script>

6 剩余参数

剩余参数语法允许我们将一个不定数量的参数表示一个数组

		function sum(a, ...b) {
             console.log(a);  // 1
             console.log(b);  // [2, 3]
        }
         sum(1, 2, 3);

		const sum = (...args) => {
            var result = 0;
            args.forEach(item => result += item);
            return result;
        }
        console.log(sum(1, 2));
        console.log(sum(11, 22, 33));

7 扩展运算符

扩展运算符可以将数组或者对象转为用逗号分隔的参数序列

		let arg = ['a', 'b', 'c'];
        console.log(...arg); // a b c

合并数组

		let ary1 = [1, 2, 3];
        let ary2 = [4, 5, 6];
        // 方法1
        let ary3 = [...ary1, ...ary2];
        console.log(ary3);  // 1 2 3 4 5 6 
		// 方法2
        ary1.push(...ary2);
        console.log(ary1); // 1 2 3 4 5 6 

将伪数组转换为真正的数组

		// 将伪数组转换为真正的数组
        var divs = document.getElementsByTagName('div');
        console.log(divs);
        var ary = [...divs];
        console.log(ary);

7.1 构造函数方法：Array.from()

将伪数组转换为真正的数组

		let ary = {
            '0': 'Tom',
            '1': 'andy',
            'length': 2
        }
        let newAry = Array.from(ary);
        console.log(newAry);  // ["Tom", "andy"]

Array.from() 方法还可以接受第二个参数。作用类似于数组的map方法，用来对每个元素进行处理，将处理后的值放入返回的数组。

		let ary1 = {
            0: '1',
            1: '2',
            length: 2
        }
        let newAry1 = Array.from(ary1, item => item * 2);
        console.log(newAry1);  // [2, 4]

7.2 数组的扩展方法

1. find()

用于找出第一个符合条件的数组成员，如果没有找到则返回undfined

	let ary = [{
            id: 1,
            color: 'pink'
        }, {
            id: 2,
            color: 'red'
        }
    ];
    let target = ary.find(item => item.id == 2);
    console.log(target);

2. findIndex()

用于找出第一个符合条件的数组成员的位置(索引），如果没有找到返回-1

		let ary = [1, 2, 3, 4];
        let newAry = ary.findIndex(item => item > 2);
        console.log(newAry); // 2

3. includes()

表示某个数组是否包含给定的值，返回布尔值

		let ary = [1, 2, 3];
        let r1 = ary.includes(2);
        let r2 = ary.includes(4);
        console.log(r1);  // true
        console.log(r2);  // false

7.3 字符串的扩展方法

1. 模板字符串

ES6新增的创建字符串的方法，使用反引号定义

模板字符串可以解析变量

		let name = 'andy';
        let hello = `hello, my name is ${name}`;
        console.log(hello);  // hello, my name is andy

模板字符串中可以换行

	let obj = {
            name: 'pink',
            age: 18
        };
        let html = `
            <div>
                <span>${obj.name}</span>
                <span>${obj.age}</span>
            </div>
        `;

在模板字符串中可以调用函数

  		let fn = function() {
           return '调用函数';
        }
        let f = `${fn()}`;
        console.log(f);

2. startsWith()和endsWith()

startsWith()：表示参数字符串是否在原字符串的头部，返回布尔值

endsWith()：便是参数字符串是否在原字符的尾部，返回布尔值

		let str = 'Hello World !';
        console.log(str.startsWith('Hello'));  // true
        console.log(str.endsWith('!'));  // true

3 repeat()

repeat()方法表示将原字符串重复n次，返回一个新字符串

		let str = 'a';
        console.log(str.repeat(3)); // aaa

8 Set 数据结构

ES6提供了新的数据结构Set。它类似于数组，但是成员的值都是唯一的，没有重复的值。

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

var s = new Set();

Set函数可以接受一个数组作为参数，用来初始化

var s1 = new Set([1, 2, 3, 4]);

1 实例方法

add(value)：添加某个值，返回Set结构本身

delete(value)：删除某个值，返回一个布尔值，表示删除是否成功

has(value)：返回一个布尔值，表示该值是否为Set的成员

clearr()：清除所有成员，没有返回值

		let s = new Set();
        // add() 向Set 结构中添加值
        s.add('a').add(1).add('b');
        console.log(s);  // {"a", 1, "b"}
        // delete() 从Set结构中删除某个值
        s.delete('b');
        console.log(s);  // {"a", 1}
        // has() 判断Set结构中是否有该值，返回布尔值
        let h = s.has(1);
        console.log(h);  // true
        // clear() 清除Set结构的所有值
        s.clear();
        console.log(s);  // {}

2 遍历

Set结构的实例与数组一样，也拥有forEach方法，用于对每个成员某种操作，没有返回值

		var s1 = [1, 2, 3, 4];
        var s = new Set(s1);
        s.forEach(value => {
            console.log(value);
        })

---

1. 0-9a-zA-Z ↩︎