其他分享
首页 > 其他分享> > ES6查漏补缺

ES6查漏补缺

作者:互联网

ES6查漏补缺

1. let 和const 命令

区别于var

重点: let实际上为 JavaScript 新增了块级作用域,即外层代码块不受内层代码块的影响

ES5 只有两种声明变量的方法:var命令和function命令。

ES6 除了添加let和const命令,另外两种声明变量的方法:import命令和class命令。所以,ES6 一共有 6 种声明变量的方法。


2. 数组的解构赋值

从数组和对象中提取值,对变量进行赋值,这被称为解构

对象的解构赋值
字符串的解构赋值
变量的解构赋值用途

3.模板字符串

`xxx ${变量}  xxxx` 

4. 字符串新增的方法

使用第二个参数n时,endsWith的行为与其他两个方法有所不同。它针对前n个字符,而其他两个方法针对从第n个位置直到字符串结束。

5. 数值的扩展

数值使用下划线(_)作为分隔符,可以每三位添加一个分隔符,也可以每一位、每两位、每四位添加一个

在这里插入图片描述

不能放在数值的最前面(leading)或最后面(trailing)。
不能两个或两个以上的分隔符连在一起。
小数点的前后不能有分隔符。
科学计数法里面,表示指数的e或E前后不能有分隔符。

Math.trunc方法用于去除一个数的小数部分,返回整数部分;对于非数值,Math.trunc内部使用Number方法将其先转为数值;对于空值和无法截取整数的值,返回NaN
在这里插入图片描述

Math.sign方法用来判断一个数到底是正数、负数、还是零。对于非数值,会先将其转换为数值
在这里插入图片描述
参数为正数,返回+1;
参数为负数,返回-1;
参数为 0,返回0;
参数为-0,返回-0;
其他值,返回NaN。


6. 函数的扩展

注意点:
参数变量是默认声明的,所以不能用let或const再次声明,会报错
使用参数默认值时,函数不能有同名参数
有默认值的参数,写在最后

指定了默认值以后,函数的length属性,将返回没有指定默认值的参数个数。也就是说,指定了默认值后,length属性将失真
在这里插入图片描述
如果设置了默认值的参数不是尾参数,那么length属性也不再计入后面的参数了
在这里插入图片描述

一旦设置了参数的默认值,函数进行声明初始化时,参数会形成一个单独的作用域(context)。等到初始化结束,这个作用域就会消失。这种语法行为,在不设置参数默认值时,是不会出现的。

在这里插入图片描述

上面代码中,参数y的默认值等于变量x。调用函数f时,参数形成一个单独的作用域。在这个作用域里面,默认值变量x指向第一个参数x,而不是全局变量x,所以输出是2。

上面代码的foo函数,如果调用的时候没有参数,就会调用默认值throwIfMissing函数,从而抛出一个错误

另外,可以将参数默认值设为undefined,表明这个参数是可以省略的。

ES6 引入 rest 参数(形式为…变量名),用于获取函数的多余参数,这样就不需要使用arguments对象了。rest 参数搭配的变量是一个数组,该变量将多余的参数放入数组中。
在这里插入图片描述
注意,rest 参数之后不能再有其他参数(即只能是最后一个参数),否则会报错
在这里插入图片描述

(1)箭头函数没有自己的this对象(详见下文)。
(2)不可以当作构造函数,也就是说,不可以对箭头函数使用new命令,否则会抛出一个错误。
(3)不可以使用arguments对象,该对象在函数体内不存在。如果要用,可以用 rest 参数代替。
(4)不可以使用yield命令,因此箭头函数不能用作 Generator 函数。

如果 try 块中的任何代码发生了错误,就会立即退出代码执行过程,然后接着执行 catch 块。此时,catch 块会接收到一个包含错误信息的对象。即使你不想使用这个错误对象,也要给它起个名字。这个对象中包含一个保存着错误消息的 message 属性和一个保存错误类型的 name 属性。

try{ 
 // 可能会导致错误的代码
} catch(error){ 
 // 在错误发生时怎么处理
} 

//虽然在 try-catch 语句中是可选的,但 finally 子句一经使用,
其代码无论如何都会执行
function testFinally(){ 
    try { 
        return 2; 
    } catch (error){ 
        return 1; 
    } finally { 
        return 0; 
    } 
}
//调用这个函数只能返回 0。
//如果把 finally 子句拿掉,这个函数将返回 2

