動態將屬性附加到構造函數並在新對象實例中使用？

Question

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

Person.greet = function(){
  console.log("Hello there ! "+ "My name is: "+ this.firstname);
};

var nk = new Person('Mark', 'Z');
console.log(nk.firstname);

nk.greet(); // Error in attaching

因此，我試圖將函數“ greet”附加到其外部的構造函數“ Person”上。 我當然可以用原型做到這一點，但只是想了解為什么上面的代碼不起作用？

例如：這將起作用：

var Person = function(firstname, lastname){
      this.firstname = firstname;
      this.lastname = lastname;
      this.greet = function(){
      console.log("Hello there ! "+ "My name is: "+ this.firstname);
    };
    };

    var nk = new Person('Mark', 'Z');
    console.log(nk.firstname);

    nk.greet(); 

從MDN：

創建函數時，將解析使用Function構造函數創建的函數對象。 這比使用函數表達式或函數語句聲明一個函數並在您的代碼中調用它的效率低，因為此類函數是與其余代碼一起解析的。

傳遞給函數的所有參數均按傳遞的順序被視為要創建的函數中參數的標識符的名稱。

將Function構造函數作為函數調用（不使用new運算符）與作為構造函數調用它具有相同的效果。

全局Function對象沒有自己的方法或屬性，但是，由於它本身是一個函數，它確實通過Function.prototype的原型鏈繼承了一些方法和屬性。

函數實例函數實例從Function.prototype繼承方法和屬性。 與所有構造函數一樣，您可以更改構造函數的原型對象以對所有Function實例進行更改。

Answer 1

如斜視

Person.prototype.greet = function...將函數放到繼承新實例的對象上

這意味着將只有一個由所有實例共享的歡迎功能。

在構造函數中設置this.greet時，您將為person的每個實例創建一個greet函數的新實例（ new Person().greet != new Person().greet ）。 它大多數情況下具有相同的行為，但使用的內存更多。

當您執行Person.greet ， Person.greet方法附加到構造函數，而不是用於每個實例。 在經典編程中，可以將其視為靜態方法。

我認為您會發現我的博客文章對您有所幫助http://js-bits.blogspot.com/2014/10/understanding-prototypical-inheritance.html

Answer 2

您已經知道答案了-使用函數的原型對象，該對象專門用於創建構造函數的新實例。 考慮一下您實際在做什么：

function foo () {
  this.prop = 1
}

foo.bar = function () {
  return this.prop // - not defined
}

foo.prototype.baz = function () {
  return this.prop  // 1
}

var f = new foo()
f.bar // undefined; f.bar() // => Error 
foo.bar // a function that returns undefined when called
f.baz // a function that returns 1 when called
foo.baz // undefined; foo.baz() // => Error

重點是：實例= / =構造函數= / =原型對象。 您直接在構造函數上定義屬性，這意味着您可以從構造函數Person.greet()調用該屬性（即使您在構造函數中的對象上定義的任何內容都將是未定義的，因為在這種情況下永遠不會調用構造函數）。 您不能從函數實例中調用該方法，因為該實例是與構造函數分開的對象。 在構造函數中定義this.greet會起作用，並且某些人會使用這種方法，但是，一個缺點是這些屬性將鎖定在各個實例上。 使用原型可以使更改影響到每個實例。

Answer 3

訣竅是：“ this”不是Person構造函數，而是示例中的新實例（nk）。

因此，“ this.greet”和“ person.greet”完全不同。

在第一個示例中，您附加person.greet，但調用nk.greet。 那就是原因。