ES6模块化之export和import的用法笔记
程序员文章站
2022-03-09 07:57:12
...
import 导入模块
基本语法
import 标识符 from "本地模块路径"
import 语法声明用于从已导出的模板、脚本中导入函数、对象、指定文件(或模块)的原始值。
分为命名式导入(名称导入)和 定义式导入(默认导入)。
import的语法跟require不同,而且import必须放在文件的最开始,且前面不允许有其他逻辑代码,这和其他所有编程语言风格一致(如Java 、Python[最相似]等)。
可以导入多个被选中的对象、变量,用逗号隔开
import {file} from “my_module”;
import {file1, fun1} from "my_module";
通过 * 号, 可以导入模块中的全部属性和方法。当导入模块全部内部时, 就是将导出模块(‘my_module.js’)所有的导出绑定内容, 插入到当前模块(‘myModule’)的作用域中:
import * as myModule from “my_module”;
有时候,导出的名称会与使用的其它名称产生冲突, 可以用as 重命名
// 要同时导入两者,我们至少要将其中一个的名称改掉。
import {file as file1} from "my-module";
import {file as file2 } from "my-module";
可同时导入多个成员并使用别名
import尽量用相对路径!浏览器会按照相对路径去解析绝对路径导致报错
export导出
一个模块就是一个独立的文件, 该文件内部的所有变量,外部无法获取,export关键字用于暴露数据,暴露给其它模块。
使用方式是,可以将export放在任何 变量、函数或类声明的前面,从而将他们从模板导出。
推荐在文件末列出所有导出的成员。
export{ class , function , name}
//也可以这样:在定义它时没有马上导出它,不必总是导出声明,可以导出引用,下面这段代码也可行
function sum(num1,num2){
return num1+num2;
}
// 之后将其导出
export sum;
零零写代码像菜虚困
出处
上一篇: Spring Boot 第二天
下一篇: 职工学历管理系统
推荐阅读
-
ES6使用export和import实现模块化的方法
-
ES6新特性:使用export和import实现模块化详解
-
ES6模块化的import和export用法方法总结
-
JS/TS的import和export用法小结
-
前端笔记之React(六)ES6的Set和Map&immutable和Ramda和lodash&redux-thunk
-
探索 模块打包 exports和require 与 export和import 的用法和区别
-
ES6中export和import详解(export定义了模块的对外接口后,其他JS文件就可以通过import来加载这个模块)
-
ES6模块化的import和export用法方法总结
-
JavaScript ES6中export、import与export default的用法和区别
-
ES6新特性:使用export和import实现模块化详解