本文實(shí)例講述了JS中類的靜態(tài)方法，靜態(tài)變量，實(shí)例方法，實(shí)例變量區(qū)別與用法。分享給大家供大家參考，具體如下：

1.類的靜態(tài)方法

先來段代碼之后分析

// JS類靜態(tài)函數(shù)function BaseClass() {}// 類添加add函數(shù)BaseClass.add = function() { console.log('BaseClass add()方法被調(diào)用');};// 類方法(類的靜態(tài)函數(shù))直接調(diào)用// 類名.類方法名BaseClass.add(); //BaseClass add()方法被調(diào)用var instance = new BaseClass();// 實(shí)例不能調(diào)用類方法(即類的靜態(tài)方法)//instance.add();

a.類的靜態(tài)方法通過[類名.類方法名稱]賦值；b.調(diào)用時(shí)用[類名.類方法名稱()]直接調(diào)用；C.類的實(shí)例無法調(diào)用類的靜態(tài)函數(shù)。 原因：因在js中function也是對象，即給函數(shù)對象添加了一個(gè)函數(shù)

2.類的靜態(tài)成員

先來段代碼之后分析

// JS類的靜態(tài)成員變量function BaseClass(params) {}// 類添加靜態(tài)變量nameTestBaseClass.nameTest = 'jadeshu';// 類的靜態(tài)變量直接調(diào)用// 類名.類變量名console.log(BaseClass.nameTest); // jadeshuvar instance = new BaseClass();// 實(shí)例不能調(diào)用類的靜態(tài)成員變量)console.log(instance.nameTest); // undefined

a.類的靜態(tài)變量通過[類名.類變量名稱]賦值；b.調(diào)用時(shí)用[類名.類變量名稱]直接調(diào)用；C.類的實(shí)例調(diào)用類的靜態(tài)變量為undefined。 -----原因：因在js中function也是對象，即給函數(shù)對象添加了一個(gè)屬性

3.實(shí)例方法(兩種情況)I.單個(gè)實(shí)例的方法

// JS的單個(gè)實(shí)例方法function BaseClass() {}var instance1 = new BaseClass();// 單個(gè)實(shí)例添加成員方法instance1.add = function (params) { console.log('BaseClass類實(shí)例的add方法被調(diào)用' + params);};instance1.add(11222); // BaseClass類實(shí)例的add方法被調(diào)用11222var instance2 = new BaseClass();//instance2.add(); // Error: instance2.add is not a functionII.所有實(shí)例創(chuàng)建時(shí)都創(chuàng)建了同名的方法

// JS所有實(shí)例的共享方法function BaseClass() { // 所有實(shí)例創(chuàng)建時(shí)都創(chuàng)建了同名的方法 this.add = function (params) { console.log('BaseClass類實(shí)例的add方法被調(diào)用' + params); };}var instance1 = new BaseClass();instance1.add(11); // BaseClass類實(shí)例的add方法被調(diào)用11var instance2 = new BaseClass();//實(shí)例1和實(shí)例2各有一個(gè)add函數(shù)的本地方法instance2.add(22); // BaseClass類實(shí)例的add方法被調(diào)用22console.log(instance1.add === instance2.add); // false

方法也是每個(gè)實(shí)例各存在一個(gè)，占用內(nèi)存，這既沒有必要，又浪費(fèi)系統(tǒng)資源，所以不建議這樣添加實(shí)例的本地方法，或者在外部定義函數(shù)，然后直接賦給一個(gè)變量即可，就可以做到所有創(chuàng)建的實(shí)例都引用一份代碼，但這樣做代碼不優(yōu)雅。

// JS所有實(shí)例的共享方法function add(params){ console.log('BaseClass類實(shí)例的add方法被調(diào)用' + params);}function BaseClass() { // 所有實(shí)例創(chuàng)建時(shí)都創(chuàng)建了同名的方法 this.add = add;}var instance1 = new BaseClass();instance1.add(11); // BaseClass類實(shí)例的add方法被調(diào)用11var instance2 = new BaseClass();//實(shí)例1和實(shí)例2則共用add函數(shù)的代碼instance2.add(22); // BaseClass類實(shí)例的add方法被調(diào)用22console.log(instance1.add === instance2.add); // true

單個(gè)實(shí)例添加方法建議直接如第一種方法，如果是共享方法就加入prototype屬性上[即js中采用原型]。

4.實(shí)例變量(兩種情況)---即是實(shí)例的本地屬性I.單個(gè)實(shí)例的變量

// JS的單個(gè)實(shí)例成員變量function BaseClass() {}var instance1 = new BaseClass();// 單個(gè)實(shí)例添加成員變量instance1.nameTest = 'jadeshu';console.log(instance1.nameTest); // jadeshuvar instance2 = new BaseClass();console.log(instance2.nameTest); // instance2.nameTest is undefinedII.所有實(shí)例創(chuàng)建的時(shí)候都創(chuàng)建了同名的各自本地屬性變量

// JS所有實(shí)例共享的成員變量function BaseClass() { // 所有實(shí)例創(chuàng)建時(shí)都有的同名實(shí)例變量 this.nameTest = 'jadeshu';}var instance1 = new BaseClass();instance1.nameTest = 'shu'; // 改變實(shí)例1的變量nameTest的值為shuconsole.log(instance1.nameTest); // shuvar instance2 = new BaseClass();//實(shí)例1和實(shí)例2各自都有一個(gè)nameTestconsole.log(instance2.nameTest);; // jadeshu

感興趣的朋友可以使用在線HTML/CSS/JavaScript代碼運(yùn)行工具：http://tools.jb51.net/code/HtmlJsRun測試上述代碼運(yùn)行效果。

更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《javascript面向?qū)ο笕腴T教程》、《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)》

希望本文所述對大家JavaScript程序設(shè)計(jì)有所幫助。