使用呼叫方法而不是在参数中传递对象的优点是什么?

Question

在以下代码中，哪一个是正确的，这两个是不同的

使用呼叫方法

var obj = {
  num: 10
 };
var add = function(a) {
  return this.num + a
}
console.log(add.call(obj,4))

参数中传递对象

var obj = {
  num: 10
};
var add = function(obj,a) {
  return obj.num + a
}
console.log(add(obj,4))

Answer 1

您的第二个代码块只是一个常规函数。但是，第一个更棘手。因此，问题基本上是：

何时在JavaScript中使用上下文？

在JavaScript中，术语上下文基本上是指this。通常使用对象的方法时使用，以便您可以参考 object 。这是OOP的核心概念之一，是我们仅在原型内定义一个函数，而从其继承的该类的每个对象都会揭示此方法，它就无法使用上下文。这就是this的发明。但是，在某些情况下，上下文是有用的，没有继承。例如。事件手通常是无上下文的，因为它们不是任何对象的一部分：

window.addEventListener("load", function(evt){
  const el = evt.target;
};

但是，由于它是窗口的事件，因此在窗口的上下文中执行它是否有意义？如果您现在说"是"，那么您（Will）可能会喜欢JS：

window.addEventListener("load", function(){
 this.document.body.innerHTML = "Dynamic context can be cool!";
});

因此，在JS this中是指对象的方式，该函数是指。通过Function.prototype.call，我们可以在任何地方使用它。但是，这并不意味着我们应该在任何地方使用它。this应保持上下文感，因为在某处使用它会造成混乱/uglify您的代码/使您的代码货物爆炸。

var add = function(a) {
 return this.num + a;
}

在您的代码中，我认为它不清楚this是什么意思。因此，它是this的滥用。但是，如果您将其作为 obj 的方法 ，因此它的上下文从代码中清晰可见：

const num = {
  value:10,
  add(a){ return this.value + a }
};

，如果您使用继承使其可重复使用，它将变得更加美丽：

class CustomNumber {
  constructor(n = 0){
    this.value = n;
  }
  add(a){ return this.value + a; }
}
const num = new CustomNumber(10);