JavaScript 类级字段

在任何面向对象的编程语言中，类可以有私有和公有字段。字段只是保存信息的变量。面向对象编程语言中有两种类型的字段，即实例字段和静态字段。实例成员属于特定实例。

示例： 如果我们创建3个实例（对象），则内存中将有3个副本的实例字段，而无论我们创建多少个实例，静态字段始终只有一个副本。简而言之，静态变量是所有对象都共有的变量。

私有实例字段： 默认情况下，类的所有属性都是公共的，并且可以在类外部修改。因此，为了声明一个私有类字段，我们需要使用#前缀。

语法：

#variableName

让我们来看下面的示例:

Javascript

<script>
class IncrementCounter {
 
    // Private variable
    #value = 0;
 
    // Public variable
    Count = 0;
 
    Increment() {
        this.#value++;
    }
}
 
const counter = new IncrementCounter();
 
// Raises an error
console.log(counter.#value);
 
// Calling the increment function
counter.increment();
 
// Printing the private variable value
console.log(counter.#value);
</script>

输出：

console.log(counter.#value);   
^   
SyntaxError: Private field ‘#value’ must be declared in an enclosing class   
at wrapSafe (internal/modules/cjs/loader.js:1054:16)   
at Module._compile (internal/modules/cjs/loader.js:1102:27)   
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1158:10)   
at Module.load (internal/modules/cjs/loader.js:986:32)   
at Function.Module._load (internal/modules/cjs/loader.js:879:14)   
at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:71:12)   
at internal/main/run_main_module.js:17:47

解释： 在上面的示例中，我们使用 # 来声明一个私有变量。运行上述脚本将显示一个错误，错误信息为“私有字段 ‘#value’ 必须在封闭类中声明”，因为我们试图在类外部访问一个私有变量。所以我们尝试通过定义一个函数来获取该值，代码如下：

JavaScript代码：

<script>
class IncrementCounter {
    #value = 0;
 
    increment() {
        this.#value++;
    }
 
    value() {
 
        // Returning the value of
        // a private variable
        return this.#value;
    }
}
 
const counter = new IncrementCounter();
 
// Calling the function value()
console.log(counter.value());
 
// Calling the function increment()
counter.increment();
 
// Calling the function value()
console.log(counter.value());
</script>

输出：

0
1

私有的静态字段： 静态字段可以使用关键字static来创建。有时静态字段也会被保持隐藏，你可以将它们设为私有。

语法：

static #staticFieldName

让我们来看下面的示例：

Javascript

<script>
class User {
 
    // Private static field of string type
    static #name = "";
 
    // Private static field
    static #age
 
    // Constructor function
    Person(user_name, user_age) {
        User.#name = user_name;
        User.#age = user_age;
        return User.#name + ' ' + User.#age;
    }
}
 
// Create an object user1
user1 = new User();
console.log(user1.Person("John", 45));
 
// Create an object user2
user2 = new User()
console.log(user1.Person("Mark", 35));
</script>

输出：

John 45
Mark 35

解释： 要调用静态字段，我们需要使用构造类的名称。在上面的示例中，我们使用关键字static和#为私有字段创建了一个私有静态字段名称，并将其初始化为一个空字符串。类似地，我们创建了一个私有静态字段age。现在为了调用上面创建的字段，我们使用构造类User的名称作为User.#name和User.#age。

公有实例字段： 默认情况下，类的所有属性都是公有的，可以在类外部轻松访问。您可以在声明变量时初始化变量的值。

让我们看下面的示例：

Javascript

<script>
class IncrementCounter {
 
    // Public instance field
    value = 1;
 
    Increment() {
        return this.value++;
    }
}
 
const counter = new IncrementCounter();
 
// Accessing a public instance field
console.log(counter.value);
 
// Calling the Increment function
counter.Increment();
 
// Printing the updated value
console.log(counter.value);
</script>

输出：

1
2

解释： 在上面的示例中，value被声明为公共实例，并初始化为1，所以我们可以很容易地通过 counter.value 进行访问。对于公共实例字段，在构造函数、方法以及类外部没有访问和修改的限制。

公共静态字段： 如之前讨论的，静态字段通过使用static关键字来创建，形式为static staticFieldName。

让我们看下面的示例：

Javascript

<script>
class Example {
 
    // Private static field
    static value = 42;
}
 
// Accessing a public static field using
// name of the Constructor class
console.log(Example.value)
 
console.log(Example.value === 42);
</script>

输出：