ES6 的模块自动采用严格模式,不管你有没有在模块头部加上"use strict"。
顶层的this指向undefined,即不应该在顶层代码使用this。
严格模式主要有以下限制:
with
语句delete prop
,会报错,只能删除属性delete global[prop]
eval
不会在它的外层作用域引入变量 eval
和arguments
不能被重新赋值arguments.callee
arguments.caller
fn.caller
和fn.arguments
获取函数调用的堆栈protected
、static
和interface
)export
除了输出变量,还可以输出函数或类(class),还可以通过 as
更改输出名。let age = 18;let obj ={name: "Owen"};let multiply = (x, y) => x * y;export { age, obj as monicker, //改变量名 multiply}
let num =2;export num ; //error 因为实际输出的是一个值,须放在对象中 {num}exprot 2 //error 输出的是值 而不是一个对外接口 => 须改成 export let num =2;
let foo = (r) => r++; let fn = () => export default foo; //error
export default
export default
后面不能有 变量声明的关键字export default
,import 就不需要使用 {}
,只需要自定义一个变量即可export default var a=1; //errorexport default obj ={name:'Owen'};//orlet num = 1;let obj1 = {name:"Owen"};export default {num, obj1}
import
from
导入模块, 通过 as
修改导入接口, 接口不能重新赋值,但对象可以修改内部属性或方法。import {age, monicker as obj, multiply} from './preson.js'; age = 0 ; //error obj.feature = "handsome Owen"; console.log(age, obj。name, multiply(1,2)) import * as preson from "./preson.js" //引入所有接口
import
具有提升的效果,会提升到作用域顶部执行,同一个模块多次引入只执行一次,并且不能再局部作用域中引入。multiply(2,2); //4import {age, monicker as obj, multiply} from './preson.js';if (true){import {age, monicker as obj, multiply} from './preson.js'; //error}
import()
import()
函数,完成动态加载。require
类似,不同之处在于 import()
是同步加载 require()
是异步加载const path =import('path');
我们可以利用 import()
进行按需加载,动态加载,按条件加载:
```javascript import('./a.js') .then(r => { r.fn(); }) .catch(error => { /* Error handling */ }) if( x == 1){ const path =import('path'); } ```
如果想同时加载多个模块,可以采用下面的写法
Promise.all([ import('./a.js'), import('./b.js'), import('./c.js'),]) .then(([a,b,c]) => { // ... }).catch(error => { /* Error handling */ })
联系客服