标签: module-pattern

你能把多个文件缩小成一个吗?

我将我的JavaScript代码分成几个文件,全部使用模块模式(更新一个全局变量,比如说MyApp,具有新功能和成员).

是否可以将文件缩小为一个而不会破坏范围

示例我想缩小:

File1.js

var Module = (function(ns) {

 ns.fun1 = function() { alert('fun1'); };
 return ns;

})(Module || {});
Run Code Online (Sandbox Code Playgroud)

File2.js

var Module = (function(ns) {

 ns.fun2 = function() { alert('fun2'); };
 return ns;

})(Module || {});
Run Code Online (Sandbox Code Playgroud)

javascript minify module-pattern

6
推荐指数
1
解决办法
844
查看次数

Javascript模块模式:如何将方法/插件注入/创建/扩展到我们自己的库?

我是javascript新手.对不起,如果我的问题有问题.

如何将方法或插件注入/创建/扩展到我们自己的库?这是"yourlib.js"

var Yourlib = (function() {
    // privt. var
    var selectedEl = {}

    // some privt. funct
    function something() {

    }

    return {
        getById : function() {

        },
        setColor : function() {

        }
    }
}());
Run Code Online (Sandbox Code Playgroud)

以下是你的"plugin.js"

/*
How to create the plugin pattern?
Example: I want to create/inject a method/plugin named "setHeight" .
So, i can call it later, like this: Yourlib.getById('an-id').setHeight(value);
How is the pattern?
*/
Run Code Online (Sandbox Code Playgroud)

javascript module-pattern

6
推荐指数
2
解决办法
7970
查看次数

JS模块模式覆盖功能

我有以下模式

BASE = function () {
    var that = {};
    var number = 10;

    that.showNumber = function(){
        that.alertNumber();
    }

    that.alertNumber = function () {
        alert(number);
    };    
    return that;
};

CHILD = function () {
    var that = Object.create(BASE());
    var secondNumber = 20;

    // Override base function
    that.alertNumber = function () {
        alert(secondNumber);
    };
    return that;
};

var ch = CHILD();
ch.showNumber();
Run Code Online (Sandbox Code Playgroud)

你能告诉我如何调整我的Douglas CrockFord启发的模块模式来完全覆盖alerNumber功能吗?到目前为止,showNumber功能显示10而不是20.

先谢谢大家

JSFiddle与代码在这里

javascript module-pattern

6
推荐指数
1
解决办法
2122
查看次数

模块模式中的函数声明与函数表达

我刚刚了解了函数声明和函数表达式之间的区别.这让我想知道我是否在AngularJS代码中做得对.我正在遵循John Papa使用的模式,但现在它似乎与模块模式的典型JS方法不一致.John Papa在他的控制器和服务中大量使用嵌套的函数声明.这不好吗?

有没有理由支持这个:

var foo = (function() {
    var bar = function() { /* do stuff */ };
    return {
       bar : bar
    };
}());

foo.bar();
Run Code Online (Sandbox Code Playgroud)

对此:

var foo = (function() {
    return {
       bar : bar
    };

    function bar() { /* do stuff */ };
}());

foo.bar();
Run Code Online (Sandbox Code Playgroud)

我主要是一名C#开发人员,仍然习惯于JavaScript的所有细微差别.我更喜欢后一种方法,因为IIFE中的所有功能都是私有的,顶部的揭示模块模式实际上是公共部分.在C#类中,我总是在私有支持函数之前拥有我的公共属性和方法.但是,我意识到它在JS世界中可能不那么干脆.

使用后一种方法有哪些隐患(如果有的话)?

javascript module-pattern function-declaration function-expression iife

6
推荐指数
1
解决办法
736
查看次数

模块模式中 get/set 和 Object.defineProperty 的区别

我已经看到了在模块模式中实现 getter/setter 的两种不同方法。一个使用“defineProperty”,而另一个则不使用。一种与另一种相比有哪些优点/缺点?

var MyModule = (function() {

  var _val;

  var api = {
    get value1() {
      return _val
    },
    set value1(value) {
      _val = value
    }
  };

  Object.defineProperty(api, 'value2', {
    get: function() {
      return _val;
    },
    set: function(value) {
      _val = value
    }
  });
  return api;

}());
Run Code Online (Sandbox Code Playgroud)

https://plnkr.co/edit/TbJSD4noZTew8II83eTH?p=preview

javascript module-pattern

6
推荐指数
1
解决办法
1724
查看次数

JavaScript模块模式/组织/子模块

  1. 我想知道以下模式之间的区别(优点/缺点).
  2. 如何根据模块模式创建子模块?

我的目标是有我的js组织成多个文件延迟加载,但有一个命名空间.

例如:

SO.global(global.js)SO.global.registration(registration.js)< - load

var SO = function(){

    var CONSTANT = 'Z';

    function createX(){
      alert("create X");
    }

    function getY(){
       alert("get Y");
    }
    return{
      create:createX,
      get:getY
    }
}();

//SO.createX(); 
//SO.getY();
Run Code Online (Sandbox Code Playgroud)

VS.

var SO = (function() {

    var CONSTANT = 'Z';

    function createX(){
      alert("create X");
    }

    function getY(){
       alert("get Y");
    }

    return {
      create:createX,
      get:getY
    }

} ());
Run Code Online (Sandbox Code Playgroud)

javascript namespaces module-pattern

5
推荐指数
1
解决办法
1898
查看次数

模块模式中的构造函数

在javascript中使用模块模式时应该如何定义构造函数(如果有的话).我希望我的构造函数适合标准模块模式而不是全局模式.

为什么这样的东西不起作用,是完整的,完全是胡说八道?

var HOUSE = function() {
    return {
        Person: function() {
            var self = this;
            self.name = "john";
            function name() {
                return self.name;
            }
        }
    };
}();

var me = new HOUSE.Person();
alert(me.name());
Run Code Online (Sandbox Code Playgroud)

javascript constructor prototype module-pattern

5
推荐指数
1
解决办法
1821
查看次数

JavaScript模块模式中的方括号表示法和范围

我一直在使用JavaScript中的模块模式,并对范围和方括号表示法(SBN)有疑问.

请考虑以下简单示例.

(function (module) {

    function myMethod(text) {
        console.log(text);
    }

    module.init = function (name) {

        // here I want to do something like 
        // eval(name)("hello");
        // using SBN, e.g.
        ..[name].call(this, "hello"); 
    };

})(window.Module = window.Module || {});

Module.init("myMethod");
Run Code Online (Sandbox Code Playgroud)

init功能内部可以myMethod使用SBN 进行呼叫吗?

javascript scope square-bracket module-pattern

5
推荐指数
1
解决办法
279
查看次数

从内部扩展命名空间模块

码:

;(function (ns, undefined) {
  ns = {
    foo1: "bar1"
  }

  this.ns = {
    foo2: "bar2"
  };

  ns.foo3 = "bar3";

  return ns;

})(window.ns = window.ns || {});
Run Code Online (Sandbox Code Playgroud)

结果:

通话ns结果:Object {foo2: "bar2"}

IIFE回归: Object {foo: "bar1", foo3: "bar3"}

1.我理解正确吗?

  • ns 是IIFE中的一个新的私有对象,然后返回
  • this.ns属于window.ns并扩展它

2.为何选择this关键字this.ns

由于IIFE是在全局上下文中调用的this,因此关键字与global链接,因此:( document.ns命名空间)

3.如何正确访问this.nsIIFE内的物业?

例如console.log(this.ns.foo2)- 这是正确的方式吗?

自从我window.ns作为ns论点通过以来,为什么我必须使用this.ns而不仅仅是ns

javascript oop this module-pattern

5
推荐指数
1
解决办法
47
查看次数

如何在不访问包含范围内的内容的情况下安全地访问Javascript模块模式中的其他兄弟函数和变量?

我在模块模式之后构建了一个Javascript对象.我有几个私有函数,从其他兄弟"私有"函数调用.如何在不可能意外访问全局/外部变量/对象/函数的情况下访问另一个变量/函数?

function doSomething() {
  alert("Something I don't want to do");
}

var My.Namespaced.SingletonClass = (function() {
  var init = function() {
    doSomething();
  }

  var doSomething = function() {
    alert("Something I want to do");
  }

  return {
    "init": init;
  }
})();

My.Namespaced.SingletonClass.init();
Run Code Online (Sandbox Code Playgroud)

我的猜测是上面的代码实际上会访问正确的内部doSomething函数,但是我想要更安全一些.如何明确地解决内部/嵌套函数而不必担心在我的单例周围调用函数或寻址对象?

javascript module-pattern

4
推荐指数
1
解决办法
1178
查看次数