撿起JavaScript(2)

如何在JavaScript中使用面向對象思想

在ES6標準出現以前，全部想在JavaScript中使用面向對象思想來定義變量，惟一的途經就是使用new XXX()，其中XXX是一個方法名。例如：

function ABC() {}
var abc = new ABC()

有的小夥伴會想：咦？我明明能夠使用的是var obj = {}來聲明一個對象變量啊，怎麼能說new 方法名是惟一途經呢？

其實JS提供了一個語法糖，var obj = {} 和 var abc = new Object()是一個意思。同時，說明了一個問題Object是一個方法名。經過以下的代碼，證實了咱們的猜測。

Object instanceof Function
// true

好了，咱們再次回來，咱們定義了一個方法ABC，那麼JS幫咱們對這個ABC作了哪些操做了？

能夠很顯然地發現JS內核對方法ABC添加了不少屬性，其中最重要的就是prototype，它也是一個對象。

咱們發現ABC.prototype中有constructor屬性就是以前聲明的ABC方法。

ok!如今我在草稿紙上畫一下ABC和ABC.prototype之間的關係。

你會問這個有什麼用？咱們先拋開這個問題，引入一個問題在JavaScript面向對象思想裏，如何定義變量和方法？

function ABC() {
    this.name = 'hello',
    this.say = function() {
        console.log('ABC say... ')
    }
}
var abc = new ABC()
------
console.log(abc.name) // hello
abc.say()  // ABC say...

若是你回答結束，我會問還有呢？

function ABC() {}
ABC.prototype .name = 'hello'
ABC.prototype.say = () => { console.log('ABC say... ')}
------
console.log(abc.name) // hello
abc.say()  // ABC say...

咱們發現這是兩個相同的結果。經過這個例子就能夠發現方法ABC的prototype的做用。

用於來補充擴展以前定義的類，即定義的方法。

這裏有個問題，爲何變量 var abc會調用到ABC的name和say屬性？這就是下一節來補充的。