Javascript调用并应用于构造函数

Javascript call and apply on constructor functions

本文关键字：构造函数 应用于 调用 Javascript      更新时间：2023-09-26

我明白了在下面的例子中call (and apply) method是如何工作的。

var Bob = {
  name: "Bob",
  greet: function() {
   alert("Hi, I'm " + this.name);
  }
}
var Alice = {
 name: "Alice",
};
Bob.greet.call(Alice);   // Hi, I'm Alice

根据我的理解，上面发生的事情是Bob对象的greet方法在Alice的范围内被调用。

有人能解释一下在下面的例子中，调用方法被用于允许继承的构造函数的幕后发生了什么吗?

function Product(name, price) {
  this.name = name;
  this.price = price;
}
function Food(name, price) {
  Product.call(this, name, price);
  this.category = 'food';
}
var chicken = new Food('chicken','40');
console.log(chicken);  //{ name= "chicken", price="40", category="food"}

我不能在第一个和第二个例子之间建立联系，在第一个例子中，call方法是在一个正在做某事的函数上调用的(alert)，而在第二个例子中，call方法是在一个初始化一些属性的构造函数上使用的。

这是一种"借用"Product的构造函数来初始化新的Food的方法。

当您使用new调用函数时，您将this设置为新的实例。然后你做Product.call(即调用Product函数并在Product函数内设置this作为你的新Food实例(这是Food内的this))，并传递你的name和price。

在Product.call(this, name, price);之后，您应该发现this.name和this.price已经设置。

不允许继承，也不允许gain inheritance;它只是在新的Food实例上执行构造函数Product。

要获得继承，还必须将Food的prototype设置为新的Product实例;

function Product(name, price) {
  this.name = name;
  this.price = price;
}
Product.prototype.showPriceIn = function (currency) {
    alert(this.price + currency);
} 
function Food(name, price) {
  Product.call(this, name, price);
  this.category = 'food';
}
Food.prototype = new Product;
var chicken = new Food('chicken','40');
chicken.showPriceIn("$");
http://jsfiddle.net/hPWMN/

N。B:注意说"Bob是用Alice的作用域调用的";这不是真的。Bob没有继承Alice的作用域，greet函数中this的值仅仅被修改为Alice。继承这个作用域意味着Bob可以访问私有变量之类的东西，而实际上他并没有。

我将尝试用一个简单的例子来解释，这里是

function Human(name,surname){
    this.name = name;
    this.surname = surname;
}
Human.prototype.method = function(){
    alert("Hi " + this.name + " " + this.surname);
};
var obj = new Human("Name","Surname");
obj.method();

在本例中，Human是定义属性name和姓氏的构造函数。prototype函数与method函数扩展，我使用this键。它引用从外部定义的指定对象。

对于var obj = new Human("Name","Surname");，您初始化Human类并传递值(名称，姓氏)。在本例中，您有一个名为obj的对象，但您可以定义任意多个

相关文章：