Module

一、为何会有Module?

答： 由于js以前一直没有模块体系，也就是Module体系。

 

二、在ES6以前，有哪些模块加载方案？

答：有两种，CommonJS和AMD。

 

三、两种加载方案的区别是什么？

答：CommonJS用于服务器，AMD用于浏览器。

 

四、Module的设计思想是什么？

答：静态化。

 

五、什么是静态化？

答：在编译的时候就能肯定模块的依赖关系，以及输入和输出的变量。

 

六、Module是对象吗？

答：不是。运行时加载的才是对象。

 

七、默写静态加载与运行时加载的代码。

答：静态加载加载的不是对象，而是从模块里面加载了相应的方法，所以它的效率要比运行时加载高。运行时加载加载的是一个对象，只有在运行时才能获得这个对象，从而获得这个对象的方法。

 import {start} from './fs.js' //静态加载 
 const {start} = require('./fs.js') //运行时加载

 

 

八、export和import命令分别是作什么的？

答：export命令用于规定模块的对外接口，import命令用于输入其余模块提供的功能。

 

九、使用模块内部变量的时候须要注意什么？

答：若是外部想要读取模块内部的变量，必须使用export命令，并用花括号包括。花括号表示这是一个对外的接口。

 

十、export命令能够输出什么？

答： 变量，类，和方法。

 

十一、给下面两句代码找错。

export 1；

答：错误。不能直接输出1，由于它没有提供对外的接口。

 

var m = 1;

export m;

答：错误。这种写法经过变量直接输出1, 1只是一个值，不是一个接口，仍然是没哟提供对外的接口。

 

十二、export的位置有要求吗？

答：export能够在模块的任何位置，只要处在模块的顶层就能够。可是不能处在块级做用域。

 

------import命令分割线--------

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

1、export命令

暴露的能够是变量，函数和类，语法以下：

let name="Alice";
let age=18;
let year=2009;
let person={
    name:"Tony",
    age:20
}

export {name,age,year};

export{person as student,person as teenager}

-

（1）暴露的对象必须加{}，它表示暴露的是一个接口。若是不加的话，它表示暴露的是一个值，这样就会报错。好比下面这段代码，就是错误的。

var name="Alice";
export name;

-

（2）as关键字，能够给暴露的对象换名字，同一个对象能够屡次使用as关键字，用不一样的名字暴露出去。

（3）export命令必须处于模块的顶层，位置无所谓。

（4）export暴露的对象是动态绑定关系，若是发生变化，外部引用也会变化。

 

2、import命令

语法以下：

import {name,age,year as born} from "./main";

  import有如下几个特色：

（1）引用的文件能够省略.js后缀。

（2）可使用as关键字。

（3）import具备变量提高的效果，因此放在引用的对象后面也无所谓。

（4）ES6的import命令最好不要跟CommonJS模块的require命令放在一块。由于import会变量提高，会最先解析。

（5）import接收对象是否用花括号括起来，要看对象的暴露方式。默认输出就不用加花括号，若是是export，就要加花括号。

 

 3、export default命令

import命令，在引用的时候必须得知道这个文件中所暴露的全部变量的名字。若是我不知道export变量的名字，怎么引用呢？就是在暴露的时候用export default命令，该命令为模块指定默认输出。

暴露：

export default function onlyOne(){
    console.log("只能用一次");
}

引用：

import only from "./main";
only();

 export default命令的特色：

（1）export default命令在一个模块中只能使用一次，由于是默认暴露值，因此默认的输出值只能是惟一的嘛。

（2）引用的时候不须要知道暴露的对象名，能够给他起随意的名字。

（3）引用的时候不须要加花括号。

 

-

实际实践：

Node是JS语言的服务器运行环境，他对ES6的支持度很高。虽然个人电脑上也安装了Node.js环境，可是这个倒霉孩子，电脑居然不支持ES6的Module模块，虽然是为啥他不支持我也不明白。但这也就意味着上面的前两个命令我都无法用。

 

看了看书，Node不支持ES6模块的缘由我彷佛知道了。

Node自己带有支持模块的功能，他支持CommonJS模块。

模块分为CommonJS里的模块与ES6里面的模块，这两种模块是不同的东西。export命令和import命令是ES6里面的模块。 而CommonJS模块与ES6模块的功能不兼容。

 -

CommonJS模块与ES6模块的区别是什么呢？

（1）CommonJS暴露和加载的是一个对象，而ES6只是暴露和加载了一个接口。

（2）上面这个区别致使了，CommonJS的引用是静态的，而ES6的引用是动态绑定的。参见上面export命令的第（4）条。

 

- 

在电脑不支持ES6Module的状况下，想要引用暴露的文件怎么办呢？就用CommonJS的模块。

暴露：module.exports={}方法

暴露的能够有变量、对象和方法。

let year=2009;
let person={
    name:"Tony",
    age:20
}
let test=function(){
    console.log("It is a function!")
}
module.exports={year,person,test};

 -

引入：let 对象名=require（“相对路径”）;

引入的info是一整个对象。这种引入是CommonJS模块里的功能。

var info = require("./main.js");
console.log('引入文件', info);
info.test();

 -

注意：上面的这两种方法都不能使用as关键字。