2018-10-10 18:03:03 -04:00
|
|
|
|
---
|
|
|
|
|
id: 587d7b7c367417b2b2512b18
|
2020-12-16 00:37:30 -07:00
|
|
|
|
title: 将键值对添加到对象中
|
2018-10-10 18:03:03 -04:00
|
|
|
|
challengeType: 1
|
2020-08-04 15:14:21 +08:00
|
|
|
|
forumTopicId: 301153
|
2018-10-10 18:03:03 -04:00
|
|
|
|
---
|
|
|
|
|
|
2020-12-16 00:37:30 -07:00
|
|
|
|
# --description--
|
|
|
|
|
|
2021-01-12 08:18:51 -08:00
|
|
|
|
对象(object)本质上是<dfn>键值对(key-value pair)</dfn>的集合。或者说,一系列被映射到唯一标识符的数据就是对象;习惯上,唯一标识符叫做<dfn>属性(property)</dfn>或者<dfn>键(key)</dfn>);数据叫做<dfn>值(value)</dfn>。让我们来看一个简单的例子:
|
2020-08-04 15:14:21 +08:00
|
|
|
|
|
|
|
|
|
```js
|
2021-01-12 08:18:51 -08:00
|
|
|
|
const tekkenCharacter = {
|
|
|
|
|
player: 'Hwoarang',
|
|
|
|
|
fightingStyle: 'Tae Kwon Doe',
|
|
|
|
|
human: true
|
2020-08-04 15:14:21 +08:00
|
|
|
|
};
|
|
|
|
|
```
|
|
|
|
|
|
2021-01-12 08:18:51 -08:00
|
|
|
|
上面的代码定义了一个叫做 `tekkenCharacter` 的“铁拳”游戏人物对象。它有三个属性,每个属性都对应一个特定的值。如果我们想为它再添加一个叫做 `origin` 的属性,可以这样写:
|
2020-08-04 15:14:21 +08:00
|
|
|
|
|
|
|
|
|
```js
|
2021-01-12 08:18:51 -08:00
|
|
|
|
tekkenCharacter.origin = 'South Korea';
|
2020-08-04 15:14:21 +08:00
|
|
|
|
```
|
|
|
|
|
|
2021-01-12 08:18:51 -08:00
|
|
|
|
上面的代码中,我们使用了<dfn>点号表示法(dot notation)</dfn>。如果我们现在输出这个对象,便可以看到它具有 `origin` 属性。接下来,因为这个人物在游戏中有着与众不同的橘色头发,我们可以通过方括号表示法来为它添加这个属性,像这样:
|
2020-08-04 15:14:21 +08:00
|
|
|
|
|
|
|
|
|
```js
|
2021-01-12 08:18:51 -08:00
|
|
|
|
tekkenCharacter['hair color'] = 'dyed orange';
|
2020-08-04 15:14:21 +08:00
|
|
|
|
```
|
|
|
|
|
|
2021-01-12 08:18:51 -08:00
|
|
|
|
如果要设置的属性中存在空格,或者要设置的属性是一个变量,那我们必须使用<dfn>方括号表示法(bracket notation)</dfn>来为对象添加属性。在上面的代码中,我们把属性 `hair color` 放到引号里,以此来表示整个字符串都是需要设置的属性。如果我们不加上引号,那么中括号里的内容会被当作一个变量来解析,这个变量对应的值就会作为要设置的属性,请看这段代码:
|
|
|
|
|
|
|
|
|
|
```js
|
|
|
|
|
const eyes = 'eye color';
|
|
|
|
|
|
|
|
|
|
tekkenCharacter[eyes] = 'brown';
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
执行以上所有示例代码后,对象会变成这样:
|
|
|
|
|
|
|
|
|
|
```js
|
|
|
|
|
{
|
|
|
|
|
player: 'Hwoarang',
|
|
|
|
|
fightingStyle: 'Tae Kwon Doe',
|
|
|
|
|
human: true,
|
|
|
|
|
origin: 'South Korea',
|
|
|
|
|
'hair color': 'dyed orange',
|
|
|
|
|
'eye color': 'brown'
|
|
|
|
|
};
|
|
|
|
|
```
|
2018-10-10 18:03:03 -04:00
|
|
|
|
|
2020-12-16 00:37:30 -07:00
|
|
|
|
# --instructions--
|
2018-10-10 18:03:03 -04:00
|
|
|
|
|
2021-01-12 08:18:51 -08:00
|
|
|
|
我们已经为你创建了 `foods` 对象。请使用上述任意语法,来为 `foods` 对象添加如下三个键值对:`bananas` 属性,值为 `13`;`grapes` 属性,值为 `35`;`strawberries` 属性,值为 `27`。
|
2018-10-10 18:03:03 -04:00
|
|
|
|
|
2020-12-16 00:37:30 -07:00
|
|
|
|
# --hints--
|
2018-10-10 18:03:03 -04:00
|
|
|
|
|
2021-01-12 08:18:51 -08:00
|
|
|
|
`foods` 应为一个对象。
|
2018-10-10 18:03:03 -04:00
|
|
|
|
|
|
|
|
|
```js
|
2020-12-16 00:37:30 -07:00
|
|
|
|
assert(typeof foods === 'object');
|
|
|
|
|
```
|
2018-10-10 18:03:03 -04:00
|
|
|
|
|
2021-01-12 08:18:51 -08:00
|
|
|
|
`foods` 应有一个值为 `13` 的 `"bananas"` 属性。
|
2018-10-10 18:03:03 -04:00
|
|
|
|
|
2020-12-16 00:37:30 -07:00
|
|
|
|
```js
|
|
|
|
|
assert(foods.bananas === 13);
|
2018-10-10 18:03:03 -04:00
|
|
|
|
```
|
|
|
|
|
|
2021-01-12 08:18:51 -08:00
|
|
|
|
`foods` 应有一个值为 `35` 的 `"grapes"` 属性。
|
2018-10-10 18:03:03 -04:00
|
|
|
|
|
2020-12-16 00:37:30 -07:00
|
|
|
|
```js
|
|
|
|
|
assert(foods.grapes === 35);
|
|
|
|
|
```
|
2018-10-10 18:03:03 -04:00
|
|
|
|
|
2021-01-12 08:18:51 -08:00
|
|
|
|
`foods` 应有一个值为 `27` 的 `"strawberries"` 属性。
|
2018-10-10 18:03:03 -04:00
|
|
|
|
|
2020-12-16 00:37:30 -07:00
|
|
|
|
```js
|
|
|
|
|
assert(foods.strawberries === 27);
|
|
|
|
|
```
|
2018-10-10 18:03:03 -04:00
|
|
|
|
|
2021-01-12 08:18:51 -08:00
|
|
|
|
应使用点号表示法或方括号表示法来设置对象的属性。
|
2018-10-10 18:03:03 -04:00
|
|
|
|
|
|
|
|
|
```js
|
2020-12-16 00:37:30 -07:00
|
|
|
|
assert(
|
|
|
|
|
code.search(/bananas:/) === -1 &&
|
|
|
|
|
code.search(/grapes:/) === -1 &&
|
|
|
|
|
code.search(/strawberries:/) === -1
|
|
|
|
|
);
|
2018-10-10 18:03:03 -04:00
|
|
|
|
```
|
2020-08-04 15:14:21 +08:00
|
|
|
|
|
2020-12-16 00:37:30 -07:00
|
|
|
|
# --solutions--
|
|
|
|
|
|