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) {
}
// 類添加靜態變量nameTest
BaseClass.nameTest = "jadeshu";
// 類的靜態變量直接調用
// 類名.類變量名
console.log(BaseClass.nameTest); // jadeshu
var 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方法被調用11222
var instance2 = new BaseClass();
//instance2.add(); // Error: instance2.add is not a function

II.所有實例創建時都創建了同名的方法

// JS所有實例的共享方法
function BaseClass() {
  // 所有實例創建時都創建了同名的方法
  this.add = function (params) {
    console.log("BaseClass類實例的add方法被調用" + params);
  };
}
var instance1 = new BaseClass();
instance1.add(11); // BaseClass類實例的add方法被調用11
var instance2 = new BaseClass();
//實例1和實例2各有一個add函數的本地方法
instance2.add(22); // BaseClass類實例的add方法被調用22
console.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方法被調用11
var instance2 = new BaseClass();
//實例1和實例2則共用add函數的代碼
instance2.add(22); // BaseClass類實例的add方法被調用22
console.log(instance1.add === instance2.add); // true

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

4.實例變量(兩種情況)---即是實例的本地屬性

I.單個實例的變量

// JS的單個實例成員變量
function BaseClass() {
}
var instance1 = new BaseClass();
// 單個實例添加成員變量
instance1.nameTest = "jadeshu";
console.log(instance1.nameTest); // jadeshu
var instance2 = new BaseClass();
console.log(instance2.nameTest); // instance2.nameTest is undefined

II.所有實例創建的時候都創建了同名的各自本地屬性變量

// JS所有實例共享的成員變量
function BaseClass() {
  // 所有實例創建時都有的同名實例變量
  this.nameTest = "jadeshu";
}
var instance1 = new BaseClass();
instance1.nameTest = "shu"; // 改變實例1的變量nameTest的值為shu
console.log(instance1.nameTest);  // shu
var instance2 = new BaseClass();
//實例1和實例2各自都有一個nameTest
console.log(instance2.nameTest);; // jadeshu

以上是“JS中類的靜態方法，靜態變量，實例方法，實例變量有哪些區別”這篇文章的所有內容，感謝各位的閱讀！希望分享的內容對大家有幫助，更多相關知識，歡迎關注億速云行業資訊頻道！