Logo
Section 1 / 6

对象简介

了解对象、其属性以及与对象相关的方法。学习如何从变量创建对象。

导入

对象简介

了解对象、其属性以及与对象相关的方法。学习如何从变量创建对象。

对象是编程中使用的抽象数据类型。它们可以用来表示现实世界中的事物,如人、动物或地点,也可以表示更抽象的概念,如银行账户信息、日期或文件结构。

在某些语言中,比如 Ruby,几乎一切都是对象。没有原始值,只有对象。甚至连数字零也是一个对象。许多其他语言,如 Java,都是基于类的语言。这类语言通过创建类来作为生成该类所有对象的蓝图。例如,一个 Car 类可能规定所有 Car 对象都必须有发动机、四个轮子以及可选的颜色。

JavaScript 不是一种基于类的语言(尽管我们稍后会在课程中看到,也可以定义类)。它允许我们无需先定义类,就能快速简便地创建对象。

属性和方法

对象可以拥有属性和方法。属性是关于对象的信息,而方法是对象能够执行的动作。

...
一只章鱼

章鱼
属性名字:“Octavius” 腿的数量:8
方法游泳 行走 重生断掉的腿(是的,它们真的能做到!)

对象通常用于将相关的信息和功能集中在一起。例如,如果你正在编写涉及正方形的代码,可能会创建一个“正方形”对象。

...
一个正方形

正方形
属性边长:5
方法周长 = 4 × 边长 面积 = 边长 × 边长

在 JavaScript 中创建对象

对象字面量是 JavaScript 语言的一个显著特征,因为它允许我们无需定义类即可快速创建对象,这在许多其他语言中并不常见。对象字面量是一组自包含的相关值。属性可以是几乎任何数据类型,如数字、字符串、布尔值、数组,甚至是其他对象。如果某个属性是一个函数,则它被称为方法。

在 JavaScript 中创建对象字面量,只需输入一对大括号。下面的例子创建了一个空对象,并将其赋值给变量 myObject:

1const myObject = {};

我们不必从空对象开始。可以直接在大括号内添加属性和方法。下面的代码可用于表示一个正方形的信息:

1const square = { 2 sides: 4, 3 length: 5, 4 perimeter: 20, 5 area: 25 6} 7console.log(square);

每个属性都有一个键和对应的值。在上面的例子中,第一个属性的键是 sides,其值为 4。每对键值之间用逗号分隔。

尾随逗号:注意,最后一个键值对后面没有逗号。如今,这种“尾随逗号”是可选的,但在 ECMAScript 5 之前,尾随逗号会导致错误。只要你的代码不需要兼容旧版浏览器(这是一个重要考虑因素),添加尾随逗号在将来可能需要增加更多键值对时会很有用,因为这样就不必记得后来再加逗号了。作为一般规则,本课程中我们将不使用尾随逗号。

方法

方法的写法与其他属性类似,但其值是一个函数。下面的代码展示了如何创建一个对象字面量来表示一只鸭子,并包含一个 quack() 方法:

...
一只鸭子

创建对象字面量

1const duck = { 2 name: 'Quacky', 3 legs: 2, 4 quack: function () { 5 alert('QUACK! QUACK!'); 6 } 7};

还有一种更简洁的语法来定义方法,省略 function 关键字,直接在方法名后加上括号:

定义方法的替代语法

1const duck = { 2 name: 'Quacky', 3 legs: 2, 4 quack() { 5 alert('QUACK! QUACK!'); 6 } 7};

这种写法是 JavaScript 近期才引入的,但由于减少了输入量,已经变得非常流行。

再猜一次

还记得我们迷你“猜谁”游戏中那四位角色吗?

...
猜谁?

我们可以为每个人创建一个对象。每个对象都包含描述其姓名的属性,以及布尔值来表示是否戴眼镜或戴帽子。例如,以下对象代表 Alfie:

1const alfie = { 2 yourName: 'Alfie', 3 picture: '🤵🏽‍♂️', 4 glasses: false, 5 hat: false 6} 7console.log(alfie);

使用已有变量创建对象

我们还可以使用已存在的变量来创建对象,如下例所示:

1const yourName = 'Dumbo'; 2const legs = 4; 3const fly = () => console.log('Fly, fly away!'); 4const elephant = { yourName, legs, fly }; 5console.log(elephant);

注意,如果变量已经声明并赋值为某个值或函数,只需将变量名放入对象字面量中,系统就会自动将属性和方法与这些变量匹配。

...
一头大象

这是对象属性简写语法的一个例子,它使得创建属性和方法名称与已有变量或函数名称相同的对象更加方便。如果不使用这种简写,创建 elephant 对象时就需要重复书写相同的名字,显得冗余:

对象属性简写语法示例

1const elephant = { 2 yourName: yourName, 3 legs: legs, 4 fly: fly 5} 6console.log(elephant);

开始

属性和方法