天天看點

JavaScript中對面向對象的基礎知識(2)一、封裝2、通過原型prototype3、在類的外部通過.文法添加

一、封裝

對于ES5來說,沒有class的概念,并且由于js的函數級作用域(在函數内部的變量在函數外通路不到),是以我們就可以模拟 class的概念,在ES5中,類其實就是儲存了一個函數的變量,這個函數有自己的屬性和方法。将屬性和方法組成一個類的過程就是封裝。

簡而言之,封裝就是把客觀事物封裝成抽象的類,隐藏屬性和方法的實作細節,僅對外公開接口。

1、通過構造函數添加

javascript提供了一個構造函數(Constructor)模式,用來在建立對象時初始化對象。

構造函數其實就是普通的函數,隻不過有以下的特點:

  • 首字母大寫(建議構造函數首字母大寫,即使用大駝峰命名,非構造函數首字母小寫)
  • 内部使用this
  • 使用 new生成執行個體

通過構造函數添加屬性和方法實際上也就是通過this添加的屬性和方法。因為this總是指向目前對象的,是以通過this添加的屬性和方法隻在目前對象上添加,是該對象自身擁有的。是以我們執行個體化一個新對象的時候,this指向的屬性和方法都會得到相應的建立,也就是會在記憶體中複制一份,這樣就造成了記憶體的浪費。

function Cat(name,color){
        this.name = name;
        this.color = color;
        this.eat = function () {
            alert('吃老鼠')
        }
    }
           

2、通過原型prototype

在類上通過 this的方式添加屬性和對象會導緻記憶體浪費的問題,我們就考慮,有什麼方法可以讓執行個體化的類所使用的方法直接使用指針指向同一個方法。于是,就想到了原型的方式。

 function Cat(name,color){
    this.name = name;
    this.color = color;
  }
  Cat.prototype.type = "貓科動物";
  Cat.prototype.eat = function(){
       alert("吃老鼠")
       };
           

3、在類的外部通過.文法添加

我們還可以在類的外部通過. 文法進行添加,因為在執行個體化對象的時候,并不會執行到在類外部通過. 文法添加的屬性,是以執行個體化之後的對象是不能通路到. 文法所添加的對象和屬性的,隻能通過該類通路。

注意:

通過構造函數、原型和. 文法三者都可以在類上添加屬性和方法。但是三者是有一定的差別的。

構造函數:通過this添加的屬性和方法總是指向目前對象的,是以在執行個體化的時候,通過this添加的屬性和方法都會在記憶體中複制一份,這樣就會造成記憶體的浪費。但是這樣建立的好處是即使改變了某一個對象的屬性或方法,不會影響其他的對象(因為每一個對象都是複制的一份)。

原型:通過原型繼承的方法并不是自身的,我們要在原型鍊上一層一層的查找,這樣建立的好處是隻在記憶體中建立一次,執行個體化的對象都會指向這個prototype 對象,但是這樣做也有弊端,因為執行個體化的對象的原型都是指向同一記憶體位址,改動其中的一個對象的屬性可能會影響到其他的對象

文法:在類的外部通過. 文法建立的屬性和方法隻會建立一次,但是這樣建立的執行個體化的對象是通路不到的,隻能通過類的自身通路

原文:https://blog.csdn.net/sunshine940326/article/details/72872386

繼續閱讀