首頁  >  文章  >  web前端  >  JavaScript如何建立物件?實例化物件的方法

JavaScript如何建立物件?實例化物件的方法

青灯夜游
青灯夜游原創
2018-11-20 11:24:375571瀏覽

這篇文章帶給大家的內容是介紹JavaScript如何建立對象,讓大家了解用js建立並實例化物件的三種方法。有一定的參考價值,有需要的朋友可以參考一下,希望對你們有幫助。

在語法方面上,JavaScript是一種靈活的物件導向語言。在我們介紹JavaScript創建並實例化物件的不同方法之前,我們需要注意的是JavaScript是一種無類別語言,函數會以某種方式被使用,以便它們模擬一個類別。 【相關影片教學推薦:JavaScript教學

#使用函數作為類別:

這是在JavaScript中建立並實例化物件最簡單的方法之一。我們定義了一個經典的JavaScript函數,並使用new關鍵字建立了該函數的物件;再使用this關鍵字建立函數的屬性和方法。

<script> 
    // 作为一个类的功能。
    function copyClass(name, age) { 
        this.name = name; 
        this.age = age; 
        this.printInfo = function() { 
            console.log(this.name); 
            console.log(this.age); 
        } 
    } 
  
// 创建copyClass的对象
// 初始化参数
var obj = new copyClass("Vineet", 20); 
  
//调用copyClass对象的方法
obj.printInfo(); 
</script>

執行結果:

JavaScript如何建立物件?實例化物件的方法

#說明:

類別有兩個主要組成部分:特定的參數和很少的成員函數。在這個方法中,我們聲明了一個類似於類別的函數,它有兩個參數,name和age(這個關鍵字用於將類別的名稱和年齡與所提供的參數的名稱和年齡區分開來);以及一個printInfo方法,用於列印這些參數的值。然後,我們簡單地建立一個copyClass的物件obj,初始化它,並呼叫它的方法。

使用物件字面量(object literal):

#literal是定義物件的更小更簡單的方法。

下面我們用物件文字來建立並實例化一個與前一個物件完全相同的物件。

<script> 
    // 创建对象
    var obj = { 
        name : "", 
        age : "", 
        printInfo : function() { 
            console.log(this.name); 
            console.log(this.age); 
        } 
    } 
  
// 初始化参数
obj.name = "小明"; 
obj.age = 19; 
  
// 使用对象的方法
obj.printInfo(); 
</script>

執行結果:

JavaScript如何建立物件?實例化物件的方法

#說明:

此方法與前一個方法的工作原理其實是相同的,但不是將參數(name和age)和方法(printInfo)綁定到函數內部,而是將它們綁定到物件本身中,可以始化物件並簡單地使用這些方法。

使用函數的單例:

第三種方式就是我們已經看到的另外兩種方式的組合。我們可以使用函數來定義單一物件。

<script> 
// 创建单个对象
var obj = new function() { 
        this.name = ""; 
        this.age = ""; 
        this.printInfo = function() { 
            console.log(this.name); 
            console.log(this.age); 
   }; 
} 
  
// 初始化对象
obj.name = "小明"; 
obj.age = 20; 
  
// 对象的调用方法
obj.printInfo(); 
</script>

運行結果:

JavaScript如何建立物件?實例化物件的方法

說明:

這是前兩種方法的組合,我們將方法和參數綁定在函數中,但不為其聲明單獨的函數(就像方法1中的copyClass)。相反,我們簡單地使用函數結構來宣告一個物件。

總結:以上就是這篇文章的全部內容,希望能對大家的學習有所幫助。

以上是JavaScript如何建立物件?實例化物件的方法的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn