iT邦幫忙

2023 iThome 鐵人賽

DAY 25
0
自我挑戰組

轉職仔與JavaScript的初次相遇系列 第 25

JavaScript的Constructor prototype inheritance(構造函式的原型繼承-下) - Day25

  • 分享至 

  • xImage
  •  

前言

今天會針對昨天的Constructor prototype inheritance(構造函式的原型繼承)例子,進行近一步解釋

說明

首先先看例子

function Person(name, age){
  this.name = name;
  this.age = age;
}

Person.prototype.sayHi = function(){
  console.log(this.name + '說您好');
};

function Student(name, age, major, grade){
  this.major = major;
  this.grade = grade;
  Person.call(this, name, age);
}

Student.prototype = Object.create(Person.prototype)
let jeremy = new Student('Jeremy Hung', 27, "Engineering", 3.7);
jeremy.sayHi() // Jeremy Hung說您好

這邊要提,在設定Student.prototype時,為何要使用Object.create(),創造一個新Object呢?
若是使用

Student.prototype = Person.prototype

則會變成不論是Student或是Person都能有major, grade屬性
但我們要的是Person和Student有各自專屬的屬性和方法
因此才會使用

Object.create(Person.prototype)

讓Student.prototype和Person.prototype是兩個分別『獨立的』Object


上一篇
JavaScript的Constructor prototype inheritance(構造函式的原型繼承-上) - Day24
下一篇
JavaScript的Class繼承 - Day27
系列文
轉職仔與JavaScript的初次相遇30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言