7. 数组的扩展

扩展运算符(spread)是三个点(…)。它好比 rest 参数的逆运算,将一个数组转为用逗号分隔的参数序列
在这里插入图片描述
(1)复制数组
在这里插入图片描述
(2)合并数组
在这里插入图片描述
两种方法都是浅拷贝,使用的时候需要注意

(3)与解构赋值结合,用于生成数组
在这里插入图片描述(4)字符串,扩展运算符还可以将字符串转为真正的数组
在这里插入图片描述

用于将两类对象转为真正的数组:类似数组的对象(array-like object)和可遍历(iterable)的对象(包括 ES6 新增的数据结构 Set 和 Map)。
在这里插入图片描述字符串和 Set 结构都具有 Iterator 接口,因此可以被Array.from转为真正的数组
在这里插入图片描述
如果参数是一个真正的数组,Array.from会返回一个一模一样的新数组
在这里插入图片描述
Array.from还可以接受第二个参数,作用类似于数组的map方法,用来对每个元素进行处理,将处理后的值放入返回的数组
在这里插入图片描述

可以用for…of循环进行遍历,唯一的区别是keys()是对键名的遍历、values()是对键值的遍历,entries()是对键值对的遍历
在这里插入图片描述

数组的成员有时还是数组,Array.prototype.flat()用于将嵌套的数组“拉平”,变成一维的数组。该方法返回一个新数组,对原数据没有影响
在这里插入图片描述
flat()方法的参数写成一个整数,表示想要拉平的层数,默认为1;
如果原数组有空位,flat()方法会跳过空位

数组的空位指的是,数组的某一个位置没有任何值,比如Array()构造函数返回的数组都是空位
在这里插入图片描述
上面代码中,Array(3)返回一个具有 3 个空位的数组,空位是没有任何值
ES6 则是明确将空位转为undefined


8. 对象的扩展

ES6 允许在大括号里面,直接写入变量和函数,作为对象的属性和方法
在这里插入图片描述
在这里插入图片描述

JavaScript 定义对象的属性,有两种方法
在这里插入图片描述
ES6 允许字面量定义对象时,用方法二(表达式)作为对象的属性名,即把表达式放在方括号内
在这里插入图片描述
注意: 属性名表达式与简洁表示法,不能同时使用,会报错
在这里插入图片描述

ES6 一共有 5 种方法可以遍历对象的属性

(1)for…in
for…in循环遍历对象自身的和继承的可枚举属性(不含 Symbol 属性)。

(2)Object.keys(obj)
Object.keys返回一个数组,包括对象自身的(不含继承的)所有可枚举属性(不含 Symbol 属性)的键名。

(3)Object.getOwnPropertyNames(obj)
Object.getOwnPropertyNames返回一个数组,包含对象自身的所有属性(不含 Symbol 属性,但是包括不可枚举属性)的键名。

(4)Object.getOwnPropertySymbols(obj)
Object.getOwnPropertySymbols返回一个数组,包含对象自身的所有 Symbol 属性的键名

(5)Reflect.ownKeys(obj)
Reflect.ownKeys返回一个数组,包含对象自身的(不含继承的)所有键名,不管键名是 Symbol 或字符串,也不管是否可枚举。


9. 运算符的扩展

在这里插入图片描述
这个运算符的一个特点是右结合,而不是常见的左结合。多个指数运算符连用时,是从最右边开始计算的。
在这里插入图片描述
指数运算符可以与等号结合,形成一个新的赋值运算符(**=)
在这里插入图片描述

判断运算符。它的行为类似||,但是只有运算符左侧的值为null或undefined时,才会返回右侧的值
在这里插入图片描述
如果多个逻辑运算符一起使用,必须用括号表明优先级,否则会报错
在这里插入图片描述
必须加入表明优先级的括号
在这里插入图片描述


10.Promise 对象

Promise,简单说就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果;从语法上说,Promise 是一个对象,从它可以获取异步操作的消息。

Promise对象有以下两个特点

(1)对象的状态不受外界影响。Promise对象代表一个异步操作,有三种状态:pending(进行中)、fulfilled(已成功)和rejected(已失败)。只有异步操作的结果,可以决定当前是哪一种状态,任何其他操作都无法改变这个状态。这也是Promise这个名字的由来,它的英语意思就是“承诺”,表示其他手段无法改变。

