javascript - 解释 $(this)

Question

我无法理解$(this)，我做了一个剪刀石头布的版本，并应用了 jQuery 让用户在计算机上选择按钮选项。我希望有人能解释一下 $(this) 指的是什么，它是 btn-primary 吗？该函数在下面，如果您需要 html，它在 codepen 链接中。此外，结果显示在控制台中。

https://codepen.io/anon/pen/VeLWKP

$(".btn-primary").on("click", function () {
    userChoice = $(this).attr("id");
    computerChoice = computerOptions[Math.floor(Math.random() * computerOptions.length)];
    console.log(userChoice, computerChoice);
});

Answer 1

jQuery 中的 $(this) 指的是 btn-primary，是的，但不是整个选择器。它具体指的是触发你的匿名函数的那个​​；即，您单击的按钮，作为 jQuery 对象。

这是面向对象语言中的一个常见概念，也许更直观。假设我们有一个类 Dog，我们想要这个类的多个实例:

dog = new Dog('Albert');

然后我们想在狗身上使用一个方法:speak，为此狗会叫出自己的名字。该方法可以这样写:(伪代码)

class Dog {

  string name;

  function Dog(name) {
    this.name = name;
  }

  function speak() {
    return "I'm "+ this.name + "! Bark!";
  }

}

最终看起来很像 Java。因此，this 类似地引用了调用范围。因为我们可能有很多狗，每只都有自己的名字，我们需要一种方便的方式来获得我们的名字。其他语言称此为 self。