从另一个类属性计算的类属性（ES6）

Question

我有一个带有构造函数的类，如下所示：

class Bookshelf {  
 constructor(author, publisher) {
  this.books = [],
  this.numBooks = this.books.length
  this.author = author,
  this.publsiher = publisher
 }
}

我没有找回我真正想做的 book 数组的价值。我知道this 导致价值没有被抓取，但我真的很想知道为什么？

Answer 1

根据标题，我将这个问题解释为在您创建的Bookshelf 中向books 添加条目后，为什么numBooks 没有更新。

当您运行语句this.numBooks = this.books.length 时，它确实将一个名为numBooks 的属性设置为计算值this.books.length，即0。稍后，您可能会向books 添加一个值，但这不会影响numBooks。

问题不在于 从另一个计算一个“类属性”，而在于 了解 numBooks 存储一个数字，并且该数字不会自动更新 >。你的构造函数运行一次，就是这样。

比较一下：

class Bookshelf {  
 constructor(author, publisher) {
  this.books = [];
  this.author = author;
  this.publisher = publisher;
 }

 getNumBooks() {
  return this.books.length;
 }
}

let myBookshelf = new Bookshelf("Isaac Asimov", "Bantam Press");
myBookshelf.books.push("I, Robot");
console.log(myBookshelf.getNumBooks());   // prints 1

因为您对getNumBooks() 的调用会运行代码，它可以计算动态值this.books.length，这就是为什么它会为您提供一个最新值，而属性numBooks 不会自动更新。如果您希望将numBooks 保留为属性，您还可以选择将books 属性设为私有，而是公开一个addBook 函数，该函数会添加一本书并相应地重置numBooks。

正如 Patrick 在 cmets 中提醒我的那样，由于您指定了 ES6，因此您可以使用 getter syntax 编写一个像属性一样起作用的函数。这是有效的，因为当您引用 numBooks 时它会运行代码，即使语法隐藏了该细节。

class Bookshelf {  
 constructor(author, publisher) {
  this.books = [];
  this.author = author;
  this.publisher = publisher;
 }

 get numBooks() {
  return this.books.length;
 }
}

let myBookshelf = new Bookshelf("Isaac Asimov", "Bantam Press");
myBookshelf.books.push("I, Robot");
console.log(myBookshelf.numBooks());   // prints 1