(2)一旦状态改变,就不会再变,任何时候都可以得到这个结果。Promise对象的状态改变,只有两种可能:从pending变为fulfilled和从pending变为rejected。只要这两种情况发生,状态就凝固了,不会再变了,会一直保持这个结果,这时就称为 resolved(已定型)。如果改变已经发生了,你再对Promise对象添加回调函数,也会立即得到这个结果。这与事件(Event)完全不同,事件的特点是,如果你错过了它,再去监听,是得不到结果的。

Promise也有一些缺点。首先,无法取消Promise,一旦新建它就会立即执行,无法中途取消。其次,如果不设置回调函数,Promise内部抛出的错误,不会反应到外部。第三,当处于pending状态时,无法得知目前进展到哪一个阶段(刚刚开始还是即将完成)

ES6 规定,Promise对象是一个构造函数,用来生成Promise实例
在这里插入图片描述
Promise构造函数接受一个函数作为参数,该函数的两个参数分别是resolve和reject。它们是两个函数

resolve函数的作用是,将Promise对象的状态从“未完成”变为“成功”(即从 pending 变为 resolved),在异步操作成功时调用,并将异步操作的结果,作为参数传递出去;
reject函数的作用是,将Promise对象的状态从“未完成”变为“失败”(即从 pending 变为 rejected),在异步操作失败时调用,并将异步操作报出的错误,作为参数传递出去。

Promise实例生成以后,可以用then方法分别指定resolved状态和rejected状态的回调函数。
在这里插入图片描述
then方法可以接受两个回调函数作为参数。第一个回调函数是Promise对象的状态变为resolved时调用,第二个回调函数是Promise对象的状态变为rejected时调用。这两个函数都是可选的,不一定要提供。它们都接受Promise对象传出的值作为参数。

Promise 新建后就会立即执行
在这里插入图片描述
上面代码中,Promise 新建后立即执行,所以首先输出的是Promise。然后,then方法指定的回调函数,将在当前脚本所有同步任务执行完才会执行,所以resolved最后输出

resolve函数的参数除了正常的值以外,还可能是另一个 Promise 实例在这里插入图片描述
上面代码中,p1和p2都是 Promise 的实例,但是p2的resolve方法将p1作为参数,即一个异步操作的结果是返回另一个异步操作。
注意,这时p1的状态就会传递给p2,也就是说,p1的状态决定了p2的状态。如果p1的状态是pending,那么p2的回调函数就会等待p1的状态改变;如果p1的状态已经是resolved或者rejected,那么p2的回调函数将会立刻执行

注意,调用resolve或reject并不会终结 Promise 的参数函数的执行
在这里插入图片描述
上面代码中,调用resolve(1)以后,后面的console.log(2)还是会执行,并且会首先打印出来。这是因为立即 resolved 的 Promise 是在本轮事件循环的末尾执行,总是晚于本轮循环的同步任务。
一般来说,调用resolve或reject以后,Promise 的使命就完成了,后继操作应该放到then方法里面,而不应该直接写在resolve或reject的后面。

then方法返回的是一个新的Promise实例(注意,不是原来那个Promise实例)。因此可以采用链式写法,即then方法后面再调用另一个then方法
在这里插入图片描述
上面的代码使用then方法,依次指定了两个回调函数。第一个回调函数完成以后,会将返回结果作为参数,传入第二个回调函数

采用链式的then方法,有可能返回的还是一个Promise对象(即有异步操作),这时后一个回调函数,就会等待该Promise对象的状态发生变化,才会被调用
在这里插入图片描述
上面代码中,第一个then方法指定的回调函数,返回的是另一个Promise对象。这时,第二个then方法指定的回调函数,就会等待这个新的Promise对象状态发生变化。如果变为resolved,就调用第一个回调函数,如果状态变为rejected,就调用第二个回调函数

.catch()方法效果等同于.then(null, rejection)或.then(undefined, rejection),用于指定发生错误时的回调函数
在这里插入图片描述
处理getJSON函数和then函数产生的错误
Promise 对象的错误具有“冒泡”性质,会一直向后传递,直到被捕获为止。也就是说,错误总是会被下一个catch语句捕获


