ES6中的导入导出

69 阅读1分钟

导出

单个值导出

导出普通值

export const name = 'kobe'

export flag = true

导出普通方法

export function sum (num1, num2) { return num1 + num2}

导出构造函数

export function Person(name){this.name=name}

导出class类

export class Person { constructor (name) {this.name = name} run(){}}

左右内容作为大对象导出

作为一个对象把模块中的内容先定义,后导出

const name = 'kobe' const age = 18

export {name, age}

默认导出,一个模块中只能有一个

export default name = 18

export function () {console.log('i am default export function)}

方法不用取名字

导入

将一个模块中除了默认导出的,如何导入?

import {name, age, flag, sum, Person, Person1} from './main.js'

名称与导出一致

使用:sum(1,2) new Person('kobe')

*导入

如果太多,也可以作为全部导入(不包含默认导出export default)

impirt * as info from './main.js

使用: info.sum(1,2) info.Person('kobe')

默认导出的,如何导入?

import newName from './a.js'

newName随便取的名字,对应默认导出的变量

前提

涉及导入导出语法的,需要加type="module"

image.png