2018-10-10 18:03:03 -04:00
|
|
|
|
---
|
|
|
|
|
id: 5a661e0f1068aca922b3ef17
|
|
|
|
|
challengeType: 1
|
2020-08-04 15:14:21 +08:00
|
|
|
|
forumTopicId: 301149
|
2020-10-01 17:54:21 +02:00
|
|
|
|
title: 使用方括号访问数组的内容
|
2018-10-10 18:03:03 -04:00
|
|
|
|
---
|
|
|
|
|
|
|
|
|
|
## Description
|
2020-08-04 15:14:21 +08:00
|
|
|
|
<section id='description'>
|
|
|
|
|
所有数据结构的基本特性是,它们不仅能够存储数据,我们还能够按照需求来访问存放在其中的数据。我们已经学习了如何创建一个数组结构,现在让我们开始学习如何访问这个数组结构中的数据。
|
|
|
|
|
我们先定义一个包含 3 个元素的数组:
|
|
|
|
|
|
|
|
|
|
```js
|
|
|
|
|
let ourArray = ["a", "b", "c"];
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
在一个数组结构中,其内部的每个元素都有一个与之对应的<dfn>索引</dfn>(<dfn>index</dfn>)。索引是该元素在数组中的位置,可被用于引用该元素。但需要注意的是,JavaScript 数组的索引是从0开始的(<dfn>zero-indexed</dfn>),即一个数组的第一个元素是在数组中的<em><strong>第 0 个</strong></em>位置,而不是第 1 个位置。
|
|
|
|
|
要从一个数组中获取一个元素,我们可以在一个数组变量名的后面加一个使用“方括号”括起来的索引。这叫做<dfn>方括号符号</dfn>(<dfn>bracket notation</dfn>)。
|
|
|
|
|
例如我们要从<code>ourArray</code>数组变量中获取数据元素<code>"a"</code>并将其赋值给一个变量,我们可以编写如下所示的代码:
|
|
|
|
|
|
|
|
|
|
```js
|
|
|
|
|
let ourVariable = ourArray[0];
|
|
|
|
|
// ourVariable 的值为 "a"
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
除了使用 “索引” 来获取某个元素值以外,你还可以通过类似的方法来<em>设置</em>一个索引位置所对应的元素值:
|
|
|
|
|
|
|
|
|
|
```js
|
|
|
|
|
ourArray[1] = "not b anymore";
|
|
|
|
|
// ourArray 现在的值为 ["a", "not b anymore", "c"];
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
我们现在已经利用方括号将索引为 1 的元素从<code>"b"</code>设置为了<code>"not b anymore"</code>。
|
|
|
|
|
</section>
|
2018-10-10 18:03:03 -04:00
|
|
|
|
|
|
|
|
|
## Instructions
|
2020-08-04 15:14:21 +08:00
|
|
|
|
<section id='instructions'>
|
|
|
|
|
在本挑战中,请你将<code>myArray</code>中第二个元素(索引<code>1</code>)设置为除了<code>"b"</code>以外的任意值。
|
|
|
|
|
</section>
|
2018-10-10 18:03:03 -04:00
|
|
|
|
|
|
|
|
|
## Tests
|
|
|
|
|
<section id='tests'>
|
|
|
|
|
|
|
|
|
|
```yml
|
|
|
|
|
tests:
|
|
|
|
|
- text: '<code>myArray[0]</code>等于<code>"a"</code>'
|
2020-02-18 01:40:55 +09:00
|
|
|
|
testString: assert.strictEqual(myArray[0], "a");
|
2018-10-10 18:03:03 -04:00
|
|
|
|
- text: '<code>myArray[1]</code>不再设置为<code>"b"</code>'
|
2020-02-18 01:40:55 +09:00
|
|
|
|
testString: assert.notStrictEqual(myArray[1], "b");
|
2018-10-10 18:03:03 -04:00
|
|
|
|
- text: '<code>myArray[2]</code>等于<code>"c"</code>'
|
2020-02-18 01:40:55 +09:00
|
|
|
|
testString: assert.strictEqual(myArray[2], "c");
|
2018-10-10 18:03:03 -04:00
|
|
|
|
- text: '<code>myArray[3]</code>等于<code>"d"</code>'
|
2020-02-18 01:40:55 +09:00
|
|
|
|
testString: assert.strictEqual(myArray[3], "d");
|
2018-10-10 18:03:03 -04:00
|
|
|
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
</section>
|
|
|
|
|
|
|
|
|
|
## Challenge Seed
|
|
|
|
|
<section id='challengeSeed'>
|
|
|
|
|
|
|
|
|
|
<div id='js-seed'>
|
|
|
|
|
|
|
|
|
|
```js
|
|
|
|
|
let myArray = ["a", "b", "c", "d"];
|
|
|
|
|
// change code below this line
|
|
|
|
|
|
|
|
|
|
//change code above this line
|
|
|
|
|
console.log(myArray);
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</section>
|
|
|
|
|
|
|
|
|
|
## Solution
|
|
|
|
|
<section id='solution'>
|
|
|
|
|
|
|
|
|
|
```js
|
|
|
|
|
// solution required
|
2020-08-04 15:14:21 +08:00
|
|
|
|
let myArray = ["a", "b", "c", "d"];
|
|
|
|
|
myArray[1] = "e";
|
2018-10-10 18:03:03 -04:00
|
|
|
|
```
|
2020-08-04 15:14:21 +08:00
|
|
|
|
|
2018-10-10 18:03:03 -04:00
|
|
|
|
</section>
|