上面代码中,不管promise最后的状态,在执行完then或catch指定的回调函数以后,都会执行finally方法指定的回调函数
//
finally方法的回调函数不接受任何参数,这意味着没有办法知道,前面的 Promise 状态到底是fulfilled还是rejected。这表明,finally方法里面的操作,应该是与状态无关的,不依赖于 Promise 的执行结果。

在这里插入图片描述
上面代码中,Promise.all()方法接受一个数组作为参数,p1、p2、p3都是 Promise 实例
//
p的状态由p1、p2、p3决定,分成两种情况
//
(1)只有p1、p2、p3的状态都变成fulfilled,p的状态才会变成fulfilled,此时p1、p2、p3的返回值组成一个数组,传递给p的回调函数。
//(2)只要p1、p2、p3之中有一个被rejected,p的状态就变成rejected,此时第一个被reject的实例的返回值,会传递给p的回调函数


11.async 函数

async函数返回一个 Promise 对象,可以使用then方法添加回调函数。当函数执行的时候,一旦遇到await就会先返回,等到异步操作完成,再接着执行函数体内后面的语句

在这里插入图片描述
上面代码指定 50 毫秒以后,再输出hello world,等待异步
在这里插入图片描述

在这里插入图片描述
在这里插入图片描述

在这里插入图片描述
console.log(f())得到是一个promise对象,但是.then()中的参数是return返回的值
//
只有async函数内部的异步操作执行完,才会执行then方法指定的回调函数

正常情况下,await命令后面是一个 Promise 对象,返回该对象的结果。如果不是 Promise 对象,就直接返回对应的值
在这里插入图片描述
await命令后面是一个thenable对象(即定义了then方法的对象),那么await会将其等同于 Promise 对象,await会将其视为Promise处理

await命令后面的 Promise 对象如果变为reject状态,则reject的参数会被catch方法的回调函数接收到
在这里插入图片描述
任何一个await语句后面的 Promise 对象变为reject状态,那么整个async函数都会中断执行
在这里插入图片描述
有时,我们希望即使前一个异步操作失败,也不要中断后面的异步操作。这时可以将第一个await放在try…catch结构里面,这样不管这个异步操作是否成功,第二个await都会执行
在这里插入图片描述
另一种方法是await后面的 Promise 对象再跟一个catch方法,处理前面可能出现的错误
在这里插入图片描述

await命令后面的Promise对象,运行结果可能是rejected,所以最好把await命令放在try…catch代码块中
在这里插入图片描述
第二点,多个await命令后面的异步操作,如果不存在继发关系,最好让它们同时触发
在这里插入图片描述
getFoo和getBar是两个独立的异步操作(即互不依赖);上面两种写法,getFoo和getBar都是同时触发,这样就会缩短程序的执行时间

12.Class 的基本语法

JavaScript 语言中,生成实例对象的传统方法是通过构造函数
在这里插入图片描述
ES6通过class关键字,可以定义类
在这里插入图片描述
constructor()方法,这就是构造方法,而this关键字则代表实例对象
Point类除了构造方法,还定义了一个toString()方法。注意,定义toString()方法的时候,前面不需要加上function这个关键字,直接把函数定义放进去了就可以了。另外,方法与方法之间不需要逗号分隔,加了会报错

*类的数据类型就是函数,类本身就指向构造函数

在这里插入图片描述

类的所有方法都定义在类的prototype属性上面
在这里插入图片描述
上面代码中,constructor()、toString()、toValue()这三个方法,其实都是定义在Point.prototype上面

由于类的方法都定义在prototype对象上面,所以类的新方法可以添加在prototype对象上面。Object.assign()方法可以很方便地一次向类添加多个方法
在这里插入图片描述
类的内部所有定义的方法,都是不可枚举的

constructor()方法是类的默认方法,通过new命令生成对象实例时,自动调用该方法
在这里插入图片描述

生成类的实例,使用new命令

与 ES5 一样,实例的属性除非显式定义在其本身(即定义在this对象上),否则都是定义在原型上(即定义在class上)
在这里插入图片描述
上面代码中,x和y都是实例对象point自身的属性(因为定义在this对象上),所以hasOwnProperty()方法返回true,而toString()是原型对象的属性(因为定义在Point类上),所以hasOwnProperty()方法返回false。这些都与 ES5 的行为保持一致

