三个示例搞定Es6开发中 常用的 import 和 export

未写注释的导入与导出变量名一致

示例 1

引入 （解构式）

// 引入通过解构拿到数据
import {a,test,getData,data,getList}from './test.js'
console.log(a)
console.log(test)
console.log(getData)
console.log(data)
console.log(getList)

导出

// test.js
let data = {name:'lqUp'}
let getList = ()=>{console.log('获取列表数据')}
// 多个导出
export{data,getList}

// 单个导出
export const a = 123

export let test=()=>{console.log('test函数')}

export function getData(){console.log('获取data')}

示例2

引入

// 直接写对象是 export default 导出的数据
import obj from'./test.js'
console.log(obj)

导出

// test.js
let obj ={
    name:'lq',
    age:23
} 
export default obj

示例3

引入所有

import * as allData from'./test.js'
console.log(allData.default) // test.js 导出的 obj
console.log(allData.a) 
console.log(allData.test) 

导出

// test.js
let obj ={
    name:'lq',
    age:23
} 
let test =()=>{console.log('test函数')}
export const a = 10
export default obj
export{
    test
}

综合引入

引入

import obj,{a,test}   from'./test.js'
console.log(obj) 
console.log(a) 
console.log(test) 

导出

// test.js
let obj ={
    name:'lq',
    age:23
} 
let test =()=>{console.log('test函数')}
export const a = 10
export default obj
export{
    test
}