JavaScript 对象

❮ 上一个 下一个 ❯

现实生活中的对象

在现实生活中，对象是指：房子、汽车、人、动物或任何其他主体。

这是一个汽车对象的例子

汽车对象

属性

方法

car.name = 菲亚特car.model = 500car.weight = 850kgcar.color = 白色

car.start()car.drive()car.brake()car.stop()

对象属性

现实生活中的汽车具有属性，例如重量和颜色

car.name = 菲亚特，car.model = 500，car.weight = 850kg，car.color = 白色。

汽车对象具有相同的属性，但值因汽车而异。

对象方法

现实生活中的汽车具有方法，例如启动和停止

car.start(), car.drive(), car.brake(), car.stop().

汽车对象具有相同的方法，但这些方法是在不同时间执行的。

JavaScript 变量

JavaScript 变量是数据值的容器。

此代码将简单值 (Fiat) 赋给名为 car 的变量

示例

let car = "Fiat";

自己动手试一试 »

JavaScript 对象

对象也是变量。但对象可以包含许多值。

此代码将许多值 (Fiat, 500, white) 赋给名为 car 的对象

示例

const car = {type:"Fiat", model:"500", color:"white"};

自己动手试一试 »

注意

使用 const 关键字声明对象是一种常见的做法。

在章节：JS Const 中了解更多关于在对象中使用 const 的信息。

JavaScript 对象定义

如何定义 JavaScript 对象

使用对象字面量

使用 new 关键字

使用对象构造函数

JavaScript 对象字面量

对象字面量是花括号 {} 内的名称:值对列表。

{firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"}

注意

名称:值对也称为键:值对。

对象字面量也称为对象初始化器。

创建 JavaScript 对象

这些示例创建了一个具有 4 个属性的 JavaScript 对象

示例

// 创建一个对象const person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};

自己动手试一试 »

空格和换行符不重要。对象初始化器可以跨多行

// 创建一个对象const person = { firstName: "John", lastName: "Doe", age: 50, eyeColor: "blue"

};

自己动手试一试 »

此示例创建了一个空的 JavaScript 对象，然后添加了 4 个属性

// 创建一个对象const person = {};

// 添加属性person.firstName = "John";person.lastName = "Doe";person.age = 50;person.eyeColor = "blue";

自己动手试一试 »

使用 new 关键字

此示例使用 new Object() 创建了一个新的 JavaScript 对象，然后添加了 4 个属性

示例

// 创建一个对象const person = new Object();

// 添加属性person.firstName = "John";person.lastName = "Doe";person.age = 50;person.eyeColor = "blue";

自己动手试一试 »

注意

上面的例子做的事情完全一样。

但是，没有必要使用 new Object()。

为了可读性、简单性和执行速度，请使用对象字面量方法。

对象属性

JavaScript 对象中的命名值称为属性。

属性

值

firstName

John

lastName

Doe

age

50

eyeColor

blue

以名称值对形式写入的对象类似于

PHP 中的关联数组

Python 中的字典

C 中的哈希表

Java 中的哈希映射

Ruby 和 Perl 中的哈希

访问对象属性

您可以通过两种方式访问对象属性

objectName.propertyName

objectName["propertyName"]

示例

person.lastName;

自己动手试一试 »

person["lastName"];

自己动手试一试 »

JavaScript 对象方法

方法是可以对对象执行的动作。

方法是作为属性值存储的函数定义。

属性

属性值

firstName

John

lastName

Doe

age

50

eyeColor

blue

fullName

function() {return this.firstName + " " + this.lastName;}

示例

const person = { firstName: "John", lastName : "Doe", id : 5566, fullName : function() { return this.firstName + " " + this.lastName; }

};

自己动手试一试 »

在上面的示例中，this 指的是person 对象

this.firstName 表示 person 的 firstName 属性。

this.lastName 表示 person 的 lastName 属性。

在 JavaScript 中，对象为王。

如果你理解对象，你就理解 JavaScript。

对象是属性和方法的容器。

属性是命名值。

方法是作为属性存储的函数。

属性可以是原始值、函数，甚至是其他对象。

在 JavaScript 中，几乎“一切”都是对象。

对象就是对象

数学是对象

函数是对象

日期是对象

数组是对象

Map 是对象

Set 是对象

除了原始值之外，所有 JavaScript 值都是对象。

JavaScript 原始值

原始值是没有属性或方法的值。

3.14 是一个原始值

原始数据类型是具有原始值的数据。

JavaScript 定义了 7 种原始数据类型

string

数字

boolean

null

undefined

symbol

bigint

不可变

原始值是不可变的（它们是硬编码的，不能更改）。

如果 x = 3.14，您可以更改 x 的值，但不能更改 3.14 的值。

值类型注释

"Hello"string"Hello" 永远是 "Hello"

3.14数字3.14 永远是 3.14

truebooleantrue 永远是 true

falsebooleanfalse 永远是 false

nullnull (对象)null 永远是 null

undefinedundefinedundefined 永远是 undefined

JavaScript 对象是可变的

对象是可变的：它们通过引用而不是通过值寻址。

如果 person 是一个对象，则以下语句不会创建 person 的副本

const x = person;

对象 x 不是 person 的副本。对象 x 就是 person。

对象 x 和对象 person 共享相同的内存地址。

对 x 的任何更改也会更改 person

示例

//创建一个对象const person = { firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"

}

// 创建一个副本const x = person;

// 同时更改两者中的 Agex.age = 10;

自己动手试一试 »

注意

您将在后续章节中学习更多关于对象的内容。

通过练习来测试自己

练习

通过从 person 对象中提取信息，弹窗显示 "John"。

const person = {

firstName: "John",

lastName: "Doe"

};

alert();

提交答案 »

开始练习

❮ 上一个 下一个 ❯

★ +1

W3schools 学习路径

跟踪您的进度 - 免费！

登录 注册