JavaScript 对象：从基础认知到内置方法实战

在 JavaScript 里，对象（Object）是存放多个值的容器，也是这门语言中最基础的数据类型之一。你可以把它想象成一个带标签的抽屉柜，每个抽屉里放着不同的东西，而标签就是属性名（key），抽屉里的东西就是属性值（value）。

与数字、字符串这类原始类型（Primitive Types）不同，对象属于引用类型（Reference Type）。正因为是引用类型，才会出现“可变性”“浅拷贝”这些在实际开发中容易踩坑的特性。

一、对象的本质与创建方式

对象的组成
每个对象都由若干组 属性（Property） 构成。属性由键名和键值组成，键值可以是任何数据类型：字符串、数字、布尔值、数组、函数，甚至是另一个对象。这也正是对象的强大之处——它可以层层嵌套，构建出复杂的数据结构。

创建对象的三种常用方式

1. 对象字面量（Object Literal）
这是最常用、最直观的方式，也是我平时写代码时的优选。它用花括号 {} 包裹一组键值对，代码简洁，一目了然。

<script>
// 创建一个“代码号学习平台”的课程对象
const codeCourse = {
  courseName: "JavaScript 进阶实战",
  price: 299,
  isPublished: true,
  // 方法也是属性，只是它的值是一个函数
  showInfo: function() {
    document.writeln(`课程：${this.courseName}，价格：${this.price}元<br>`);
  }
};

codeCourse.showInfo();
</script>

个人见解： 在项目初期或定义单个独立对象时，用对象字面量是很舒服的。它没有额外的语法开销，直观清晰，适合表示配置项、请求参数、局部数据等场景。

2. 使用 new 关键字 + 构造函数（Constructor Function）
当你需要创建多个结构相似的对象时，构造函数就派上用场了。这里的关键字 new 承担了“实例化”的角色。

<script>
// 定义一个构造函数，用来创建“课程”对象
function Course(title, author, price) {
  this.title = title;
  this.author = author;
  this.price = price;
  this.getIntro = function() {
    document.writeln(`《${this.title}》- 讲师：${this.author}，价格：${this.price}元<br>`);
  };
}

// 用 new 关键字创建多个实例
const jsCourse = new Course("JavaScript 核心原理", "陈老师", 399);
const pyCourse = new Course("Python 快速入门", "李老师", 199);

jsCourse.getIntro();
pyCourse.getIntro();
</script>

3. 利用 Object.create() 基于原型创建对象
这种方式相对进阶一些，但很能体现 JavaScript 原型继承（Prototypal Inheritance）的本质。它允许你基于一个已有的对象作为原型，创建新对象。

<script>
// 定义原型对象
const courseProto = {
  showType() {
    document.writeln(`课程类型：${this.type}，是否付费：${this.isPaid ? "是" : "否"}<br>`);
  }
};

// 基于原型创建新对象
const freeCourse = Object.create(courseProto);
freeCourse.type = "前端基础";
freeCourse.isPaid = false;
freeCourse.showType();

const paidCourse = Object.create(courseProto);
paidCourse.type = "全栈架构";
paidCourse.isPaid = true;
paidCourse.showType();
</script>

经验分享： 选择哪种创建方式，取决于场景。单次使用选字面量；批量生产选构造函数；想要复用行为逻辑、构建对象之间的原型链，Object.create() 是不错的选择。这三种方式不存在谁“好”谁“坏”，看需求而定。

二、对象的可变性（Mutable）

对象是可变的。这意味着你可以在创建之后，随时修改、添加或删除它的属性。这一点和原始类型不同，原始类型（比如数字、字符串）一旦创建，本身的值无法改变。

<script>
let userInfo = {
  name: "林青",
  role: "学员"
};

// 修改已有属性
userInfo.role = "高级学员";
// 添加新属性
userInfo.level = 5;
// 删除属性
delete userInfo.name;

document.writeln(`当前用户：角色=${userInfo.role}，等级=${userInfo.level}<br>`);
document.writeln(`name属性是否存在：${userInfo.name !== undefined ? "存在" : "已删除"}<br>`);
</script>

三、JavaScript 内置对象方法详解

ES6 之后，Object 这个全局对象上提供了不少实用方法，很多开发者在日常工作中高频使用。

1. Object.keys()：获取所有属性名
返回一个数组，包含对象自身的所有可枚举属性名（key）。在需要遍历对象属性时，它非常方便。

<script>
const courseDetail = {
  course_id: "JS1024",
  title: "Node.js 实战",
  duration_hours: 15
};

const keys = Object.keys(courseDetail);
document.writeln(`属性名列表：${keys}<br>`);
document.writeln(`属性数量：${keys.length}<br>`);
</script>

2. Object.values()：获取所有属性值
与 keys() 对应，它返回的是所有属性值组成的数组。

<script>
const book = {
  name: "深入理解 JavaScript",
  pages: 380,
  language: "中文"
};

const values = Object.values(book);
document.writeln(`属性值列表：${values}<br>`);
</script>

3. Object.entries()：获取键值对数组
这个方法返回的数组，每个元素都是一个 [key, value] 形式的小数组。这在需要同时处理键和值时特别有用，例如配合 for...of 循环。

<script>
const article = {
  id: 101,
  title: "JavaScript 对象详解",
  views: 1250
};

const entries = Object.entries(article);
document.writeln("键值对如下：<br>");
for (let [key, value] of entries) {
  document.writeln(`${key}：${value}<br>`);
}
</script>

4. Object.is()：严格比较两个值是否相等
很多人觉得 === 已经很严格了，但 Object.is() 在个别特殊值上表现更精确。比如它认为 NaN 和 NaN 是相等的（而 NaN === NaN 结果是 false），也能区分 +0 和 -0。

<script>
document.writeln(`Object.is(5, 5) 结果：${Object.is(5, 5)}<br>`);
document.writeln(`Object.is(NaN, NaN) 结果：${Object.is(NaN, NaN)}<br>`);
document.writeln(`Object.is(0, -0) 结果：${Object.is(0, -0)}<br>`);
document.writeln(`=== 比较 0 和 -0 结果：${0 === -0}<br>`);
</script>

四、补充几个实用的内置方法

本节课程知识要点

• 对象是引用类型：赋值时传递的是引用，不是值的副本。修改一个引用会影响所有指向同一对象的变量，这一点在函数传参时尤其要注意。

• 创建方式按需选择：字面量用于静态或独立对象；构造函数用于批量生成相同结构的对象；Object.create() 用于基于原型的继承场景。

• 遍历对象优先用 Object.keys() 或 Object.entries()：相比 for...in 循环，它们更直观，也不会遍历到原型链上的属性（除非你明确需要原型链上的属性）。

• 不要忽略 Object.is() 在边界情况下的价值：在处理 NaN 判断或数值符号敏感的场景时，用它更稳妥。

• 谨慎使用 delete：删除属性会影响对象结构，也会影响性能。如果只是想让某个属性失效，更推荐将其值设为 null 或 undefined。