ES6-Module

由于浏览器不支持module所以需要先安装webpack打包方可使用module

1.安装webpack

npm install webpack@2.4.1 -g

2.使用webpack打包js文件

webpack  file1.js file2.js

这样js就可以使用webpack了,webpack有很多其它的用法,由于只是为了学习module语法所以不再介绍其它用法

1.导出变量

export var firstName='Michael';

export var lastName='Jackson';

export var year=1958;

使用并弹框:import {firstName, lastName, year} from './2.js';

alert(firstName);

2.导出函数或对象

export function multiply(x, y) {

    return x * y;

  };

export var foo = {

    name:"foo"

}

使用并弹框:import {multiply} from './2.js';

alert(multiply(2,2));

3.使用as对导出函数重命名

functionv1(){...}

functionv2(){...}

export{

v1 as streamV1,

v2 as streamV2,

v2 as streamLatestVersion};

4.加载整个模块

2.js定义了两个方法

export function area(radius) {

    return  radius * radius;

  }

  export function circumference(radius) {

    return 2 *radius;

  }

使用并弹框:import * as circle from './2.js';

alert(circle.area(4));

5.使用export default命令(可以不使用{})

export default function(){

console.log('foo');

}

使用import customName from'./2.js';

customName(); // 'foo'

6.使用export default输出多个

var foo = {

    name:"foo"

}

var bar = {

    name:"bar"

}

function baz(){

    var name = "baz"

    console.log(name)

}

export default {

    foo,

    bar,

    baz,

    get() {

        console.log("get")

    }

}

使用import user from './2.js';

console.log(user.foo);

console.log(user.bar);

console.log(user.baz());

console.log(user.get());

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。