Javascript 面向對象編程(三)

理解什麼是繼承

方法和屬性從一個類傳遞到另外一個類的過程

爲何須要繼承機制

funtion Person(firstName, lastName) {
    this.firstName = firstName
    this.lastName = lastName
  }
  Person.prototype.sayHi = function() {
    return "Hi" + this.firstName + " " + this.lastName;
  }

  function Student(firstName, lastName){
    return Person.apply(this, arguments);
}

Student.prototype.sayHi = function(){
    return "Hi " + this.firstName + " " + this.lastName;
}
複製代碼

咱們真的須要在學生身上從新定義sayHi嗎?這彷佛重複…… 那怎麼辦？

function Person(firstName, lastName){
    this.firstName = firstName;
    this.lastName = lastName;
}

Person.prototype.sayHi = function(){
    return "Hi " + this.firstName + " " + this.lastName;
}
複製代碼

將一個對象的原型屬性指定爲另外一個對象的原型屬性!

function Student(firstName, lastName){
    return Person.apply(this, arguments);
}

Student.prototype = Person.prototype;

var s1 = new Student('李','哈')
s1.sayHi() // "Hi 李 哈"
複製代碼

有用:)!

繼續看看 在Student prototype對象上添加一些別的

Student.prototype.status = function(){
    return 'I am currently a student'
  }
複製代碼

讓咱們用Person建立一個對象

var p1 = new Person('下','啦')
  p1.status() // 'I am currently a student'
複製代碼

哦哦……爲何Person原型有student原型的屬性?學生繼承的是人，而不是人。

問題

• 咱們不能將一個對象分配給另外一個對象——它只會建立一個引用!
• 若是咱們改變Student.prototype，會影響Person.prototype
• 咱們仍然須要來自父類原型的全部方法和屬性，可是咱們想要兩個徹底獨立的對象——而不是引用!

一個更好的選擇Object.create

建立一個全新的函數並接受它的第一個參數，即新建立對象的原型對象。

function Student(firstName, lastName){
    return Person.apply(this, arguments);
}

Student.prototype = Object.create(Person.prototype);
Student.prototype.status = function(){
    return "I am currently a student!"
}
var p1 = new Person('李', '哈');
p1.status; // undefined 
複製代碼

Student.prototype 不會影響 Person.prototype !

思考爲何不是new?

function Student(firstName, lastName){
    return Person.apply(this, arguments);
}

Student.prototype = new Person();
// 1. Person被執行了兩次
// 2. 代碼重複，增長了多餘的不須要的屬性在Student的原型對象上面
複製代碼

優化一下

function Student(firstName, lastName){
    return Person.apply(this, arguments);
}

Student.prototype.sayHi = function(){
    return "Hello " + this.firstName + " " + this.lastName;
}

Student.prototype = Object.create(Person.prototype);
Student.prototype.constructor; // Person
Student.prototype.constructor = Student;
複製代碼

繼承的兩個要點

• 將原型設置爲使用另外一個原型建立的對象
• 重置構造函數屬性

總結

• 每次使用new關鍵字時，在建立的對象和構造函數的prototype屬性之間創建一個連接——能夠使用__proto__訪問這個連接
• prototype對象包含一個名爲構造函數的屬性，該屬性指向構造函數
• 爲了共享由構造函數建立的對象的屬性和方法，將它們放在原型中，由於它是最有效的。
• 要將方法和屬性從一個原型對象傳遞到另外一個原型對象，咱們能夠使用繼承，其中包括使用對象將prototype屬性設置爲新建立的對象。建立並從新設置構造函數屬性