js的import 与export详解

ES6

1.export default

其他模块加载该模块时,import命令可以为该匿名函数指定任意名字。

如:

import Vue from ‘vue‘

vue里面的第三方模块都是用了这个

使用import 不带{ }如上,一定要用export default 导出,不能用export导出;

显然,一个模块只能有一个默认输出,因此export default命令只能使用一次。

export defalut 只能用import boy from ‘模块路径‘,不能带{}

所以,import命令后面才不用加大括号,因为只可能唯一对应export default命令。

输出一个叫做default的变量,对外借口就为default

2. export

export 导出的一定是类对象的像是

如:

export var name = "liuyang"
或
var boy = ‘liuyang‘
export {boy}
或
var boy = ‘liuyang‘
var gril = ‘guo‘
export {boy, girl}

这时在导入时也一定要import {boy} from ‘模块路径‘

export本质是暴露出对外的接口,它们的实质是,在接口名与模块内部变量之间,建立了一一对应的关系。

3. import

使用export命令定义了模块的对外接口以后,其他 JS 文件就可以通过import命令加载这个模块。

如:

import  {boy} from ‘模块路径‘

大括号里面的变量名,必须与被导入模块对外接口的名称相同,

import后面的from指定模块文件的位置,可以是相对路径,也可以是绝对路径,.js后缀可以省略。

如果只是模块名,不带有路径,那么必须有配置文件,告诉 JavaScript 引擎该模块的位置。

Node 

1.exports

如:

var boy = ‘liuyang‘
exports.boy = boy

exports.‘接口名‘ = 对象

导入时,用var ex = require(‘模块路径‘),加载模块就可以用ex.boy调用接口

2.module.exports

用于直接导出对象可以直接用

//-------test.js------
var boy = ‘liuyang‘
module.exports = boy

------------main.js-------
var b = require(‘./test‘)
console.log(b)
//------结果liuayang----

原文地址:https://www.cnblogs.com/jack-liu6/p/9092684.html

时间: 2024-10-04 05:31:59

js的import 与export详解的相关文章

RequireJS-CommonJS-AMD-ES6 Import/Export详解

RequireJS-CommonJS-AMD-ES6 Import/Export详解 为什么起了一个这个抽象的名字呢,一下子提了四个名词分别是:RequireJS,CommonJS,AMD,ES6,答案是因为现实很骨感,我们必须很勇敢才能正视这一段悲催的往事.如今的JavaScript平台正值如日中天,大家可能会忽略他的过去和弊端,这些弊端中一直被人诟病的就是JavaScript的包管理,比如类似Java中的import,其实理论上来讲这种基本元素的缺失大大的阻碍了人们对一种语言的认可,认为他难

js的offsetParent属性用法详解

js的offsetParent属性用法详解:此属性是javascript中较为常用的属性,对于它的良好掌握也是非常有必要的,下面就通过代码实例介绍一下它的用法,希望能够给需要的朋友带来一定的帮助.一.基本介绍:此属性可以返回距离指定元素最近的采用定位(position属性值为fixed.relative或者absolute)父级元素,如果父级元素中没有采用定位的元素,则返回body对象的引用.语法结构: obj.offsetParent 二.代码实例: <!DOCTYPE html> <

js对象浅拷贝和深拷贝详解

js对象浅拷贝和深拷贝详解 作者:i10630226 字体:[增加 减小] 类型:转载 时间:2016-09-05我要评论 这篇文章主要为大家详细介绍了JavaScript对象的浅拷贝和深拷贝代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下 本文为大家分享了JavaScript对象的浅拷贝和深拷贝代码,供大家参考,具体内容如下 1.浅拷贝 拷贝就是把父对像的属性,全部拷贝给子对象. 下面这个函数,就是在做拷贝: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 var

js 中中括号,大括号使用详解

一.{ } 大括号,表示定义一个对象,大部分情况下要有成对的属性和值,或是函数.如:var LangShen = {"Name":"Langshen","AGE":"28"};上面声明了一个名为"LangShen"的对象,多个属性或函数用,(逗号)隔开,因为是对象的属性,所以访问时,应该用.(点)来层层访问:LangShen.Name.LangShen.AGE,当然我们也可以用数组的方式来访问,如:Lang

JS中的event 对象详解

JS中的event 对象详解 JS的event对象 Event属性和方法: 1. type:事件的类型,如onlick中的click: 2. srcElement/target:事件源,就是发生事件的元素: 3. button:声明被按下的鼠标键,整数,1代表左键,2代表右键,4代表中键,如果按下多个键,酒把这些值加起来,所以3就代表左右键同时按下:(firefox中 0代表左键,1代表中间键,2代表右键) 4. clientX/clientY:事件发生的时候,鼠标相对于浏览器窗口可视文档区域的

Node.js开发入门—Stream用法详解

Stream是Node.js中非常重要的一个模块,应用广泛.一个流是一个具备了可读.可写或既可读又可写能力的接口,通过这些接口,我们可以和磁盘文件.套接字.HTTP请求来交互,实现数据从一个地方流动到另一个地方的功能. 所有的流都实现了EventEmitter的接口,具备事件能力,通过发射事件来反馈流的状态.比如有错误发生时会发射"error"事件,有数据可被读取时发射"data"事件.这样我们就可以注册监听器来处理某个事件,达到我们的目的. Node.js定义了R

js 面向对象日历实现原理详解

对于前端开发来说,日历空间在网站里应用的很多,比如:填写表单时,是选取一下事件了--等等.下面就来分析一下怎么用js来写一个自己万年历. 在没有开始之前,我们是先弄明白是什么原理,要通过几个步骤来实现. 第一,我们的知道某一个月的某第一天是星期几. 第二,我们得知道某一个月有一共有几天, 只要有了这两部就可以循环出来了,下面看一下代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http

js showModalDialog参数的使用详解(转)

js showModalDialog参数的使用详解_javascript技巧_脚本之家 http://www.jb51.net/article/45281.htm 本篇文章主要是对js中showModalDialog参数的使用进行了详细的分析介绍,需要的朋友可以过来参考下,希望对大家有所帮助 基本介绍: showModalDialog()              (IE 4+ 支持)showModelessDialog()           (IE 5+ 支持)window.showModa

export详解

linux下export命令详解 export:将自定义变量设定为系统环境变量(当前shell中有效) 功能说明:设置或显示环境变量. 语 法:export [-fnp][变量名称]=[变量设置值] 补充说明:在shell中执行程序时,shell会提供一组环境变量.export可新增,修改或删除环境变量,供后续执行的程序使用.export的效力仅及于该此登陆操作. 参 数: -f 代表[变量名称]中为函数名称. -n 删除指定的变量.变量实际上并未删除,只是不会输出到后续指令的执行环境中. -p