我在WebKit HTML 5 SQL Storage Notes Demo的源代码中看到了以下内容:

function Note() {
  var self = this;

  var note = document.createElement('div');
  note.className = 'note';
  note.addEventListener('mousedown', function(e) { return self.onMouseDown(e) }, false);
  note.addEventListener('click', function() { return self.onNoteClick() }, false);
  this.note = note;
  // ...
}

作者在某些地方使用self(函数体),在其他地方使用this(在方法的参数列表中定义的函数体)。这是怎么呢现在我已经注意到它一次了,我将开始到处看到它吗?


当前回答

请在alistapart.com上查看这篇文章。(Ed:文章从最初的链接开始更新)

Self用于维护对原始this的引用,即使在上下文发生变化时也是如此。这是事件处理程序(尤其是闭包)中经常使用的一种技术。

编辑:注意,现在不鼓励使用self作为窗口。Self存在,如果不小心,就有可能导致错误。

你怎么称呼这个变量并不重要。Var that = this;还好,但这名字没什么神奇的。

在上下文中声明的函数(例如,回调,闭包)将可以访问在相同或以上范围中声明的变量/函数。

例如,一个简单的事件回调:

函数MyConstructor(options) { Let that = this; 这一点。Someprop =选项。|| 'defaultprop'; 文档。addEventListener('click', (event) => { 警报(that.someprop); }); } 新MyConstructor ({ someprop:“Hello World” });

其他回答

是的,到处都能看到。that = this;

看到self是如何在事件调用的函数中使用的吗?它们将有自己的上下文,因此self用于保存进入Note()的this。

尽管self只能在Note()函数完成执行之后执行,但函数仍然可以使用self的原因是,由于闭包,内部函数获得了外部函数的上下文。

请在alistapart.com上查看这篇文章。(Ed:文章从最初的链接开始更新)

Self用于维护对原始this的引用,即使在上下文发生变化时也是如此。这是事件处理程序(尤其是闭包)中经常使用的一种技术。

编辑:注意,现在不鼓励使用self作为窗口。Self存在,如果不小心,就有可能导致错误。

你怎么称呼这个变量并不重要。Var that = this;还好,但这名字没什么神奇的。

在上下文中声明的函数(例如,回调,闭包)将可以访问在相同或以上范围中声明的变量/函数。

例如,一个简单的事件回调:

函数MyConstructor(options) { Let that = this; 这一点。Someprop =选项。|| 'defaultprop'; 文档。addEventListener('click', (event) => { 警报(that.someprop); }); } 新MyConstructor ({ someprop:“Hello World” });

我认为变量名“self”不应该再这样使用了,因为现代浏览器提供了一个全局变量self,指向普通窗口或WebWorker的全局对象。

为了避免混淆和潜在的冲突,可以写成var this = this或var that = this。

function Person(firstname, lastname) {
  this.firstname = firstname;

  this.lastname = lastname;
  this.getfullname = function () {
    return `${this.firstname}   ${this.lastname}`;
  };

  let that = this;
  this.sayHi = function() {
    console.log(`i am this , ${this.firstname}`);
    console.log(`i am that , ${that.firstname}`);
  };
}

let thisss = new Person('thatbetty', 'thatzhao');

let thatt = {firstname: 'thisbetty', lastname: 'thiszhao'};

this.sayHi.call(thatt);

还应该注意的是,如果您不喜欢var self = this习惯用法,还有另一种代理模式用于在回调中维护对原始this的引用。

可以使用function在给定的上下文中调用函数。应用或作用调用时,您可以编写一个包装器,该包装器返回一个函数,该函数使用apply或Call使用给定上下文调用您的函数。有关此模式的实现,请参阅jQuery的代理函数。下面是一个使用它的例子:

var包装func = $.proxy代理(这个。myFunc, this);

然后可以调用wrappedFunc,并将此版本作为上下文。