Javascript

Question

如果有人问过这个问题，请告诉我。如何在每个实例上递增 class 变量？假设我有以下键 class，我想在创建实例时递增键变量，我试过：

class Key{
    key = 1
    constructor(){
        this.key = key
        Key.key++
    }

    print_key(){
        console.log(this.key)
    }
}

然后我打印 make 几个实例：

key1 = new Key()
key2 = new Key()
key3 = new Key()

key1.print_key()
key2.print_key()
key3.print_key()

期望的结果是：

1
2
3

以上代码不起作用，我找不到具体的答案，或者某些答案似乎对我不起作用。

Answer 1

您可以使用静态属性来记住已经创建了多少，然后在初始化 key 实例属性时使用它。 static class properties 仍处于第 3 阶段，因此尚未包含在规范中，但已经相当成熟了。

class Key {
    // The static property
    static lastKey = 0;
    
    // The instance property using the class fields proposal syntax
    // Note I didn't initialize it with 1, that's a bit misleading.
    key;
    
    constructor() {
        // Increment and assign
        this.key = ++Key.lastKey;
    }

    print_key() {
        console.log(this.key)
    }
}

const key1 = new Key();
const key2 = new Key();
const key3 = new Key();

key1.print_key();
key2.print_key();
key3.print_key();

不过请注意，任何地方的任何代码都可以分配给 Key.lastKey 以更改下次使用的值。

如果您想将其设为私有，可以使用 private static class field。这些也处于第 3 阶段，但距离相当远：

class Key {
    // The static property
    static #lastKey = 0;

    // The instance property using the class fields proposal syntax
    // Note I didn't initialize it with 1, that's a bit misleading.
    key;

    constructor() {
        // Increment and assign
        this.key = ++Key.#lastKey;
    }

    print_key() {
        console.log(this.key)
    }
}

const key1 = new Key();
const key2 = new Key();
const key3 = new Key();

key1.print_key();
key2.print_key();
key3.print_key();

Stack Snippets 没有插件来处理它，所以 here's an example on the Babel REPL.

在该代码中，只有 Key代码可以访问#lastKey。

或者只使用范围函数：

const Key = (() => {
    // Only code within this anonymous function has access to `lastKey`
    let lastKey = 0;
    return class Key {
        // The instance property using the class fields proposal syntax
        // Note I didn't initialize it with 1, that's a bit misleading.
        key;

        constructor() {
            // Increment and assign
            this.key = ++lastKey;
        }

        print_key() {
            console.log(this.key)
        }
    }
})();

const key1 = new Key();
const key2 = new Key();
const key3 = new Key();

key1.print_key();
key2.print_key();
key3.print_key();

这仍然依赖于 class fields proposal（正如您在问题中所做的那样）。如果你想要一个纯 ES2015 解决方案，只需删除 key 声明：

const Key = (() => {
    // Only code within this anonymous function has access to `lastKey`
    let lastKey = 0;
    return class Key {
        constructor() {
            // Increment and assign
            this.key = ++lastKey;
        }

        print_key() {
            console.log(this.key)
        }
    }
})();

const key1 = new Key();
const key2 = new Key();
const key3 = new Key();

key1.print_key();
key2.print_key();
key3.print_key();

Answer 2

您可以在 class 之外存储对密钥的引用。例如，整个脚本可能如下所示：

var key = 1
class Key {
    constructor(key){
        this.key = key
    }

    print_key(){
        console.log(this.key)
    }
}
key1 = new Key(key)
key++
key2 = new Key(key)
key++
key3 = new Key(key)
key++
key1.print_key()
key2.print_key()
key3.print_key()

执行此操作的另一种方法可能是保留一个键数组。需要注意的重要一点是，一个对象的实例对同一类型对象的其他实例一无所知——它不知道存在多少相同类型对象的实例，因此该值必须存储在其他地方。您的代码将 'key' 的值设置为 1，但该行代码用于每个新实例，而不仅仅是第一个实例。有帮助吗？

Answer 3

您想要的结果不正确，因为 javascript 中的每个 class 都有自己的上下文 this 并且每次您创建 class 的新实例时，例如：

const key1 = new Key()

你创建了新的上下文。

因此，如果您需要多次递增并且想要使用 class，则需要为 class 添加方法。

class MyClass {
  constructor() {
    this.value = 1;
  }
  // method for increment value
  increment() {
    this.value+=1;
  }
  
  // method for print your value
  print() {
    console.log(this.value)
  }
}

const myClass = new MyClass();

myClass.print(); // print initial value
myClass.increment(); // print initial value
myClass.print(); // print incremented value

详情请阅读Doc

Javascript - 在每个实例上递增 class 变量

Javascript - increment class variable on every instance

class

ecmascript-6

es6-class