为什么要在JS中使用getter / setter而不直接访问属性?

时间:2019-09-19 11:40:16

标签: javascript logic

请先仔细阅读,然后重复!!

因此以下两个代码是等效的,并提供相同的结果:

1

const menu = {
    _courses: {
        appetizers: [],
        mains: [],
        desserts: [],
    },

    get appetizers() {
      return this._courses.appetizers;
    },
    set appetizers(appetizer) {
        this._courses.appetizers= appetizer;
    }
}

menu.appetizers.push(['food']);
console.log(menu.appetizers);

2

const menu = {
    _courses: {
        appetizers: [],
        mains: [],
        desserts: [],
    },
}

menu._courses.appetizers.push(['food']);
console.log(menu._courses.appetizers);

第一种方法使用getter / setter而第二种直接访问属性,所以我的问题是..对我来说,第二种方法更容易理解,那么为什么getter / setter是“更好”的方式?

有很多线程提出为什么应该使用getter / setter的方法,但是我很想知道我给出的示例中哪种方法更好?

2 个答案:

答案 0 :(得分:-1)

字母和setter是数据抽象,并为验证检查提供了机会。

示例:

根据我的评论,

  

我想创建一个属性年龄,该属性只能接受数字

以下是一个示例,该示例为有关类属性的可能值的类属性添加了智能。这是getter和setter有用的简单用例之一

function SimplePerson(name, age) {
  this.name = name;
  this.age = age;
}

function SmartPerson(name, age) {
  // Private validators
  function isNameValid(value) {
    return /^[a-z']+$/i.test(value);
  }

  function isAgeValid(value) {
    return /\d+/.test(value)
  }

  // Private property
  var name = '';
  var age;
  Object.defineProperty(this, 'name', {
    get: function() {
      return name;
    },
    set: function(value) {
      if (isNameValid(value)) {
        name = value;
      } else {
        console.log('Value passed for Name is incorrect')
      }
    }
  })

  Object.defineProperty(this, 'age', {
    get: function() {
      return name;
    },
    set: function(value) {
      if (isAgeValid(value)) {
        name = value;
      } else {
        console.log('Value passed for Age is incorrect')
      }
    }
  })
  
  this.name = name;
  this.age = age;
}

var simplePerson = new SimplePerson(123, 'Foo Bar');
var smartPerson = new SmartPerson(123, 'Foo Bar');

console.log(simplePerson, smartPerson)

答案 1 :(得分:-1)

由于getter / setter赋予了在设置/获取值之前编写逻辑的更多自由。即您可以检查等的类型。

Why use getters and setters in JavaScript

  

使用getter或setter与使用标准函数之间的区别在于,getter / setter在赋值时自动被调用。因此,它看起来就像一个普通属性,但在幕后您可以在分配之前或之后运行额外的逻辑(或检查)。

     

因此,如果您决定将这种额外的逻辑添加到已被引用的现有对象属性之一中,则可以将其转换为getter / setter样式,而无需更改有权访问该属性的其余代码。