JS和在Vue项目中的import和export

后端的工程化项目推动了前端的工程化进程，对于前端而言，慢慢的也开始有了工程化的概念，那么前端工程化必然需要使用到import和export

import和export最本质的作用就是导入和导出 （文件）

为什么是导入导出文件呢？
import和export之间是一体的，下面以在exampleModule.js为例

对于export，有两种，一种是默认导出，一种是固定导出，那么对应import即是对应默认 导入和默认导出：

export default a1    
import s1 from './exampleModule.js'   

对于上面的s1和a1其实是相等的，使用的是深拷贝，不管a1是什么，s1都拷贝了一份相同的

另外一种就是固定导出和固定导入了：

export {request}
import {request} from './exampleModule.js'

这种就是没有关键字default的，只要有default，那么都是默认导入和默认导出

对于导入，还有一种动态导入和不导入任何对象（仅作为副作用而导入一个模块），对于动态导入，其实就是按需导入（需要异步或者动态构建使用）：

import("/modules/my-module.js").then((module) => {
  // Do something with the module.
});

而对于仅作为副作用而导入一个模块，这种方式在vue工程中非常常见，比如在main.js文件中之间导入：

import "/modules/my-module.js";

相当于直接运行这个文件，将该文件的对象挂载在vue实例上，从而可以全局使用

具体文件示例

function hello() {
    console.log('hello,nodejs!')
}

let name='jeank'
console.log(name+ "  "+new Date())

export default {  //default导出时，import直接是一个整体，这种方式很常用
    name,hello
}

function hello() {
    console.log('hello,nodejs!')
}

let name='jeank'
console.log(name+ "  "+new Date())

export  {  //直接导出时，import导入必须解构 import {name,hello} 或者 import * as obj1
    name,hello
}

import obj from './example1.js'

console.log(obj)
obj.hello()
console.log(obj.name)

console.log('------------------')


import * as obj1  from './example1-1.js'
import {hello,name} from './example1-1.js'
console.log(obj1)
console.log(obj1.hello())
console.log(obj1.name)
console.log(hello())
console.log(name)