JS如何定義一個‘類’?

來源:酷知科普網 5.03K

Javascript(JS)是一個指令碼語言,在網頁開發中有很重要的作用。它能夠像Java,這些高階語言一樣,可以定義類嗎?我們可以用JS的phototype來模擬定義一個類,下面一起來看下。

操作方法

(01)我們先用function來定義一個物件:people,該物件有一個屬性,叫name,程式碼如圖。

JS如何定義一個‘類’?

(02)然後用phototype為這個物件新增二個方法,setName和 sayHi,其中setName方法是把物件的屬性name做修改,用方法傳進來的引數賦值。sayHi方法則是在控制檯輸出資訊。

JS如何定義一個‘類’? 第2張

(03)上面二步就相當於定義了一個類了,該類有一個屬性,和二個方法。我們用new關鍵字來建立一個people類的例項:var p1 = new people();然後看是否可以訪問到類的屬性,程式碼如圖

JS如何定義一個‘類’? 第3張

(04)執行頁面,可以看到控制檯上有輸出類屬性的預設值,所以我們的類例項可以直接訪問到屬性。

JS如何定義一個‘類’? 第4張

(05)然後新增程式碼,分別呼叫類的二個方法,如圖,看能否通過類的方法來設定屬性值。

JS如何定義一個‘類’? 第5張

(06)再次執行頁面,可以看到控制檯輸出資訊,也就是說我們呼叫setName方法成功把屬性的值修改了。

JS如何定義一個‘類’? 第6張

(07)一個類,我們可以用new關鍵字創建出多個例項,每個例項間的屬性是不會相互影響的,程式碼如圖,建立了二個例項。

JS如何定義一個‘類’? 第7張

(08)執行頁面,從輸出中可以看到,二個例項有自己的name屬性,各自不影響。

JS如何定義一個‘類’? 第8張
熱門標籤