与 ES5 一样,类的所有实例共享一个原型对象
在这里插入图片描述
p1和p2都是Point的实例,它们的原型都是Point.prototype,所以__proto__属性是相等的;这也意味着,可以通过实例的__proto__属性为“类”添加方法
在这里插入图片描述
但不推荐使用

类的属性名,可以采用表达式
在这里插入图片描述

与函数一样,类也可以使用表达式的形式定义。
在这里插入图片描述
上面代码使用表达式定义了一个类。需要注意的是,这个类的名字是Me,但是Me只在 Class 的内部可用,指代当前类。在 Class 外部,这个类只能用MyClass引用。
在这里插入图片描述
Me只在 Class 内部有定义;如果类的内部没用到的话,可以省略Me
在这里插入图片描述

(1)不存在提升
在这里插入图片描述
(2)name 属性
name属性总是返回紧跟在class关键字后面的类名
在这里插入图片描述
(3)this 的指向
类的方法内部如果含有this,它默认指向类的实例。但是,必须非常小心,一旦单独使用该方法,很可能报错
在这里插入图片描述
上面代码中,printName方法中的this,默认指向Logger类的实例。但是,如果将这个方法提取出来单独使用,this会指向该方法运行时所在的环境(由于 class 内部是严格模式,所以 this 实际指向的是undefined),从而导致找不到print方法而报错

类相当于实例的原型,所有在类中定义的方法,都会被实例继承。如果在一个方法前,加上static关键字,就表示该方法不会被实例继承,而是直接通过类来调用,这就称为“静态方法”
在这里插入图片描述
注意,如果静态方法包含this关键字,这个this指的是类,而不是实例
在这里插入图片描述
上面代码中,静态方法bar调用了this.baz,这里的this指的是Foo类,而不是Foo的实例,等同于调用Foo.baz。另外,从这个例子还可以看出,静态方法可以与非静态方法重名
//
父类的静态方法,可以被子类继承
在这里插入图片描述
父类Foo有一个静态方法,子类Bar可以调用这个方法
//
静态方法也是可以从super对象上调用的在这里插入图片描述

实例属性除了定义在constructor()方法里面的this上面,也可以定义在类的最顶层
在这里插入图片描述
这种新写法的好处是,所有实例对象自身的属性都定义在类的头部,看上去比较整齐,一眼就能看出这个类有哪些实例属性

静态属性
静态属性指的是 Class 本身的属性;而不是定义在实例对象(this)上的属性
在这里插入图片描述
ES6 明确规定,Class 内部只有静态方法,没有静态属性;常用上述方法
现在有一个提案提供了类的静态属性,写法是在实例属性的前面,加上static关键字。
在这里插入图片描述

私有方法和私有属性,是只能在类的内部访问的方法和属性,外部不能访问
将私有方法移出类,因为类内部的所有方法都是对外可见的
在这里插入图片描述
上面代码中,foo是公开方法,内部调用了bar.call(this, baz)。这使得bar()实际上成为了当前类的私有方法

私有属性的提案
为class加了私有属性。方法是在属性名之前,使用#表示
在这里插入图片描述

13.Class 的继承

Class 可以通过extends关键字实现继承,让子类继承父类的属性和方法
在这里插入图片描述
Point是父类,ColorPoint是子类,它通过extends关键字,继承了Point类的所有属性和方法
在这里插入图片描述
上面示例中,constructor()方法和toString()方法内部,都出现了super关键字。super在这里表示父类的构造函数,用来新建一个父类的实例对象

ES6 规定,子类必须在constructor()方法中调用super(),否则就会报错。这是因为子类自己的this对象,必须先通过父类的构造函数完成塑造,得到与父类同样的实例属性和方法,然后再对其进行加工,添加子类自己的实例属性和方法。如果不调用super()方法,子类就得不到自己的this对象
在这里插入图片描述
上面代码中,ColorPoint继承了父类Point,但是它的构造函数没有调用super(),导致新建实例时报错
//
ES5 的继承机制,是先创造一个独立的子类的实例对象,然后再将父类的方法添加到这个对象上面,即“实例在前,继承在后”。
//
ES6 的继承机制,则是先将父类的属性和方法,加到一个空的对象上面,然后再将该对象作为子类的实例,即“继承在前,实例在后”。
注意,这意味着新建子类实例时,父类的构造函数必定会先运行一次。
在这里插入图片描述
上面示例中,子类 Bar 新建实例时,会输出1和2。原因就是子类构造函数调用super()时,会执行一次父类构造函数

