JS对象属性的解析与运用

说到项目经验，绝大多数人都是处于没有项目的状态。多数人会选择每天肝项目，但是市面上却又充满了太多枯燥无味且没有新意的项目。不如我来给大家提供一个项目吧——深入JS对象属性！附上搭建教程。

JS 对象属性决定其状态，本文将着眼于这些属性的工作机制。JS 涵盖三种不同的属性：数据属性、访问器属性与内部属性。对象的普通属性，即数据属性，将字符串名称映射到值。比方说，下面对象 obj 有一个数据属性，名为 prop，值是 10。

<#code>const obj = {prop:10};

而访问器属性，则允许自定义 getter 与 setter。它们让 JavaScript 对象以一种接近于“面向对象的方式”，获取与设置属性。getter 方法会在尝试访问其属性时调用，而 setter 方法则会在尝试赋值时调用。

来看一个例子：

<#code>const person = { firstName: "John", lastName: "Doe", get fullName() { return this.firstName + " " + this.lastName; }, set fullName(value) { const parts = value.split(" "); this.firstName = parts[0]; this.lastName = parts[1]; } };

第三种属性，即内部属性，仅能在 JavaScript 对象内部访问，用于内部实现。由于它们只可内部访问，因此无需操心。

当创建对象属性时，可分配三个属性符：值、可写性和可枚举性。对于数据属性，值符便是属性的值。可写性描述符确定属性值是否可更改。而可枚举性描述符则决定属性是否在循环中可见，比如使用 for...in 语句。

对象属性也是对象，可以拥有自己的属性。这是 JS 对象的固有特性，叫做“原型”。所有的 JS 对象都有一个原型，原型本身也是一个对象。当对象属性没有所需属性时，则会检查其原型是否有该属性。

<#code>const obj = { prop: 10, get doubleProp() { return this.prop * 2; } }; console.log(obj.doubleProp); // 20

在此示例中，obj 对象有一个名为 doubleProp 的访问器属性。该属性依赖 prop 属性，而后者是一个数据属性。所以，访问 obj.doubleProp 时，首先要找到名为 prop 的属性，然后利用该值计算并返回结果。