Javascript模块模式，范围和“this” [英] Javascript module pattern, scope and "this"

问题描述

我正试图围绕构建自定义JavaScript库。我已经阅读了很多关于模块模式的内容，还阅读了Crockford关于私人和公共成员的文章。我知道什么是立即调用的函数表达式以及我们为什么要这样做？

I'm trying to wrap my head around building a custom JavaScript library. I've read a lot about the module pattern, and also read Crockford's articles on private and public members. I know what is an immediately invoked function expression and why we do stuff like

var myLib = (function() {
}())

但是，在某些情况下，我仍然有点失去关于范围和闭包的问题一般来说。我遇到的具体问题是：

However, I'm still a little lost in some cases regarding scope and closures in general. The concrete problem I have is:

为什么以下示例警告DOMWindow而不是myLib对象？
http://jsfiddle.net/slavo/xNJtW/1/

Why does the following example alert DOMWindow, rather than the myLib object? http://jsfiddle.net/slavo/xNJtW/1/

如果您可以解释该示例中所有方法中this所指的内容以及原因，那将会很棒。

It would be great if you can explain what "this" refers to in all of the methods in that example and why.

推荐答案

在声明（任何地方）的任何函数内部并按如下方式调用此将是窗口对象

Inside any function declared (anywhere) and invoked as follows this will be window object

function anyFunc(){
    alert(this);  // window object
}

anyFunc();


var anyFunc2 = function(){
    alert(this);  // window object
}

anyFunc2();

如果你想创建私有函数并访问'myObject'的实例，你可以遵循以下任何一个以下方法

If you want to create private functions and access the instance of 'myObject' you can follow either of the following methods

一个

module = (function () {

    var privateFunc = function() {
        alert(this);
    }

    var myObject = {
        publicMethod: function() {
            privateFunc.apply(this); // or privateFunc.call(this);
        }
    };

    return myObject;
}());


module.publicMethod();

两个

module = (function () {

    var _this; // proxy variable for instance

    var privateFunc = function() {
        alert(_this);
    }

    var myObject = {
        publicMethod: function() {
            privateFunc();
        }
    };
    _this = myObject;
    return myObject;
}());


module.publicMethod();

这些是您的问题的解决方案。我建议使用基于原型的对象。

These are solutions to your issue. I would recommend using prototype based objects.

编辑：

您可以使用第一种方法。

You can use the first method.

实际上这里 myObject 与 privateFunc 你可以直接在函数中使用它

In fact here myObject is in the same scope as privateFunc and you can directly use it inside the function

 var privateFunc = function() {
     alert(myObject);
 }

真实情况是你可以使用代理这个如下所示。您也可以使用调用。

The real scenario were you can use a proxy for this is shown below. You can use call also.

Module = function () {

    var _this; // proxy variable for instance

    var privateFunc = function() {
        alert(this + "," + _this);
    }

    this.publicMethod = function() {
        privateFunc(); // alerts [object Window],[object Object]
        privateFunc.call(this); // alerts [object Object],[object Object]
    }

    _this = this;
    return this;
};

var module = new Module();
module.publicMethod();

这篇关于Javascript模块模式，范围和“this”的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！