javascript - 使用 ES6 模块而不是揭示模块模式的额外优势是什么?

标签 javascript closures ecmascript-6

我正在探索 ES6 module 并试图找出使用 ES6 模块而不是 closure 以及 module pattern(国 session 员)。

例如 ES6 中的 util.js。

   var util ={
         abc:function(){
        //function body
    },
    def:function(){
         // function body
    }
    export default utils;   // here export is exposing the entire object
}

util.js 使用闭包和模块模式

var util = (function(){
       function _abc(){
         console.log("abc")
           // function body
       };
    function _def(){
         // function body
      }

  return{          // each of the function will be exposed
      abc:_abc,
      def:_def

}
}(util ||{}))

ES6 中的 someFile.js

import {utils} from "path/to/file"

在带有闭包和模块模式的 someFile.js 中

util.abc() // Will log "abc"

我也知道 es6 module 允许我们重命名 imports & exportsexport { a as abc}

使用闭包和模块模式,我们可以在 return 语句中随意命名,例如 return { a:_abc}

我的问题:通过使用 es6 模块而不是闭包和 MP,我们可以获得什么额外的好处。我猜一个是减少代码行数。

如果我遗漏了任何基本差异,请原谅

最佳答案

var util = (function(){ bla bla bla }(util || {})); 全局命名空间被污染了,所以一旦你使用了 import {utils } 从“路径/到/文件”,它将保留在全局命名空间中,即你将在任何地方都有 window.util,即使在模块完成它的工作并替换为一些其他模块。现在假设您有 100 个模块,并且以相同的方式进行操作,那么想象一下可怜的 window 会变得多么脏!

但是如果使用 ES6 Module 或 CommonJS 甚至 AMD,那么

  1. 全局命名空间未被污染。
  2. [ES6] 您可以使用export default something 导出默认值以使用import from "path/to/file"
  3. [ES6] 您可以使用 export["anotherthing"]
  4. 从 ES6 模块导出多个内容

此外,我建议您阅读此 blog post .

关于javascript - 使用 ES6 模块而不是揭示模块模式的额外优势是什么?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35793404/

相关文章:

Javascript 对点击事件的关闭疑惑

function - lambda 定义有什么乐趣?

javascript - 如何细化 Flow 中的综合事件?

javascript - 在 Promise 链中提取函数

javascript - ES6 中的函数参数定义

javascript - 通过浏览器扩展在网络上每个页面的顶部插入一个栏

javascript - NodeJS : How to check if a key exists in an array of JSON object

javascript - 如何使用 jquery 重置表单中的多个选择框?

javascript - 在javascript中刷新页面后继续时钟时间

php - 调用未定义的方法 Closure::query()