Coding / Programming Videos

Post your favorite coding videos and share them with others!

[JavaScript Weird 支線]Day 68 — 物件導向的基礎範例與 class – pvt5r486 – Medium

Source link

ES5 沒有 class 的作法

function dog(name){
this.name = name;
}
dog.prototype.getName = function(){
return this.name;
}
dog.prototype.sayHello = function(){
console.log(this.name + ' say Hello');
}
var d = new dog('abc');
var b = new dog('qqq');
console.log(d);
console.log(d.getName());
d.sayHello();
console.log(d.sayHello === b.sayHello); // true

可以發現差別並不大,直觀來說下半部的程式碼幾乎是一樣的。

主要就是需要宣告一個函式,而這個函式其實就是 ES6 class 內的 constructor 函式。

而在 ES5 的時候,是看使用時有沒有加入建構子 new 來決定是否為 constructor 函式或是一般的函式。

然後除了要宣告一個函式之外,也必須在該函式的 prototype 定義這些狗會做什麼。

接下來進行一些觀察,可以得知跟上面那個例子的結果是一樣的。

至於 prototype 究竟是什麼,下一節才會提到。

Source link

Bookmark(0)
 

Leave a Reply

Please Login to comment
  Subscribe  
Notify of
Translate »