首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

module.exports和exports,应该用哪个

Universal Module Definition (UMD)[4]格式可以用于浏览器和Node.js。当一个模块需要被多个不同模块加载器导入时,它就会非常有用。...好吧,如果你查看user.js文件,你会注意到我们定义了一个getName函数,然后使用exports关键字让它在任意导入地方可用。在index.js中,我们导入了该函数并执行了它。...还需要注意require语句,该模型名称有着./前缀,意味着它是本地文件。还要注意是,此处不需要添加文件扩展名。...导出多个方法和值 我们可以用同样方式导出多个方法和值: const getName = () => { return 'Jim'; }; const getLocation = () => {...语法变化 还应该提到,可以在导出过程中导出方法和值,而不仅仅是在文件末尾导出

18720

详解 JavaScript 中模块、Import和Export

模块化编程 在 JavaScript 中出现模块概念之前,当我们想要把自己代码组织为多个块时,一般会创建多个文件,并且将它们链接为单独脚本。...如果你打算在另一个文件中使用另一个名为 sum 变量,会很难知道在脚本其它位置到底用是哪一个值变量,因为它们用都是相同 window.sum 变量。...命名导出 如前所述,使用 export 语法允许你分别导入名称导出值。...以这个 function.js 简化版本为例: functions.js export function sum() {} export function difference() {} 这样允许你用花括号按名称导入...默认导出 在前面的例子中我们导出多个命名导出,并分别或作为一个对象导入了每个导出,将每个导出作为对象上方法。模块也可以用关键字 default 包含默认导出

1.9K20
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    es6中模块化

    ES6模块化分为导出(export)与导入(import)两个模块。 export用法 在ES6中每一个模块即是一个文件,在文件中定义变量,函数,对象在外部是无法获取。...我们先来创建一个test.js文件,来对这一个变量进行输出: export let myName="laowang"; 然后可以创建一个index.js文件,以import形式将这个变量进行引入: import...,对于默认导出导入名称可以和导出名称不一致。.../test.js"; console.log(myFn(),myName);//默认导出一个方法 laowang 重命名export和import 如果导入多个文件中,变量名字相同,即会产生命名冲突问题...,为了解决该问题,ES6为提供了重命名方法,当你在导入名称时可以这样做: /******************************test1.js**********************/

    54420

    ES6之路之模块详解

    简介 何为模块 一个模块只不过是一个写在文件 JavaScript 代码块。 模块中函数或变量不可用,除非模块文件导出它们。...避免命名污染:在 javascript 脚本中,所有的 js 文件顶级作用域创建变量,会被添加到共享全局作用域,这就会导致不同的人开发代码可能会有相同变量名,导致变量名污染。...前面也提到一个模块就是一个 javascript 文件,在这个模块中定义变量,外部是无法获取到,只有通过 export 导出变量其他模块才可以用 最简单导出方式就是在声明变量、函数、类前面加一个...} } // 私有函数 function privateFunction () { console.log('是私有函数,外部访问不了'); } 注意: 被导出函数或者类,都必须要有名称...当导入绑定时候,绑定类似于使用了 const 定义,意味着不能定义相同变量名,但是没有暂时性死区特性(但是在 深入理解ES6 这本书里面说是有暂时性死区限制,在 chrome 上测试了,读者希望也去试下

    63030

    TypeScript系列教程十《模块》

    在脚本文件中,变量和类型被声明为在共享全局范围内,并且假设您将使用–outFile编译器选项将多个输入文件连接到一个输出文件中,或者在HTML中使用多个 如果您文件当前没有任何导入导出,但希望将其视为模块...无论您模块目标是什么,此语法都有效。 TypeScript 中模块 在TypeScript编写基于模块代码时,需要考虑三个主要问题: 语法: 想使用什么语法来导入导出内容?...模块解析: 模块名称(或路径)与磁盘上文件之间关系是什么? 模块输出目标: 发出JavaScript模块应该是什么样子?.../hello.js"; hello(); 除了默认导出外,您还可以通过导出进行多个变量和函数导出,方法是省略默认值: // @filename: maths.ts export var pi = 3.14...在大多数情况下,使用ES模块导入与来自这些环境需求相同,但此语法确保您TypeScript文件与CommonJS输出具有1对1匹配: import fs = require("fs"); const

    1.5K10

    vue模块化开发是如何实现

    那么在Vue项目中是如何实现模块化呢?模块化,就好比是一个大功能项,这个大功能项中又可以包含多个组件。在使用时候,单个模块对应是我们Vue项目下compentent下文件目录。...每一个模块下面又可以有多个组件,这些组件又组成了完整模块页面(单页面)但是每一个模块下面必须要有一个主要文件(模块父组件),这个文件必须在路由管理中(router/index.js)进行注册,注册时候满足以下形式...,导入名称可以和导出名称不一致。.../module1.js";console.log(fn()+name);//默认导出一个方法aays重命名export和import如果导入多个文件中,变量名字相同,即会产生命名冲突问题,为了解决该问题...,ES6为提供了重命名方法,当你在导入名称时可以这样做:export let myName="来自module1.js";//模块1中export let myName="来自module2.js

    44730

    你知道 JS模块导入有一个缺点

    作者:Dmitri Pavlutin 译者:前端小智 来源:Dmitri Pavlutin 1.命名导入和自动完成 假设信编写了一个简单JavaScript模块: // stringUtils.js...看起来没啥问题,挺好。 现在在 app.js 文件导入函数 exequalsIgnoreCase / app.js import { equalsIgnoreCase } from '....在此步骤中,IDE无法提供有关要导入可用名称任何建议。 然后,继续写入 from './stringUtils',然后移回大括号并展开自动完成以选择要导入名称。...尽管 ES6 模块优点很多,但导入模块语法使自动完成功能难以使用。 2.Python 中模块 现在让我们尝试在 Python 中导入命名组件。它有同样问题?...3.解决方法 能找到在JavaScript中对命名导入启用自动完成唯一解决方案是调用IDE以获得帮助。

    1.8K10

    Es6中模块(Module)默认导入导出及加载顺序

    加上default是javascript中默认关键字,因此不能将其用作变量,函数或者类名称,但是却可以,将其作为属性名称,所以用default来重命名模块时为了尽可能与非默认导出定义一致,如果想在一条导出语句中同时制定多个导出...{},这与非默认导入情况是不一样,本地名称sub用于表示模块导出任何默认函数,这在Es6中是常见做法,并且在一些脚手架里依然采用这种方式引入一些模块方式非常流行 那么问题来了,如果是要导出默认值或者非默认绑定模块呢...可以用一条语句导入所有导出绑定,例如,如下所示:将下面的代码命名为exampleDefault.js export var name = "川川"; // 非默认导出格式 export let desc...,也可以用作单独脚本,由于它没有导出任何东西,所以,在另一个模块中,可以使用简化导入操作来执行该模块代码,并且不导入任何绑定,示例代码如下 import "....注意:module与text/javascript这样内容类型并不相同,JavaScript模块文件与javascript脚本文件具有相同内容类型,因此无法根据内容类型进行区分,此外,当无法识别type

    2.4K40

    JavaScript 编程精解 中文第三版 十、模块

    其中很大一部分是垃圾,应该提一下,但几乎所有有用公开包都可以在那里找到。 例如,一个 INI 文件解析器,类似于我们在第 9 章中构建那个,可以在包名称ini下找到。...,而date-names导出包含多个东西对象 - days和months是名称数组。.../format-date"就是在同一个目录中,名为format-date.js文件。 当名称不是相对时,Node.js 将按照该名称查找已安装包。...从另一个模块导入时,导入绑定而不是值,这意味着导出模块可以随时更改绑定值,导入模块将看到其新值。 当有一个名为default绑定时,它将被视为模块主要导出值。...如果你在示例中导入了一个类似于ordinal模块,而没有绑定名称周围大括号,则会获得其默认绑定。 除了默认绑定之外,这些模块仍然可以以不同名称导出其他绑定。

    54120

    快速入门Web开发(上) 黑马程序员JavaWeb开发教程

    即以上页面 修改服务端口号 使用import导入,export组成一个模块 等价于下面 vs6中,属性与名相同可以只写一半 ​ 导出export 其中,export default是导出语法 // utils.js.../utils.js'; console.log(add(2, 3)); // 输出 5 export default 没有指定名称是因为它导出是一个对象字面量(即一个没有具体名称对象)。...假设你有一个名为 myModule.js 模块,并且在该模块中使用 export 导出了一个值,而没有为该导出指定名称。以下是导入这个没有名称 export 示例: import '....这样做是为了执行 myModule.js副作用,例如在模块中定义全局变量、执行代码等。 需要注意是,导入没有名称 export 时,你不能直接使用导入值,因为没有为其指定变量名。...但是,它可以用作执行副作用手段。例如,当导入模块包含在浏览器环境中注册全局变量代码时,可以使用这种方式导入模块,而不需要使用导入值。

    10810

    JS module导出导入

    有两种模块导出方式:命名式导出名称导出)和默认导出(定义式导出),命名式导出每个模块可以有多个,而默认导出每个模块仅一个 。...命名式导出可以导出多个值,但在import引用时,也要使用相同名称来引用相应值。...下面两种导出方式是等价: constD=123;exportdefaultD;export{Dasdefault}; 使用名称导出一个模块时: // "my-module.js" 模块 function...';console.log(cube(3));// 27 import导入模块 import语法声明用于从已导出模块、脚本中导入函数、对象、指定文件(或模块)原始值。...注意事项: import必须放在文件最开始,且前面不允许有其他逻辑代码,这和其他所有编程语言导入风格一致。 命名导入 我们可以通过指定名称导入成员插入到当作用域中。

    2.7K40

    小结ES6基本知识点(六):模块语法

    关于模块化更多内容,可以看下之前总结一览js模块化:从CommonJS到ES6 2.导出语法 2.1 导出基本语法、导出时重命名 export关键字,可以导出变量、函数、类给其他模块。.../export.js"; console.log(name) // Peter // 导入多个绑定 import { name, age } from "....,要注意import时默认值必须在非默认值之前: import 默认值本地名称,{非默认值} from ‘xxx.js’; 如果写反则会报错: import {非默认值},默认值本地名称 from.../export.js'; console.log(sum(1, 2)) // 3 console.log(name) // Peter 4.重新导出模块已经导入内容 如果在一个模块之中,先导入导出同一个模块.../export.js'; } 模块好处就在于不用把所有东西都放到一个文件中,可以通过模块导出导入需要东西。

    2.6K1072

    nodejs&模块&全局对象global

    (1)多线程 多线程是指程序中包含多个执行流,即在一个程序中可以同时运行多个不同线程来执行不同任务,也就是说允许单个程序创建多个并行执行线程来完成各自任务。java是多线程。...模块内部定义变量和函数默认情况下在外部无法得到。模块内部可以使用exports对象进行成员导出,使用require方法导入其他模块。...nodejs中,导出当前模块成员,可以用exports,也可以用module.exports。exports 实际指向 module.exports,最终导出是module.exports对象。...一般情况下,我们会通过解构赋值方式,直接从导入对象中获取需要成员。 ① 导入系统模块 通过系统模块名称导入。...let path = require('path') ② 导入第三方模块 通过模块名称导入(这个名称是package.json文件中name属性对应名称)。

    1.3K20

    JavaScript 是如何工作:模块构建以及对应打包工具

    另一个缺点是它们仍然会导致名称空间冲突。例如,如果两个模块具有相同名称怎么办?或者,如果有一个模块两个版本,并且两者都需要,该怎么办? 幸运是,答案是肯定。...也许个人最喜欢 ES6 模块功能是它导入模块是导出时模块实时只读视图。(相比起 CommonJS,导入导出模块拷贝副本,因此也不是实时)。...类似地,如果有多个文件且有多个依赖时,只需告诉 Browserify 入口文件路径即可。最后打包后文件可以通过 Minify-JS 之类工具压缩打包后代码。...来看个例子: 假设有一个带有多个函数 utils.js 文件,每个函数都用 ES6 语法导出: export function each(collection, iterator) { if (...预测构建过程将会保留,至少在近期内。 CommonJS、AMD 与 UMD 会被淘汰? 一旦 ES6 成为模块标准,我们还需要其他非原生模块规范? 觉得还有。

    1.4K10

    Es6中模块化Module,导入(import)导出(export)

    之后作为example属性被访问,这种导入格式被称为命名空间导入,因为exportExample.js文件中不存在example对象,所以它被作为exportExample.js中所有导出成员命名空间对象而被创建...,函数或者类时,我们可能不希望使用他们原始名称,就是导入导出时模块内标识符(变量名,函数,或者类)可以不用一一对应,保持一致,可以在导出导入过程中改变导出变量对象名称 使用方式: 使用as关键字来指定变量.../ as后面是重新指定函数名 如上代码,函数sum是本地名称,add是导出时使用名称,换句话说,当另一个模块要导入这个函数时,必须使用add这个名称 若在importExample.js一模块中,...name设置为好好先生,通过import导入name标识符是export导出name标识符本地名称 总结 本文主要从什么是模块,Node中模块导出导入,如何检测node.js对Es6支持情况...,以及在Node中通过babel将es6代码转化为Es5代码在Node中执行,模块导出(导出数据,函数和类)模块导入(单个导入,多个导入,导入整个) 模块中在用export关键字导出所要暴露对象和用

    2.6K20

    精读《默认、命名导出区别》

    本周找来了这方面很好文章:export-default-thing-vs-thing-as-default,先描述梗概,再谈谈理解。...那么默认导出另一种写法 export { thing as default } 也是如此?...所以导出是否是引用,不取决于是否是命名导出,而是取决于写法。不同写法效果不同,哪怕相同含义不同写法,效果也不同。 难道是写法问题?...甚至 export default '123' 是合法,而 export { '123' as thing } 是非法也证明了这一点,因为命名导出本质是赋值到 default 变量,你可以用已有变量赋值...也认为不需要背下来这些导入导出细枝末节差异,只要写模块时都用规范命名导入导出,少用默认导出,就可以在语义与实际表现上规避掉这些问题啦。

    46930

    为什么说:JavaScript 模块中默认导出很糟糕

    = (a, b) => a - b; 在导入使用之前,这里有一个问题,它可能会影响到我们开发体验。.../math.js'; const result = multiply(2, 2); // results is now 0 由于默认导出可以用任何名字,并且每个开发者命名习惯不一样,名称就不一样,这样就没有一致性了...到这里,大家可能有一个问题,如果来自不同模块两个命名导出具有相同名称,该怎么办? 我们可以使用重命名方式来解决这个问题: import { Article } from '....最后,你可能也在想,"使用框架或工具几乎要求我们默认导出一个函数或组件"。如果组件很多,我们可以通过使用 "index.js" 来解决这个问题。...就是在目录根部创建一个index.js或index.ts文件,然后使用命名导出这些组件。

    86620
    领券