更新 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;
}

我有一个class练习，其中有一个属性个集合，它是一个Set类型的对象数组。

所以我从练习中创建了一个新对象 class 然后将该对象传递给一个函数，其目的是更新设置的对象并将属性 "repsCompleted" 设置为 5 .

然后我console.log exercise对象，才发现repsCompleted是undefined。我不明白为什么。

这是一个 fiddle 代码：

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

Answer 1

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

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

如果你想隐藏sets 属性，就像你在Set class中隐藏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;
}

更新 JavaScript 中的嵌套对象属性

Update Nested Object Property in JavaScript

javascript

ecmascript-6

es6-class

更新 JavaScript 中的嵌套对象 属性

Update Nested Object Property in JavaScript

javascript

ecmascript-6

es6-class

更新 JavaScript 中的嵌套对象属性