Skip to content
Shimon's BlogShimon's Blog
主页
杂谈
  • 主页
      • 代码笔记
          • 代码学习教程
              • JavaScript 教程
                  • 快速上手
                    • Map 和 Set
                      • 函数
                        • 变量
                          • 基本语法
                            • 字符串
                              • 实战
                                • 对象
                                  • 更多介绍
                                  • 布尔值
                                    • 循环
                                      • 快速上手
                                        • 数据类型
                                          • 数组
                                            • 条件判断
                                              • 遍历
                                              • 错误处理
                                              • 如何学习一门计算机语言

                                            对象

                                            Shimon Zhan2019年9月17日
                                            • JavaScript
                                            • 快速上手
                                            大约 3 分钟

                                            此页内容
                                            • 更多介绍

                                            JavaScript 的对象是一种无序的集合数据类型,它由若干键值对组成。

                                            JavaScript 用一个 {...} 表示一个对象,键值对以 xxx: xxx 形式申明,用 , 隔开。

                                            JavaScript 的对象可用于描述现实世界中的某个对象。例如,为了描述 Shimon Zhan,我们可以用若干键值对来描述他:

                                            const mrhope = {
                                              name: "Shimon Zhan",
                                              isHandsome: true,
                                              birth: 1998,
                                              school: "No.1 Middle School",
                                              height: 1.76,
                                              weight: 50,
                                              car: null,
                                            };
                                            

                                            注意

                                            最后一个键值对不需要在末尾加 ,,如果加了,有的浏览器(如低版本的 IE)将报错。

                                            上述对象申明了一个 name 属性,值是 'Shimon Zhan',birth 属性,值是 1998,以及其他一些属性。最后,把这个对象赋值给变量 mrhope 后,就可以通过变量 mrhope 来获取 Shimon Zhan 的属性了:

                                            mrhope.name; // 'Shimon Zhan'
                                            mrhope.birth; // 1998
                                            

                                            访问属性是通过 . 操作符完成的,但这要求属性名必须是一个有效的变量名。如果属性名包含特殊字符,就必须用 '' 括起来:

                                            const mrshope = {
                                              name: "Mrs.Hope",
                                              "middle-school": "No.1 Middle School",
                                            };
                                            

                                            mrshope 的属性名 middle-school 不是一个有效的变量,就需要用 '' 括起来。访问这个属性也无法使用 . 操作符,必须用 ['xxx'] 来访问:

                                            mrshope["middle-school"]; // 'No.1 Middle School'
                                            mrshope["name"]; // 'Mrs.Hope'
                                            mrshope.name; // 'Mrs.Hope'
                                            

                                            也可以用 mrshope['name'] 来访问 mrshope 的 name 属性,不过 mrshope.name 的写法更简洁。我们在编写 JavaScript 代码的时候,属性名尽量使用标准的变量名,这样就可以直接通过 object.prop 的形式访问一个属性了。

                                            实际上 JavaScript 对象的所有属性都是字符串,不过属性对应的值可以是任意数据类型。

                                            如果访问一个不存在的属性会返回什么呢? JavaScript 规定,访问不存在的属性不报错,而是返回 undefined:

                                            "use strict";
                                            
                                            const mrhope = {
                                              name: "Shimon Zhan",
                                            };
                                            
                                            console.log(mrhope.name);
                                            console.log(mrhope.house); // undefined
                                            

                                            由于 JavaScript 的对象是动态类型,您可以自由地给一个对象添加或删除属性:

                                            const mrhope = {
                                              name: "Shimon Zhan",
                                            };
                                            
                                            mrhope.age; // undefined
                                            mrhope.age = 22; // 新增一个 age 属性
                                            mrhope.age; // 22
                                            delete mrhope.age; // 删除 age 属性
                                            mrhope.age; // undefined
                                            delete mrhope["name"]; // 删除 name 属性
                                            mrhope.name; // undefined
                                            delete mrhope.school; // 删除一个不存在的 school 属性也不会报错
                                            

                                            如果我们要检测 mrhope 是否拥有某一属性,可以用 in 操作符:

                                            const mrhope = {
                                              name: "Shimon Zhan",
                                              birth: 1998,
                                              school: "No.1 Middle School",
                                              height: 1.76,
                                              weight: 50,
                                              car: null,
                                            };
                                            
                                            "name" in mrhope; // true
                                            "grade" in mrhope; // false
                                            

                                            不过要小心,如果 in 判断一个属性存在,这个属性不一定是 mrhope 的,它可能是 mrhope 继承得到的:

                                            "toString" in mrhope; // true
                                            

                                            因为 toString 定义在 object 对象中,而所有对象最终都会在原型链上指向 object,所以 mrhope 也拥有 toString 属性。

                                            要判断一个属性是否是 mrhope 自身拥有的,而不是继承得到的,可以用 hasOwnProperty() 方法:

                                            const mrhope = {
                                              name: "Shimon Zhan",
                                            };
                                            
                                            mrhope.hasOwnProperty("name"); // true
                                            mrhope.hasOwnProperty("toString"); // false
                                            

                                            # 更多介绍

                                            更系统的介绍详见 数据结构 / 对象

                                            上次编辑于: 2022/4/19 07:13:07
                                            贡献者: ShimonZhan
                                            上一页
                                            实战
                                            下一页
                                            布尔值
                                            Copyright © 2021-present Shimon Zhan