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

What are extra advantage of using ES6 module instead of revealing module pattern?

本文关键字：模块 是什么 模式 ES6 显示 使用      更新时间：2023-09-26

我正在探索 ES6 module，并试图弄清楚我们使用 ES6 模块而不是closure和 module pattern （MP） 有什么额外的优势。

例如util.js 在 ES6 中。

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

util.js using closure & module pattern

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 ||{}))

某些文件.js在 ES6 中

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

在某些文件中.js带有闭包和模块模式

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

我也知道 es6 module允许我们重命名imports & exports 喜欢export { a as abc}.

使用闭包和模块模式，我们可以在返回语句中给出一个我们喜欢的名称，例如返回{ a:_abc}

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

如果我错过了任何基本差异，请原谅我

随着var util = (function(){ bla bla bla }(util || {}));全局命名空间被污染，因此一旦您使用了 import {utils} from "path/to/file" ，它将保留在全局命名空间中，即您将在任何地方都有window.util，即使在模块完成它的工作并被其他模块替换之后。现在考虑你有 100 个模块，并且你以同样的方式做，然后想象一下可怜的窗户会变得多么脏！

但是，如果使用ES6模块或CommonJS甚至AMD，则

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

此外，我建议您阅读这篇博文。

相关文章：