参考 点击跳转 http://es6.ruanyifeng.com/#docs/module
1.export命令
变量
// 写法一
export var m = 1;
// 写法二
var m = 1;
export {m};
// 写法三
var n = 1;
//重新取个名字
export {n as m};
方法
// 正确
export function f() {};
// 正确
function f() {}
export {f};
类
export class Singer {
constructor({id, name}) {
this.id = id
this.name = name
}
}
对应的import导入注意事项:
import {xxx,xxx,xxx,xx} from './xxx';
大括号里面的变量名,必须与被导入模块对外接口的名称相同。
2.export default 命令
使用import命令的时候,用户需要知道所要加载的变量名或函数名,否则无法加载。但是,用户肯定希望快速上手,未必愿意阅读文档,去了解模块有哪些属性和方法。为了给用户提供方便,让他们不用阅读文档就能加载模块,就要用到export default命令,为模块指定默认输出。
变量
//正是因为exportdefault命令其实只是输出一个叫做default的变,所以它后面不能跟变量声明语句。
// 正确
export default 42;
// 正确
var a = 1;
export default a;
方法
//其他模块加载该模块时,import命令可以为该匿名函数指定任意名字。
// 正确
export default function () {
console.log('foo');
}
export default function foo() {
console.log('foo');
}
// 或者写成
function foo() {
console.log('foo');
}
export default foo;
类
export default class Singer {
constructor({id, name}) {
this.id = id
this.name = name
}
}
这时import命令后面,不使用大括号。:
import xxxxx from xxxx
3.import
如果想为输入的变量重新取一个名字,import命令要使用as关键字,将输入的变量重命名。
import { oldname as newname} from './xxxx';
注意,import命令具有提升效果,会提升到整个模块的头部,首先执行。
import语句会执行所加载的模块,因此可以有下面的写法。
import 'lodash';
总结
如果 想定义的方法或者变量很多用export。 只有一个的话用 export default.
例子:
export function getdoctorlist(word) {
return new Promise((resovle,reject)=>{
ajax.post('/doctor/list',word)
.then(body=>{
resovle(body)
})
.catch((err)=>{
hasErr(err)
reject(err)
})
});
}
export function getdoctorpastlist() {
return new Promise((resovle,reject)=>{
ajax.post('/doctorPast/list')
.then(body=>{
resovle(body)
})
.catch((err)=>{
hasErr(err)
reject(err)
})
});
}
//import {getdoctorlist,getdoctorpastlist} from 'xxx'
// 或者import * as api from './api/api'
export const SET_TITLEONE = 'SET_TITLEONE'
export const SET_TITLETWO = 'SET_TITLETWO'
//import {SET_TITLEONE ,SET_TITLETWO } from './mutation-types'
//或者import * as types from './mutation-types'
//