JavsScript 对象操作-FunTeaLearn Online Web Tutorials

JavsScript 对象操作

JavaScript 中的对象是存储数据和相关方法的一种方式。对象可以看作是一个键值对的集合，其中每个键都是一个字符串，而对应的值可以是任何类型的数据。

创建对象

创建对象的基本语法有两种：使用对象字面量和使用构造函数。

使用对象字面量

对象字面量是一种快速创建对象的方式，它通过花括号 {} 来定义对象及其属性。

const person = {
    name: "张三",
    age: 30,
    sayHello: function() {
        console.log(`你好，我是${this.name}。`);
    }
};

使用构造函数

构造函数是一种更通用的方式来创建对象。构造函数是一种特殊的函数，主要用于在创建新对象时初始化对象的属性。

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

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

访问对象属性

有几种方法可以访问对象的属性：

点符号

这是最常见的方式，用于访问对象的属性。

console.log(person.name); // 输出 "张三"

方括号符号

方括号符号允许使用变量或表达式来访问属性。

const propertyName = "name";
console.log(person[propertyName]); // 输出 "张三"

修改对象属性

修改对象属性可以通过点符号或方括号符号来完成。

person.age = 31; // 修改年龄
person["age"] = 32; // 同样可以修改年龄

添加新属性

可以像修改现有属性一样添加新的属性。

person.gender = "male"; // 添加性别属性
person["height"] = 180; // 也可以用方括号添加属性

删除对象属性

使用 delete 关键字可以删除对象的属性。

delete person.age;

遍历对象属性

for-in 循环

对于对象来说，使用 for-in 循环可以遍历其所有的可枚举属性。

for (let key in person) {
    if (person.hasOwnProperty(key)) {
        console.log(`${key}: ${person[key]}`);
    }
}

Object.keys()

Object.keys() 方法会返回一个由一个给定对象的所有可枚举属性组成的数组，然后你可以使用这个数组来遍历对象的属性。

const keys = Object.keys(person);
keys.forEach(key => {
    console.log(`${key}: ${person[key]}`);
});

属性描述符

JavaScript 的对象属性可以具有不同的特性，这些特性被称为属性描述符。属性描述符可以通过 Object.getOwnPropertyDescriptor() 方法获取，并且可以通过 Object.defineProperty() 方法设置。

const descriptor = Object.getOwnPropertyDescriptor(person, "name");
console.log(descriptor); // 输出属性描述符对象

// 设置属性描述符
Object.defineProperty(person, "name", {
    writable: false,
    value: "李四"
});

原型链与继承

JavaScript 中的继承是基于原型链的。每个对象都有一个内部链接指向另一个对象，这个被指向的对象叫做原型。原型对象同样拥有自己的原型，这样就形成了原型链。

创建原型

Person.prototype.sayGoodbye = function() {
    console.log(`再见，我是${this.name}。`);
};

zhangsan.sayGoodbye(); // 输出 "再见，我是张三。"

继承

通过原型链，子类对象可以访问父类对象的属性和方法。

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

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

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

通过以上章节的学习，你应该掌握了 JavaScript 对象的基础知识以及如何操作它们。这为学习更复杂的概念如模块、框架等打下了坚实的基础。

Feed
back