【问题标题】:Javascript return with colonJavascript 用冒号​​返回
【发布时间】:2015-12-06 09:33:15
【问题描述】:

我正在学习 JavaScript,并且遇到了以下结构:

var Test = (function () {

  function func1() {
      //do something.....
  }

  function func2() {
      //do something.....
  }

  function func3() {
      //do something.....
  }

  return {
      func1: func1,
      func2: func2,
      func3: func3
  };

})();

我想知道返回块在做什么。这是一个非常常用的 JavaScript 结构吗?请让我知道在哪里可以获得有关此的更多信息。

【问题讨论】:

    标签: javascript return revealing-module-pattern


    【解决方案1】:

    这是显示模块模式

    返回的对象包含对 IIFE 中定义的函数的引用。所以里面定义的函数对于匿名函数是私有的

    但是如果你想在外面使用内部函数,你可以使用返回的对象。

    Test 的值将是

    var Test = {
        func1: func1,
        func2: func2,
        func3: func3
    };
    

    你可以从外面打电话给func1

    Test.func1();
    

    这是 Javascript emulate class 的方式。由于没有使用模块模式的可见性说明符,因此可以将变量/方法设为公共/私有。

    显示模块模式的灵感来自于模块模式。在揭示模块模式中,object 中只返回对 private 变量/方法的引用。

    该模式背后的主要思想是避免邪恶的全局变量。这看起来类似于 IIFE,除了返回一个对象而不是函数。 IIFE 中定义的变量/方法对于函数是私有的。要访问 IIFE 内部的任何变量/方法,需要将其添加到返回的对象中,然后才能从 IIFE 外部访问它。这种模式利用了闭包,因此在 IIFE 中定义的变量/方法即使在对象返回后也可以访问。

    来自 Addy Osmani 的书Learning Javascript Design patterns

    Revealing Module 模式的出现是因为 Heilmann 对当我们想要从另一个公共方法调用或访问公共变量时必须重复主对象的名称这一事实感到沮丧。他也不喜欢模块模式的要求,即他希望公开的东西必须切换到对象字面量表示法。

    他努力的结果是更新了模式,我们只需在私有范围内定义所有函数和变量,并返回一个匿名对象,其中包含指向我们希望公开为私有功能的指针。

    优点:

    1. 封装。 IIFE 内部的代码是从外部世界封装的
    2. 干净、有条理和可重用的代码
    3. 隐私。它允许创建私有变量/方法。不能从 IIFE 外部访问私有变量/方法。

    缺点:

    1. 如果私有函数引用公共函数,则该公共函数不能被覆盖

    进一步阅读:

    1. https://en.wikipedia.org/wiki/Module_pattern
    2. https://carldanley.com/js-revealing-module-pattern/
    3. How to use Revealing module pattern in JavaScript

    编辑

    来自comment来自@Mike

    值得注意的是,通常创建一个对象(例如,var me = {};),然后在其上声明可能的公共成员(me.func1 = function() { /* ... */ };),最后返回该对象(return me;)。这避免了我们在 OP 代码的 return 语句中看到的重复(所有公共内容都重复)。

    【讨论】:

    • 值得注意的是,通常创建一个对象(例如,var me = {};)然后在其上声明可能的公共成员(me.func1 = function() { /* ... */ };),最后返回该对象(@ 987654338@)。这避免了我们在 OP 代码的 return 语句中看到的重复(所有公共内容都重复)。
    【解决方案2】:

    它是 return 语句中的文字对象。这就像创建一个对象然后返回它:

    var obj = {
        func1: func1,
        func2: func2,
        func3: func3
    };
    return obj;
    

    字面量对象语法创建一个对象并设置它的属性,就像:

    var obj = new Object();
    obj.func1 = func1;
    obj.func2 = func2;
    obj.func3 = func3;
    return obj;
    

    返回对象的目的是将函数内部的函数暴露给外部的代码,同时为函数可以使用的私有变量创建一个作用域。

    当不使用私有变量时,代码执行相同的操作:

    var Test = {
      func1: function() {
          //do something.....
      },
      func2: function() {
          //do something.....
      },
      func3: function() {
          //do something.....
      }
    };
    

    私有变量在函数作用域内声明,并且只能被其中的函数访问。示例:

    var Test = (function () {
    
      var name;
    
      function setName(str) {
        name = str;
      }
    
      function getName() {
        return name;
      }
    
      return {
          setName: setName,
          getName: getName
      };
    
    })();
    
    Test.setName("John Doe");
    var name = Test.getName();
    

    【讨论】:

    • 为什么在不必要的时候使用new Object() 或字符串表示法?
    • @Seiyria:与没有文字对象表示法的文字对象表示法相同。我只是将字符串表示法更改为常规属性标识符。 :)
    • 我想我的意思是var object = {}var object = new Object() 好很多。这更有意义,performs better
    • @Seiyria:是的,确实如此,但这是一个对象字面量,我想展示一下对象字面量的作用。
    【解决方案3】:

    这就像其他编程语言中的一个类。因此,您可以使用Test.func1 访问公共func1 成员,并使用Test.func1() 像普通函数一样调用它。

    【讨论】:

    • 感谢投票者的反馈。一定要爱上 2016 SE 社区。​​span>
    猜你喜欢
    • 2021-01-05
    • 1970-01-01
    • 1970-01-01
    • 2010-12-18
    • 1970-01-01
    • 2021-10-21
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多