js中导出export和导入import的简单使用

export导出

• export 创建导出文件
  将变量或方法，类进行导出

// 导出
export let a = 1;

export function test() {
  console.log("I am test");
}

export class User {
  say() {
    console.log("I can say");
  }
}

• export default：先声明后导出，更安全可靠，（注意：一个js文件只能存在一个export default导出，可以有多个export），使用任意名称即可进行导入

let a = 1;

function say() {
  console.log("this is");
}

class user {
  say() {
    console.log("I can say");
  }
}

export default {
  a,
  say,
  user,
};

import导出

• 按需导入
  - import {xxx} from './'

import {a,test}  from "./chapter5-4-1.js";

console.log(a,test); // 1 ƒ test() { console.log("I am test"); }

• 全部导入
  • import * as xx from './'

import * as test from "./chapter5-4-1.js";

console.log(test.User); // class User {say() {console.log("I can say");}}

注意：

现在浏览器还没有支持export和import操作，因此需要在调用处声明模块module

<script src=" ./xxx.js" type="module"></script>