JavaScript"；“我”&引用；这",；，为什么？

我在许多源代码中看到：

var me = this;

特别是在ExtJS4（JS框架）中。为什么要做这样的事？是否有其他原因，或者您只是希望变量被称为“me”而不是“this”

---

谢谢。

通常，这样您就可以在范围内保留对

this

的引用，其中

this

引用其他内容（例如回调函数）

考虑此示例，其中click事件处理程序函数的上下文与您所期望的不同（

此

不引用

MyClass

的实例）：

现在考虑这个例子，我们在构造函数中存储一个对<代码>这个值>代码的引用，并在回调函数中使用：

var MyClass = function (elem) {
    var me = this;
    this.elem = elem;
    this.name = "James";
    elem.addEventListener("click", function () {
        alert(me.name); //works!
    }, false);
};

回调函数可以引用在外部函数中声明的变量，即使在该函数返回后也是如此（执行

addEventListener后，
MyClass
构造函数立即返回）。这是一个闭包的演示。
基本上，它利用javascript中的闭包

它用于将
this
的特定实例携带到函数调用中，其中
this
具有不同的含义。
当然，闭包是执行此操作的更明显原因，但我只想补充一点，另一个原因可能是减小javascript文件的缩小版本的大小

此
作为关键字不能在缩小文件的过程中重命名，而局部变量可以。换句话说，无论何时使用该变量（4个字符），都可以使用1个字符的局部变量

考虑以下ExtJS：

（注意，此处不涉及关闭）

及其缩小版：

filterBy:function(b,a){var c=this;c.snapshot=c.snapshot||c.data.clone();c.data=c.queryBy(b,a||c);c.fireEvent("datachanged",c);c.fireEvent("refresh",c)}

（151个字符/字节）

现在，如果我们没有将
this
分配给局部变量，我们将其与缩小版本进行比较：

filterBy:function(b,a){this.snapshot=this.snapshot||this.data.clone();this.data=this.queryBy(b,a||this);this.fireEvent("datachanged",this);this.fireEvent("refresh",this)}

（170个字符/字节）

正如您所见，带有局部变量的版本每次只占用函数大小的88%，而该函数使用
this

尤其是在大型库中，这可以大大减少文件大小。
设置
me=this
允许您从外部作用域在内部作用域中使用
this
变量

var Outer= function () {
        var me = this;
        me.x = "outerx";
        me.inner = {
            x: "innerx",
            displayValues: function () {
                console.log(me.x); //outerx
                console.log(this.x); //innerx
            }
        };
    };

    new Outer().inner.displayValues();

当匿名函数中的
this
的上下文发生变化时，在闭包或回调中使用。更多时候，你会看到
var that=this
哦，我明白了。它可以在函数内部更改。。。好的，谢谢您在答案中提供的信息比其他人多得多，因此此答案将被标记为已接受。再过4分钟。。。Daaah…ExtJs在几乎所有函数中都使用
var me=this
，而在它们的代码中很少需要闭包。当代码中需要一个以上的
此
时，似乎可以使用变量
me
。因此，关闭不是主要原因。[-1]对于这个答案，[+1]对于关于代码大小优化的答案。[+1]ExtJS在几乎所有函数中使用
var me=this
，而闭包很少需要。当需要多个
此
时，似乎可以使用变量
me
。
filterBy:function(b,a){this.snapshot=this.snapshot||this.data.clone();this.data=this.queryBy(b,a||this);this.fireEvent("datachanged",this);this.fireEvent("refresh",this)}

var Outer= function () {
        var me = this;
        me.x = "outerx";
        me.inner = {
            x: "innerx",
            displayValues: function () {
                console.log(me.x); //outerx
                console.log(this.x); //innerx
            }
        };
    };

    new Outer().inner.displayValues();