JS `defineProperty` 和 `prototype`

JavaScript 中的对象是动态的,新属性可以在任何时候添加到现有对象上。然而,我们需要一些机制来控制这些属性的行为和访问方式。在这种情况下,Object.defineProperty() 方法和原型(prototype)链扮演了重要的角色。

Object.defineProperty()

通过使用 Object.defineProperty() 方法,您可以定义/修改一个对象的属性,并指定该属性的特性(例如:可枚举、可写、可配置等)。此方法接受三个参数:

-------------------------- ----- -----------
  • obj: 要定义属性的对象。
  • prop: 要定义的属性的名称。
  • descriptor: 描述符对象,它包含要定义的属性的特性。

属性特性

一个属性描述符对象包含以下可选的属性:

  • value: 属性值
  • writable: 是否可写
  • get: 获取函数
  • set: 设置函数
  • configurable: 是否可删除或是否能再次修改属性特性
  • enumerable: 是否可被 for...in 遍历或 Object.keys() 返回

示例代码

让我们定义一个 car 对象,并设置它的属性:

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

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

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

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

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

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

在上述示例中,我们定义了一个名为 make 的不可写属性,这意味着我们不能修改它的值。

get 和 set 方法

您还可以使用 getset 方法来定义属性。这些方法允许您对获取和设置属性值的行为进行自定义操作。下面是一个例子:

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

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

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

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

在上述示例中,我们定义了一个名为 fullName 的属性,并使用 getset 方法自定义了对它的访问方式。get 方法返回 firstNamelastName 属性的合并值,而 set 方法将 fullName 字符串拆分成组成它的两部分,并更新相应的属性。

原型(prototype

JavaScript 原型链是一种机制,用于实现继承和代码重用。每个对象都有一个原型对象,通过 prototype 属性进行访问。

当您尝试访问对象的属性时,如果该对象没有该属性,则 JavaScript 引擎将查找原型链中每个对象,直到找到具有该属性的对象为止。

示例代码

下面是一个例子:

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

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

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

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

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

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

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

在上述示例中,我们创建了一个基类 Animal 和一个派生类 CatCat 类继承自 `Animal

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