JavaScript中设置器和获取器

在JavaScript中,setters 和 getters 是对象属性的特殊方法,用于定义如何访问和设置对象的属性。这些方法使得可以在对对象属性执行读取或写入操作时添加自定义逻辑。

举例

首先我们定义一个类似之前银行家的一个对象

const account = {
  owner: 'ITshare',
  movements: [100, 1200, 550, 130],

  get latest() {
    return this.movements.slice(-1).pop();
  },

  set latest(mov) {
    this.movements.push(mov);
  },
};
console.log(account.latest);
account.latest = 50;
console.log(account.movements);

JavaScript中设置器和获取器_第1张图片

实例

我们可以在之前的构造函数上去使用这个属性

class PersonCl {
  constructor(firstName, birthYear) {
    this.firstName = firstName;
    this.birthYear = birthYear;
  }

  cacleAge() {
    console.log(2037 - this.birthYear);
  }

  greet() {
    console.log(`Hey ${this.firstName}`);
  }

  get age() {
    return 2037 - this.birthYear;
  }
}

const ITshare = new PersonCl('ITshare', 1998);
console.log(ITshare);
ITshare.cacleAge();
console.log(ITshare.age);

console.log(ITshare.__proto__ === PersonCl.prototype);

JavaScript中设置器和获取器_第2张图片

● 不仅如此,setter还可以作为数据验证使用

class PersonCl {
  constructor(fullName, birthYear) {
    this.fullName = fullName;
    this.birthYear = birthYear;
  }

  cacleAge() {
    console.log(2037 - this.birthYear);
  }

  greet() {
    console.log(`Hey ${this.firstName}`);
  }

  get age() {
    return 2037 - this.birthYear;
  }

  set fullName(name) {
    if (name.includes(' ')) this._fullName = name;
    else alert(`!!!请输入你的全名`);
  }
}

const ITshare = new PersonCl('ITshare', 1998);
console.log(ITshare);

JavaScript中设置器和获取器_第3张图片这样并不会创建这个用户
JavaScript中设置器和获取器_第4张图片

你可能感兴趣的:(JavaScript,javascript,开发语言,ecmascript)