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 function对象那些迷惑分析
Oct 24 Javascript
使用impress.js制作幻灯片
Sep 09 Javascript
Bootstrap每天必学之js插件
Nov 30 Javascript
浅析使用BootStrap TreeView插件实现灵活配置快递模板
Nov 28 Javascript
JavaScript中英文字符长度统计方法示例【按照中文占2个字符】
Jan 17 Javascript
浅谈vue路径优化之resolve
Oct 13 Javascript
解决easyui日期时间框ie的兼容的问题
Mar 01 Javascript
详解npm 配置项registry修改为淘宝镜像
Sep 07 Javascript
详解ES6 Promise对象then方法链式调用
Oct 20 Javascript
基于vue通用表单解决方案的思考与分析
Mar 16 Javascript
vue+element树组件 实现树懒加载的过程详解
Oct 21 Javascript
Vant 中的Toast设置全局的延迟时间操作
Nov 04 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
基于PHP字符串的比较函数strcmp()与strcasecmp()的使用详解
2013/05/15 PHP
关于crontab的使用详解
2013/06/24 PHP
PHP实现对站点内容外部链接的过滤方法
2014/09/10 PHP
详解PHP匿名函数与注意事项
2016/03/29 PHP
form表单传递数组数据、php脚本接收的实例
2017/02/09 PHP
iframe异步加载实现点击左边菜单加载右边内容实例讲解
2013/03/04 Javascript
JS+ACTIVEX实现网页选择本地目录路径对话框
2013/03/18 Javascript
ScrollDown的基本操作示例
2013/06/09 Javascript
JavaScript中prototype为对象添加属性的误区介绍
2013/10/15 Javascript
jQuery修改class属性和CSS样式整理
2015/01/30 Javascript
jQuery简单实现仿京东分类导航层效果
2016/06/07 Javascript
JavaScript中的this陷阱的最全收集并整理(没有之一)
2017/02/21 Javascript
Vue学习笔记进阶篇之多元素及多组件过渡
2017/07/19 Javascript
解决在vue项目中,发版之后,背景图片报错,路径不对的问题
2018/03/06 Javascript
React降级配置及Ant Design配置详解
2018/12/27 Javascript
微信小程序可滑动周日历组件使用详解
2019/10/21 Javascript
微信小程序 (地址选择1)--选取搜索地点并显示效果
2019/12/17 Javascript
vue 点击其他区域关闭自定义div操作
2020/07/17 Javascript
解决vue watch数据的方法被调用了两次的问题
2020/11/07 Javascript
vue组件中传值EventBus的使用及注意事项说明
2020/11/16 Javascript
RC4文件加密的python实现方法
2015/06/30 Python
Python实现获取邮箱内容并解析的方法示例
2018/06/16 Python
python使用requests模块实现爬取电影天堂最新电影信息
2019/04/03 Python
python利用tkinter实现屏保
2019/07/30 Python
python代码xml转txt实例
2020/03/10 Python
Python dict的常用方法示例代码
2020/06/23 Python
Python Selenium实现无可视化界面过程解析
2020/08/25 Python
python如何绘制疫情图
2020/09/16 Python
HTML5自定义视频播放器源码
2020/01/06 HTML / CSS
美国五金商店:Ace Hardware
2018/03/27 全球购物
经典的班主任推荐信
2013/10/28 职场文书
经销商会议欢迎词
2014/01/11 职场文书
科长竞争上岗演讲稿
2014/05/12 职场文书
vue点击弹窗自动触发点击事件的解决办法(模拟场景)
2021/05/25 Vue.js
怎么禁用Windows 11快照布局? win11不使用快照布局的技巧
2021/11/21 数码科技
Vue 打包后相对路径的引用问题
2022/06/05 Vue.js