ES6——进阶

import export

//假设我们有两个js文件: index.js和content.js,现在我们想要在index.js中使用content.js返回的结果,我们要怎么做呢?

//content.js
export default 'A cat'    
export function say(){
    return 'Hello!'
}    
export const type = 'dog' 

//index.js
import animal, { say, type } from './content'  
let says = say()
console.log(`The ${type} says ${says} to ${animal}`)  //The dog says Hello to A cat

//修改变量名
//此时我们不喜欢type这个变量名,因为它有可能重名,所以我们需要修改一下它的变量名。在es6中可以用as实现一键换名。
import animal, { say, type as animalType } from './content'  
let says = say()
console.log(`The ${animalType} says ${says} to ${animal}`)  
//The dog says Hello to A cat

//模块的整体加载
//除了指定加载某个输出值,还可以使用整体加载,即用星号(*)指定一个对象,所有输出值都加载在这个对象上面。
import animal, * as content from './content'  
let says = content.say()
console.log(`The ${content.type} says ${says} to ${animal}`)  
//The dog says Hello to A cat

//上面的content.js一共输出了三个变量(default, say, type),假如我们的实际项目当中只需要用到type这一个变量,
//其余两个我们暂时不需要。我们可以只输入一个变量(目前无论是webpack还是browserify都还不支持这一功能):
import { type } from './content'

希望更全面了解es6伙伴们可以去看阮一峰所著的电子书ECMAScript 6入门

你可能感兴趣的:(jquery,ES6,module)