除了私有属性,父类的所有属性和方法,都会被子类继承,其中包括静态方法

Object.getPrototypeOf()方法可以用来从子类上获取父类
在这里插入图片描述
因此,可以使用这个方法判断,一个类是否继承了另一个类

第一种情况,super作为函数调用时,代表父类的构造函数。ES6 要求,子类的构造函数必须执行一次super函数。
在这里插入图片描述
注意,super虽然代表了父类A的构造函数,但是返回的是子类B的实例,即super内部的this指的是B的实例,因此super()在这里相当于A.prototype.constructor.call(this)
在这里插入图片描述
作为函数时,super()只能用在子类的构造函数之中,用在其他地方就会报错。
上面代码中,super()用在B类的m方法之中,就会造成语法错误

第二种情况,super作为对象时,在普通方法中,指向父类的原型对象;在静态方法中,指向父类
在这里插入图片描述
上面代码中,子类B当中的super.p(),就是将super当作一个对象使用。这时,super在普通方法之中,指向A.prototype,所以super.p()就相当于A.prototype.p()
//
注意,由于super指向父类的原型对象,所以定义在父类实例上的方法或属性,是无法通过super调用的
在这里插入图片描述
p是父类A实例的属性,super.p就引用不到它
//
如果属性定义在父类的原型对象上,super就可以取到
在这里插入图片描述
上面代码中,属性x是定义在A.prototype上面的,所以super.x可以取到它的值。

ES6 规定,在子类普通方法中通过super调用父类的方法时,方法内部的this指向当前的子类实例。
super在静态方法之中指向父类,在普通方法之中指向父类的原型对象
在这里插入图片描述

//
另外,在子类的静态方法中通过super调用父类的方法时,方法内部的this指向当前的子类,而不是子类的实例
在这里插入图片描述
上面代码中,静态方法B.m里面,super.print指向父类的静态方法。这个方法里面的this指向的是B,而不是B的实例

(1)子类的__proto__属性,表示构造函数的继承,总是指向父类。
(2)子类prototype属性的__proto__属性,表示方法的继承,总是指向父类的prototype属性
在这里插入图片描述
实例的 proto 属性
子类实例的__proto__属性的__proto__属性,指向父类实例的__proto__属性
在这里插入图片描述
p2继承了p1;子类的原型的原型,是父类的原型
因此,通过子类实例的__proto__.__proto__属性,可以修改父类实例的行为
在这里插入图片描述

原型链

在这里插入图片描述
在这里插入图片描述

13. Module 的语法

一个模块就是一个独立的文件。该文件内部的所有变量,外部无法获取。

如果你希望外部能够读取模块内部的某个变量;就必须使用模块功能主要由两个命令构成:export和import。export命令用于规定模块的对外接口,import命令用于输入其他模块提供的功能。

export 暴露
在这里插入图片描述
上面代码使用as关键字,重命名变量n为m

export语句输出的接口,与其对应的值是动态绑定关系,即通过该接口,可以取到模块内部实时的值
export命令可以出现在模块的任何位置,只要处于模块顶层就可以,习惯放末尾

使用export命令定义了模块的对外接口以后,其他 JS 文件就可以通过import命令加载这个模块
在这里插入图片描述
上面代码的import命令,用于加载profile.js文件,并从中输入变量。import命令接受一对大括号,里面指定要从其他模块导入的变量名。大括号里面的变量名,必须与被导入模块(profile.js)对外接口的名称相同。
//
如果想为输入的变量重新取一个名字,import命令要使用as关键字,将输入的变量重命名
在这里插入图片描述

export default
在这里插入图片描述
使用export default时,对应的import语句不需要使用大括号

import命令会被 JavaScript 引擎静态分析,先于模块内的其他语句执行;import和export命令只能在模块的顶层,不能在代码块之中;
缺点:导致无法在运行时加载模块
//
ES2020提案 引入import()函数,支持动态加载模块
import()返回一个 Promise 对象
(1)按需加载。
在这里插入图片描述
import()方法放在click事件的监听函数之中,只有用户点击了按钮,才会加载这个模块
(2)条件加载
(3)动态的模块路径

标签:ES6,查漏,函数,对象,实例,Promise,补缺,方法,属性
来源: https://blog.csdn.net/m0_67392010/article/details/123421782