JS中類的靜態方法,靜態變量,實例方法,實例變量區別與用法實例分析
本文實例講述了JS中類的靜態方法,靜態變量,實例方法,實例變量區別與用法。分享給大家供大家參考,具體如下:
1.類的靜態方法先來段代碼之后分析
// JS類靜態函數function BaseClass() {}// 類添加add函數BaseClass.add = function() { console.log('BaseClass add()方法被調用');};// 類方法(類的靜態函數)直接調用// 類名.類方法名BaseClass.add(); //BaseClass add()方法被調用var instance = new BaseClass();// 實例不能調用類方法(即類的靜態方法)//instance.add();
a.類的靜態方法通過[類名.類方法名稱]賦值;b.調用時用[類名.類方法名稱()]直接調用;C.類的實例無法調用類的靜態函數。 原因:因在js中function也是對象,即給函數對象添加了一個函數
2.類的靜態成員先來段代碼之后分析
// JS類的靜態成員變量function BaseClass(params) {}// 類添加靜態變量nameTestBaseClass.nameTest = 'jadeshu';// 類的靜態變量直接調用// 類名.類變量名console.log(BaseClass.nameTest); // jadeshuvar instance = new BaseClass();// 實例不能調用類的靜態成員變量)console.log(instance.nameTest); // undefined
a.類的靜態變量通過[類名.類變量名稱]賦值;b.調用時用[類名.類變量名稱]直接調用;C.類的實例調用類的靜態變量為undefined。 -----原因:因在js中function也是對象,即給函數對象添加了一個屬性
3.實例方法(兩種情況)I.單個實例的方法// JS的單個實例方法function BaseClass() {}var instance1 = new BaseClass();// 單個實例添加成員方法instance1.add = function (params) { console.log('BaseClass類實例的add方法被調用' + params);};instance1.add(11222); // BaseClass類實例的add方法被調用11222var instance2 = new BaseClass();//instance2.add(); // Error: instance2.add is not a functionII.所有實例創建時都創建了同名的方法
// JS所有實例的共享方法function BaseClass() { // 所有實例創建時都創建了同名的方法 this.add = function (params) { console.log('BaseClass類實例的add方法被調用' + params); };}var instance1 = new BaseClass();instance1.add(11); // BaseClass類實例的add方法被調用11var instance2 = new BaseClass();//實例1和實例2各有一個add函數的本地方法instance2.add(22); // BaseClass類實例的add方法被調用22console.log(instance1.add === instance2.add); // false
方法也是每個實例各存在一個,占用內存,這既沒有必要,又浪費系統資源,所以不建議這樣添加實例的本地方法,或者在外部定義函數,然后直接賦給一個變量即可,就可以做到所有創建的實例都引用一份代碼,但這樣做代碼不優雅。
// JS所有實例的共享方法function add(params){ console.log('BaseClass類實例的add方法被調用' + params);}function BaseClass() { // 所有實例創建時都創建了同名的方法 this.add = add;}var instance1 = new BaseClass();instance1.add(11); // BaseClass類實例的add方法被調用11var instance2 = new BaseClass();//實例1和實例2則共用add函數的代碼instance2.add(22); // BaseClass類實例的add方法被調用22console.log(instance1.add === instance2.add); // true
單個實例添加方法建議直接如第一種方法,如果是共享方法就加入prototype屬性上[即js中采用原型]。
4.實例變量(兩種情況)---即是實例的本地屬性I.單個實例的變量// JS的單個實例成員變量function BaseClass() {}var instance1 = new BaseClass();// 單個實例添加成員變量instance1.nameTest = 'jadeshu';console.log(instance1.nameTest); // jadeshuvar instance2 = new BaseClass();console.log(instance2.nameTest); // instance2.nameTest is undefinedII.所有實例創建的時候都創建了同名的各自本地屬性變量
// JS所有實例共享的成員變量function BaseClass() { // 所有實例創建時都有的同名實例變量 this.nameTest = 'jadeshu';}var instance1 = new BaseClass();instance1.nameTest = 'shu'; // 改變實例1的變量nameTest的值為shuconsole.log(instance1.nameTest); // shuvar instance2 = new BaseClass();//實例1和實例2各自都有一個nameTestconsole.log(instance2.nameTest);; // jadeshu
感興趣的朋友可以使用在線HTML/CSS/JavaScript代碼運行工具:http://tools.jb51.net/code/HtmlJsRun測試上述代碼運行效果。
更多關于JavaScript相關內容感興趣的讀者可查看本站專題:《javascript面向對象入門教程》、《JavaScript錯誤與調試技巧總結》、《JavaScript數據結構與算法技巧總結》、《JavaScript遍歷算法與技巧總結》及《JavaScript數學運算用法總結》
希望本文所述對大家JavaScript程序設計有所幫助。
相關文章:
