理解JS中getter和setter的应用

getter 和 setter 存在于大多数面向对象的编程语言里，包括JavaScript。借助于它们以安全的方式来访问对象的属性。使用 getter 可以访问属性值，而 setter 可以修改属性值。本文中，我们会介绍如何在 JavaScript 中创建 getter 和 setter。

如何在JavaScript中创建 getter 和 setter？

一个 JavaScript 对象可以有多个属性和方法，其中属性是键值对格式，而方法是应用在该对象上的函数。

例如 Car.color 是一个属性，而 Car.drive() 是 Car 对象的一个方法。使用 getter 可以访问 Car 对象的 color 属性，你可以修改它的值（例如，从 blue 改为 black）。

使用 getter 和 setter，你只能查询和设置对象中属性的值，但是不适用于对象的方法，因为方法不是静态的。

创建 getter 和 setter 有三种不同的方式：

· 默认的句法（getter 和 setter 方法）

· 使用 get 和 set 关键字

· 使用 Object.defineProperty() 方法

Getter 方法

访问对象属性最容易的方式是为每个属性定义一个获取其值的方法。在下面的例子中，myCar 对象有两个属性：color 和 make。这是以对象字面量的方式创建的对象：

你可以这样直接访问color和make属性：

虽然这样可以工作，不过使用方法来访问而不是直接访问属性有一些好处。例如，你可以在获取属性值之前做一些检查。

你可以为color和make属性定义getter方法，如下：

上面的getter方法中使用了 this 关键字来指向属性所属的对象（在这个例子中是 myCar）。getter 中的 return 语句意味着返回当前对象的 color 或者 make 属性的值。

要访问 myCar 对象的属性，你需要调用这些 getter 方法：

如果需要的话，可以在 getter 方法中增加额外的逻辑。例如，你可以编写一个 getCar() 方法来同时获取这两个属性值：

Setter 方法

除了 getter，你可以使用JavaScript函数来创建 setter 方法。

因为 setter 存在的目的是修改属性的值，它们会以新的参数值为参数。

设置了新的值之后，你可以调用 getter 方法来检查一下是否成功修改了。

get 关键字

使用 get 关键字是创建 getter 的另一种方式。你可以用 get 关键字来定义 myCar.color 和 myCar.make 属性：

get 句法将对象属性绑定到了查询该属性时会被调用的函数。在上面的代码中，查询 myCar 的 color 属性时，会调用对应的函数来返回存储于 defColor 中的数据。

由于旧版 IE （IE 8-）不支持 get 关键字，如果你需要支持旧版浏览器的话，需要使用上面讲到的 getter 方法。

set 关键字

和 get 对应，当你尝试设置属性时，set 句法会对象的属性绑定到要调用的函数。

Object.defineProperty() 方法

你可以用 Object 全局对象的 defineProperty() 方法来为已有的对象设置属性。假设你已经有了一个对象 myCar，它有两个属性 defColor 和 defMake。稍后，我们使用 Object.defineProperty() 方法来增加 getter 和 setter：

实际上，Object.defineProperty() 不仅可以用于已有的对象上，也可以为新对象设置getter 和 setter。这种方式非常强大，特别是你想使用属性描述符时，例如 writable 或者 configurable。

总结

创建JavaScript对象时 getter 和 setter 不是必须的，不过它们在许多场景下很有用。最常见的使用场景是 （1）以安全的方式访问属性（2）在获取和设置属性值之前增加额外的处理逻辑。