ES9:JavaScript 使用 getters 和 setters 进行对象值的访问和更新

在 ES9 中,JavaScript 增加了一种新的对象属性访问方法,即 getters 和 setters。使用这种方法,我们可以更加灵活地访问和更新对象的属性值。

什么是 getters 和 setters

getters 和 setters 是 JavaScript 中的两个特殊函数,通过这两个函数我们可以对对象属性进行更加灵活的访问和更新。

  • getters: 读取对象属性值时调用的函数。
  • setters: 更新对象属性值时调用的函数。

使用 getters 和 setters 可以帮助我们更好地控制属性的访问和更新,避免一些潜在的问题。

如何使用 getters 和 setters

使用 getters 和 setters 很简单,我们只需要在对象中定义一个属性,并将其设置为一个函数即可。这个函数就是我们的 getter 或 setter。

下面是一个使用 getter 和 setter 的示例:

----- --- - -
  ------ ------
  --- ------ -
    ---------------- -------
    ------ -----------
  --
  --- ----------- -
    ---------------- -------
    ---------- - ------
  -
--

---------------------- -- -- ---- ----- - -----
-------- - -------- -- -- ---- -----
---------------------- -- -- ---- ----- - -------

在上面的示例中,我们定义了一个对象 obj,其中包含一个属性 namename 的值实际上是 _name,而使用 getter 和 setter 可以帮助我们更好地控制对 _name 的访问和更新。

get name() 中,我们输出了一段信息并返回了 _name 的值。在 set name(value) 中,我们同样输出了一段信息,并将 _name 的值设置为了 value

使用 console.log(obj.name) 可以看到,在访问 obj.name 时,会先调用 get name(),输出一段信息,然后返回 _name 的值。

使用 obj.name = 'Jerry' 可以看到,在更新 obj.name 时,会先调用 set name(value),输出一段信息,然后将 _name 的值设置为 value

getters 和 setters 的指导意义

使用 getters 和 setters 可以帮助我们更好地控制对象属性的访问和更新,避免一些潜在的问题。

例如,我们可以在 setter 中对属性值进行验证,防止非法的值被设置。又例如,我们可以使用 getter 计算属性值,而不需要在对象中保存额外的变量。

下面是一个使用 getter 计算属性值的示例:

----- --- - -
  -------- --
  --- ---------- -
    ------ ------------ - --
  --
  --- --------------- -
    ------------ - ----- - --
  -
--

-------------------------- -- -- -
------------ - --
------------------------- -- -- -

在上面的示例中,我们定义了一个对象 obj,其中包含一个属性 diameterdiameter 的值实际上是 _radius 的两倍,而使用 getter 可以帮助我们计算出这个值。

get diameter() 中,我们返回了 _radius 的两倍。在 set diameter(value) 中,我们将 _radius 的值设置为了 value / 2

使用 console.log(obj.diameter) 可以看到,在访问 obj.diameter 时,会计算出 _radius 的两倍的值,然后返回。

使用 obj.diameter = 4 可以看到,在更新 obj.diameter 时,会将 _radius 的值设置为 4 / 2,即 2

总结

getters 和 setters 是 JavaScript 中的两个特殊函数,通过这两个函数我们可以对对象属性进行更加灵活的访问和更新。使用 getters 和 setters 可以帮助我们更好地控制属性的访问和更新,避免一些潜在的问题。在实际开发中,我们可以使用 getters 和 setters 来提高代码的可读性和可维护性。

来源:JavaScript中文网 ,转载请注明来源 本文地址:https://www.javascriptcn.com/post/65d0191badd4f0e0ff92906a