在 JavaScript 中更新嵌套对象属性

Question

我有以下一段代码：

class Set {
  constructor() {
    console.log("New Set!");
  }

  get repsCompleted() {
    return this._repsCompleted;
  }

  set repsCompleted(value) {
    this._repsCompleted = value;
  }
}

class Exercise {
  constructor(name) {
    console.log(name);
    this.name = name;
  }

  get sets() {
    return [new Set(), new Set(), new Set()]
  }
}

let barbellSquat = new Exercise("Barbell Squat");
let updatedBarbellSquat = updateRepsCompleted(barbellSquat);

console.log(updatedBarbellSquat);

function updateRepsCompleted(exercise) {
  for (var i = 0; i < exercise.sets.length; i++) {
    exercise.sets[i].repsCompleted = 5;
  }

  return exercise;
}

我有一个课堂练习，里面有一个属性sets，它是一个Set类型的对象数组。

所以我从Exercise 类中创建了一个新对象，然后将该对象传递给一个函数，该函数的目的是更新设置的对象并将属性“repsCompleted”设置为5。

然后我 console.log 这个练习对象，却发现 repsCompleted 是未定义的。我不知道为什么。

代码如下：

https://jsfiddle.net/the_archer/a09tpr63/10/

Answer 1

您不应该对sets 使用getter。每次读取或分配相应的属性时都会使用 getter 或 setter，以允许您自定义该属性的工作方式。 getter 不仅在第一次访问属性时使用。

因此，每次使用 exercise.sets 时，它都会创建一个包含 3 个空 Set 对象的新数组。 sets 应该是一个普通属性，因此您每次都可以检索相同的值。你可以在构造函数中初始化它。

如果您想隐藏sets 属性，就像您在Set 类中对repsCompleted 所做的那样，您可以使用相同的方法：为实际属性使用不同的名称，并定义一个getter 和setter访问它。你也可以通过检查属性是否已经设置来懒惰地初始化它。

class Set {
  constructor() {
    console.log("New Set!");
  }

  get repsCompleted() {
    return this._repsCompleted;
  }

  set repsCompleted(value) {
    this._repsCompleted = value;
  }
}

class Exercise{
  constructor(name) {
    this.name = name;
    this._sets = null;
  }
  
  get sets() {
    if (!this._sets) {
      this._sets = [new Set(), new Set(), new Set()];
    }
    return this._sets;
  }
  
  set sets(value) {
    this._sets = value;
  }
}

let barbellSquat = new Exercise("Barbell Squat");
let updatedBarbellSquat = updateRepsCompleted(barbellSquat);

console.log(updatedBarbellSquat);

function updateRepsCompleted(exercise) {
  for (var i = 0; i < exercise.sets.length; i++) {
    exercise.sets[i].repsCompleted = 5;
  }

  return exercise;
}