JS創(chuàng)建類和對象的兩種不同方式
在JavaScript中, 當(dāng)你定義了一個新的函數(shù), 你實際上聲明了一個新的類, 而這個函數(shù)本身就相當(dāng)于類的構(gòu)造函數(shù)。下面的代碼向你展示了兩種不同的方式來創(chuàng)建一個新的Person類, 而Person.prototype的定義也緊跟在函數(shù)定義之后。
var Person = function(name) { // 一個匿名函數(shù), 并將這個函數(shù)賦值給一個Person變量, 此時Person成為一個類
this.name = name;
}
function Person(name) { // 直接定義一個叫做Person的函數(shù)表示Person類
this.name = name;
}
Person.prototype = { // 定義Person的prototype域
printName: function() { // 定義一個print函數(shù)
alert(this.name);
}
}
當(dāng)你通過函數(shù)的方式聲明了一個類之后, 你就可以通過new操作符來實例化這個類。這樣, 你就可以調(diào)用類的成員函數(shù)來完成你的邏輯。
var person = new Person("Joe Smith"); // 使用new操作符來新建一個Person的實例, 并賦給變量person
person.printName(); // person就可以看作是一個實例的引用(reference), 所以可以通過這個引用來調(diào)用Person類中的成員函數(shù)
我們來總結(jié)一下創(chuàng)建一個新的類的實例的整個流程和步驟:
1. 通過定義一個函數(shù)的方式(匿名或者實名)來聲明一個新的類.
2. 如果有必要, 定義這個新的類的prototype域.
3. 使用new操作符緊跟你所定義的函數(shù)來創(chuàng)建一個新的類的實例. 一旦JavaScript編譯器碰到了new操作符, 它實際上創(chuàng)建了一個空的類實例變量.
4. 將所有這個類的prototype域中的屬性與方法復(fù)制到這個新的實例中, 并將其成員函數(shù)中所有的this指針指向這個新創(chuàng)建的實例.
5. 接下來, 執(zhí)行緊跟在new操作符后面的那個函數(shù).
6. 當(dāng)你執(zhí)行這個函數(shù)時, 如果你試圖對一個不存在的屬性進行賦值, JavaScript編譯器將自動為你在這個實例范圍內(nèi)新創(chuàng)建這個屬性.
7. 函數(shù)執(zhí)行完畢后, 將這個初始化完成的實例返回.
在Prototype中, 使用Class對象, 你可以以一個比較簡單的方式來聲明一個新的對象。通過使用Class.create(), prototype為你創(chuàng)建了一個默認(rèn)的構(gòu)造函數(shù)initialize(), 一旦你實現(xiàn)這一函數(shù), 就可以以一個類似Java中構(gòu)造函數(shù)的方式來創(chuàng)建一個新的類的實例。
- 跟我學(xué)習(xí)javascript創(chuàng)建對象(類)的8種方法
- JavaScript 創(chuàng)建對象和構(gòu)造類實現(xiàn)代碼
- JavaScript 常見對象類創(chuàng)建代碼與優(yōu)缺點分析
- JS OOP包機制,類創(chuàng)建的方法定義
- JavaScript創(chuàng)建類/對象的幾種方式概述及實例
- 創(chuàng)建js對象和js類的方法匯總
- Javascript創(chuàng)建類和對象詳解
- JavaScript構(gòu)造函數(shù)詳解
- JS面向?qū)ο蠡A(chǔ)講解(工廠模式、構(gòu)造函數(shù)模式、原型模式、混合模式、動態(tài)原型模式)
- JS中的構(gòu)造函數(shù)詳細(xì)解析
- 深入理解javascript構(gòu)造函數(shù)和原型對象
- JavaScript 面向?qū)ο蟪绦蛟O(shè)計詳解【類的創(chuàng)建、實例對象、構(gòu)造函數(shù)、原型等】
相關(guān)文章
JavaScript高級程序設(shè)計(第3版)學(xué)習(xí)筆記 概述
在JavaScript面世之初,沒有人會想到它會被應(yīng)用的如此廣泛,也遠(yuǎn)比一般人想象中的要復(fù)雜強大的多,在我自己學(xué)習(xí)的過程中,曾經(jīng)有過多次震撼2012-10-10
在JavaScript中操作時間之getYear()方法的使用教程
這篇文章主要介紹了在JavaScript中操作時間之getYear()方法的使用教程,是JS入門學(xué)習(xí)中的基礎(chǔ)知識,需要的朋友可以參考下2015-06-06
從零學(xué)JSON之JSON數(shù)據(jù)結(jié)構(gòu)
這篇文章主要介紹了JSON數(shù)據(jù)結(jié)構(gòu)的相關(guān)知識,需要的朋友可以參考下2014-05-05

