JavaScript中import用法总结


Posted in Javascript onJanuary 20, 2019

import是用于将某个模块中导出的函数或对象、初始值导入到另一个模块中的语法。

如下所示

import {模块名称} from "需要导入模块的路径名"

如何使用import?

该模块有default模块和named(命名)模块。

我们首先加载default export的模块和named export的模块

import {ModuleA, ModuleB} from "modules"; 

import Default from 'modules2';

在第一行中,我们从modules这个文件导入名为Module A和Module B的这两个named模块。

在第二行中,我们从modules 2这个文件中导入default模块。

执行模块export

要将函数,对象,原始值导出为模块,需要使用export。

我们来看具体示例

将其导出为默认模块

// alert.js

export default function () {

  alert("default module called!");

};

命名导出

// utils.js

export function sum(x, y, z) {

  return x+y+z;

}

 

export function multiply(x, y) {

  return x*y;

}

我们能够导出名为sum和multiply的模块。

可以通过如下调用来使用该函数

import { sum, multiply } from 'utils'; 

console.log(sum(1, 2, 3));

console.log(multiply(5, 8));

执行结果如下

->6

->40
Javascript 相关文章推荐
javascript 禁止复制网页
Jun 11 Javascript
让低版本浏览器支持input的placeholder属性(js方法)
Apr 03 Javascript
前端开发过程中浏览器版本的两种判定方法
Oct 30 Javascript
jquery ajax属性async(同步异步)示例
Nov 05 Javascript
node.js中的fs.rmdirSync方法使用说明
Dec 16 Javascript
javascript截图 jQuery插件imgAreaSelect使用详解
May 04 Javascript
解决同一页面中两个iframe互相调用jquery,js函数的方法
Dec 12 Javascript
JavaScript中的this陷阱的最全收集并整理(没有之一)
Feb 21 Javascript
Javascript ES6中数据类型Symbol的使用详解
May 02 Javascript
Angular2管道Pipe及自定义管道格式数据用法实例分析
Nov 29 Javascript
vuex提交state&&实时监听state数据的改变方法
Sep 16 Javascript
vue 实现动态路由的方法
Jul 06 Javascript
如何优雅的在一台vps(云主机)上面部署vue+mongodb+express项目
Jan 20 #Javascript
js序列化和反序列化的使用讲解
Jan 19 #Javascript
vue-router传参用法详解
Jan 19 #Javascript
vue-router实现嵌套路由的讲解
Jan 19 #Javascript
vue-router实现编程式导航的代码实例
Jan 19 #Javascript
vue数据操作之点击事件实现num加减功能示例
Jan 19 #Javascript
vue-router命名路由和编程式路由传参讲解
Jan 19 #Javascript
You might like
discuz Passport 通行证 整合笔记
2008/06/30 PHP
PHP跨平台获取服务器IP地址自定义函数分享
2014/12/29 PHP
PHP cURL初始化和执行方法入门级代码
2015/05/28 PHP
PHP API接口必备之输出json格式数据示例代码
2017/06/27 PHP
PHP实现的登录页面信息提示功能示例
2017/07/24 PHP
javascript 导出数据到Excel(处理table中的元素)
2009/12/18 Javascript
Extjs列表详细信息窗口新建后自动加载解决方法
2010/04/02 Javascript
Javascript 垃圾收集机制介绍理解
2013/05/14 Javascript
红米手机抢购的js代码
2014/03/10 Javascript
Javascript的setTimeout()使用闭包特性时需要注意的问题
2014/09/23 Javascript
在JavaScript中操作时间之getMonth()方法的使用
2015/06/10 Javascript
JavaScript实现设计模式中的单例模式的一些技巧总结
2016/05/17 Javascript
浅谈javascript中的constructor
2016/06/08 Javascript
jQuery实现打开页面渐现效果示例
2016/07/27 Javascript
ES6中的数组扩展方法
2016/08/26 Javascript
Node.js如何响应Ajax的POST请求并且保存为JSON文件详解
2017/03/10 Javascript
jQuery选择器之子元素选择器详解
2017/09/18 jQuery
Node.js中Bootstrap-table的两种分页的实现方法
2017/09/18 Javascript
js实现拖拽元素选择和删除
2020/08/25 Javascript
[01:01]青春无憾,一战成名——DOTA2全国高校联赛开启
2018/02/25 DOTA
Python random模块常用方法
2014/11/03 Python
Python创建模块及模块导入的方法
2015/05/27 Python
python 读写txt文件 json文件的实现方法
2016/10/22 Python
Python迭代器与生成器用法实例分析
2018/07/09 Python
Python3 单行多行万能正则匹配方法
2019/01/07 Python
pyqt5利用pyqtDesigner实现登录界面
2019/03/28 Python
使用Python给头像戴上圣诞帽的图像操作过程解析
2019/09/20 Python
Python基础之函数基本用法与进阶详解
2020/01/02 Python
对tensorflow中cifar-10文档的Read操作详解
2020/02/10 Python
Python函数参数定义及传递方式解析
2020/06/10 Python
远程Wi-Fi宠物监控相机:Petcube
2017/04/26 全球购物
Topman美国官网:英国著名的国际平价时尚男装品牌
2017/12/22 全球购物
物业总经理助理岗位职责
2014/06/29 职场文书
幼儿园见习报告
2014/10/30 职场文书
承诺函格式模板
2015/01/21 职场文书
梳理总结Python开发中需要摒弃的18个坏习惯
2022/01/22 Python