es6语法特性进阶（8）

Babel

到目前2017年为止，也不是所有的浏览器都支持ES6的特性。
所以我们需要把ES6转换成ES5的代码，就要用到所谓的转码器。Babel就是目前使用最广泛的把ES6代码转换成ES5及以前代码的转码器。
有了babel我们就可以放心的使用ES6的最新的语法，而不用担心浏览器不支持了！！！
为了方便使用，我直接使用webstorm的filewatcher功能

安装Babel
首先要保证电脑上已经安装了npm
使用如下命令就可以安装babel安装(我们这里使用的是全局安装)：

1	npm install -g babel-cli

安·babel-present-env

1	npm install babel-preset-env --save-dev

自动转换为es5代码

1	js文件中的es6代码会自动转换为es5代码

Moudle
JavaScript 采用 “共享一切” 的代码加载方式是该语言中最令人迷惑且容易出错的方面之一。
其它语言使用包（package）的概念来定义代码的作用范围，然而在 ECMAScript 6 之前，每个 JavaScript 文件中定义的内容都由全局作用域共享。
当 web 应用变得复杂并需要书写更多的 JavaScript 代码时，上述加载方式会出现命名冲突或安全方面的问题。
ECMAScript 6 的目标之一就是解决作用域的问题并将 JavaScript 应用中的代码整理得更有条理，于是模块应运而生。
很不幸的是：目前，所有的浏览器都还不能支持ES6的模块。只能通过第三方的工具转成ES5的代码;

什么是模块
模块是指采取不同于现有加载方式的 JavaScript 文件（与 script 这种传统的加载模式相对）。这种方式很有必要，因为它和 script 使用不同的语义：
模块中的代码自动运行在严格模式下，并无任何办法修改为非严格模式。
模块中的顶级（top level）变量不会被添加到全局作用域中。它们只存在于各自的模块中的顶级作用域。
模块顶级作用域中的 this 为 undefined 。
模块不允许存在 HTML 式的注释（JavaScript 历史悠久的遗留特性）。
模块必须输出可被模块外部代码使用的相关内容。
一个模块可以引入另外的模块。

导出模块
可以使用 export 关键字来对外暴露模块中的部分代码。
一般情况下，可以在任何变量，函数或类声明之前添加这个关键字来输出它们，
看下面的代码:
声明一个文件：a.js 代码如下:

// 输出变量
export var color = "red";
export let name = "Nicholas";
export const magicNumber = 7;
// 输出函数
export function sum(num1, num2) {
    return num1 + num1;
}
// 输出类
export class Rectangle {
    constructor(length, width) {
        this.length = length;
        this.width = width;
    }
}
// 该函数没有使用export关键字   所以该函数是模块私有的。也就是说只能在当前文件访问，出了这个文件就访问不到
function subtract(num1, num2) {
    return num1 - num2;
}
// 定义一个函数...
function multiply(num1, num2) {
    return num1 * num2;
}
// 可以把这个函数的引用导出。  和导出函数是一样的。
export { multiply };

注意：在上面的代码中，除了exprot关键字，其他和我们以前的代码没有任何不同。

引入模块
一旦有了导出内容的模块，则可以在另一个模块中使用import关键字来获取他们。
引入模块的语法：

1	import { identifier1, identifier2 } from "./a.js";

import 之后的花括号表示从模块中引入的绑定。from 关键字表示从哪个模块引入这些绑定。模块由一个包含模块路径的字符串表示（称为模块指示符，module sepcifier）;

访客的ip和所在地址：访问时间: 当前时间: