export与import的基本使用

ES6模块化主要有两个核心：导出export和导入import

export

第一种写法

export let name = 'ming'
export let sex = '男'
export let age = 18
export const getA = () => {
  return 'A'
}
// export function getA () {
//   return 'A'
// }

第二种写法

let name = 'ming'
let sex = '男'
let age = 18
const getA = () => {
  return 'A'
}

export { name, sex, age, getA }

对应的导入

import { sex, age, name, getA } from './constant.js'

export default

export default为模块指定默认输出，不需要知道所要加载模块的变量名

let name = 'ming'
export default name

可以自己命名

import name from './constant.js'
import name1 from './constant.js'

console.log(name, name1) // ming ming

注意：export default在同一个模块中，不允许同时存在多个

import

基本导入

import { sex, age, name, getA } from './constant.js'

可以用 as 重新命名

import { sex as xingbie, age, name, getA } from './constant.js'

console.log(xingbie) // 男

可以用’ * '导入模块中所有的export变量

import * as userInfo from './constant.js'

console.log(userInfo.sex, userInfo.age, userInfo.name, userInfo.getA()) // 男 18 ming A