-
Notifications
You must be signed in to change notification settings - Fork 185
Added Arrays in cn #365
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Merged
Merged
Added Arrays in cn #365
Changes from all commits
Commits
Show all changes
4 commits
Select commit
Hold shift + click to select a range
File filter
Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,100 @@ | ||
| --- | ||
| 章节:6 | ||
| 页码:47 | ||
| 描述:数组是数据的列表,是编程中的基础部分。我们可以在数组中存储多种类型的数据。 | ||
| --- | ||
|
|
||
| # 第6章 | ||
| # 数组(Arrays) | ||
|
|
||
| 数组是编程中的基础部分。数组是一种数据列表。我们可以在一个变量中存储大量数据,这使我们的代码更易读、更易理解,也更方便对相关数据进行操作。 | ||
|
|
||
| 数组中的数据称为 `元素`。 | ||
|
|
||
| 下面是一个简单的数组示例: | ||
|
|
||
| ```javascript | ||
| // 1, 1, 2, 3, 5 和 8 是数组中的元素 | ||
| let numbers = [1, 1, 2, 3, 5, 8]; | ||
| ``` | ||
|
|
||
| 数组可以使用数组字面量或 `new` 关键字轻松创建: | ||
|
|
||
| ```javascript | ||
| const cars = ["Saab", "Volvo", "BMW"]; // 使用数组字面量 | ||
| const cars = new Array("Saab", "Volvo", "BMW"); // 使用 new 关键字 | ||
| ``` | ||
|
|
||
| 可以通过索引访问数组的值。数组的第一个元素索引总是 `0`,因为数组索引从 `0` 开始。 | ||
| 索引也可以用于修改数组元素: | ||
|
|
||
| ```javascript | ||
| const cars = ["Saab", "Volvo", "BMW"]; | ||
| console.log(cars[0]); | ||
| // 结果: Saab | ||
|
|
||
| cars[0] = "Opel"; // 修改数组的第一个元素 | ||
| console.log(cars); | ||
| // 结果: ['Opel', 'Volvo', 'BMW'] | ||
| ``` | ||
|
|
||
| {% hint style="working" %} | ||
| 数组是一种特殊的对象类型。数组中也可以包含 对象 | ||
| 。 | ||
| {% endhint %} | ||
|
|
||
| 数组的 `length` 属性返回元素的数量。数组支持的方法如下表所示: | ||
|
|
||
| | 方法名称 | 描述 | | ||
| | ----------------- | ------------------------------------------------------------------------------ | | ||
| | `at()` | 返回指定索引的元素或 `undefined` | | ||
|
|
||
| | `concat()` | 返回两个或多个数组的组合 | | ||
|
|
||
| | `every()` | 如果回调函数对数组中每个元素都返回 `true`,则返回 `true` | | ||
|
|
||
| | `filter()` | 返回一个新数组,包含回调函数返回 `true` 的元素 | | ||
|
|
||
| | `find()` | 返回第一个使回调函数返回 `true` 的元素 | | ||
|
|
||
| | `findIndex()` | 返回第一个使回调函数返回 `true` 的元素索引 | | ||
|
|
||
| | `findLast()` | 返回最后一个使回调函数返回 `true` 的元素 | | ||
|
|
||
| | `findLastIndex()` | 返回最后一个使回调函数返回 `true` 的元素索引 | | ||
|
|
||
| | `flat()` | 返回一个新数组,将所有子数组元素递归展开到指定深度 | | ||
|
|
||
| | `flatMap()` | 先运行 `map()`,再运行深度为 1 的 `flat()` | | ||
|
|
||
| | `forEach()` | 对数组中的每个元素执行回调函数,返回 `undefined` | | ||
|
|
||
| | `indexOf()` | 返回搜索元素第一次出现的索引 | | ||
|
|
||
| | `join()` | 将数组中的所有元素连接成一个字符串 | | ||
|
|
||
| | `lastIndexOf()` | 返回搜索元素最后一次出现的索引 | | ||
|
|
||
| | `map()` | 执行回调函数后返回一个新数组 | | ||
|
|
||
| | `pop()` | 删除数组的最后一个元素并返回该元素 | | ||
|
|
||
| | `push()` | 在数组末尾添加一个或多个元素,并返回数组的新长度 | | ||
|
|
||
| | `reduce()` | 使用 `callback(accumulator, currentValue, currentIndex, array)` 对数组进行归约操作,返回最终结果 | | ||
|
|
||
| | `reduceRight()` | 与 `reduce()` 类似,但从数组末尾开始 | | ||
|
|
||
| | `reverse()` | 原地翻转数组元素,并返回数组的引用 | | ||
|
|
||
| | `shift()` | 删除数组的第一个元素并返回该元素 | | ||
|
|
||
| | `slice()` | 提取数组的一部分并返回新数组 | | ||
|
|
||
| | `some()` | 如果回调函数对数组中至少一个元素返回 `true`,则返回 `true` | | ||
|
|
||
| | `sort()` | 原地对数组元素进行排序,并返回数组的引用 | | ||
|
|
||
| | `splice()` | 从数组中删除元素(可选择性替换),并返回删除的元素 | | ||
|
|
||
| | `unshift()` | 在数组开头添加一个或多个元素,并返回数组的新长度 | | ||
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,45 @@ | ||
| 章节:6 | ||
| 页码:46 | ||
| 描述:forEach 方法会对数组中的每一个数组元素执行一次所提供的函数。 | ||
|
|
||
|
|
||
| # 对每一个元素 | ||
|
|
||
| `forEach` 方法会对数组中的每一个元素执行一次所提供的函数。以下是使用 `forEach` 的语法: | ||
|
|
||
| ```javascript | ||
| array.forEach(function(element, index, array) { | ||
| // element:当前正在处理的数组元素 | ||
| // index:当前正在处理的数组元素的索引 | ||
| // array:调用 forEach 方法的原数组 | ||
| }); | ||
| ``` | ||
|
|
||
| 例如,假设你有一个数字数组,并希望在控制台中输出每个数字的两倍,可以使用 `forEach` 如下所示: | ||
|
|
||
| ```javascript | ||
| let 数字 = [1, 2, 3, 4, 5]; | ||
| 数字.forEach(function(数值) { | ||
| console.log(数值 * 2); | ||
| }); | ||
| ``` | ||
|
|
||
| 你也可以使用箭头函数语法来定义传递给 `forEach` 的函数: | ||
|
|
||
| ```javascript | ||
| 数字.forEach((数值) => { | ||
| console.log(数值 * 2); | ||
| }); | ||
| ``` | ||
|
|
||
| 或者: | ||
|
|
||
| ```javascript | ||
| 数字.forEach(数值 => console.log(数值 * 2)); | ||
| ``` | ||
|
|
||
| `forEach` 方法不会改变原始数组。它只是遍历数组中的元素,并对每一个元素执行所提供的函数。 | ||
|
|
||
| {% hint style="working" %} | ||
| `forEach()` 方法不会对空数组执行回调函数。 | ||
| {% endhint %} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,34 @@ | ||
| 章节:6 | ||
| 页码:58 | ||
| 描述:数组是元素的集合,每个元素都被分配了一个称为索引的数字位置。索引是从零开始的,这意味着数组的第一个元素索引为 0,第二个元素索引为 1,依此类推。 | ||
|
|
||
| # 索引 | ||
|
|
||
| 现在你已经有了一个数据元素数组,那么如果你想访问其中的某一个特定元素,该怎么办呢?这正是**索引(index)**的作用。索引指的是数组中的一个位置。索引在逻辑上是依次递增的,但需要注意的是,在大多数编程语言中,数组的第一个索引都是 `0`。方括号 `[]` 用于表示你正在引用数组中的某个索引位置。 | ||
|
|
||
| ```javascript | ||
| // 这是一个字符串数组 | ||
| let fruits = ["apple", "banana", "pineapple", "strawberry"]; | ||
|
|
||
| // 我们将变量 banana 设置为 fruits 数组中第二个元素的值。 | ||
| // 请记住,索引从 0 开始,因此 1 表示第二个元素。 | ||
| // 结果:banana = "banana" | ||
| let banana = fruits[1]; | ||
| ``` | ||
|
|
||
| 你也可以使用数组索引来设置或修改数组中某个元素的值: | ||
|
|
||
| ```javascript | ||
| let array = ['a', 'b', 'c', 'd', 'e']; | ||
| // 索引: 0 1 2 3 4 | ||
| array[4] = 'f'; | ||
| console.log(array); // 结果:['a', 'b', 'c', 'd', 'f'] | ||
| ``` | ||
|
|
||
| 请注意,如果你尝试使用超出数组范围的索引来访问或设置元素(即索引小于 `0`,或大于等于数组的长度),将会得到 `undefined` 值。 | ||
|
|
||
| ```javascript | ||
| console.log(array[5]); // 输出:undefined | ||
| array[5] = 'g'; | ||
| console.log(array); // 结果:['a', 'b', 'c', 'd', 'f', 'g'] | ||
| ``` |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,38 @@ | ||
| 章节:6 | ||
| 页码:53 | ||
| 描述:join 方法会将数组转换为一个字符串,并把所有元素连接在一起,而不会修改原始数组。 | ||
|
|
||
|
|
||
| # 连接(Join) | ||
|
|
||
| `join` 方法会将数组转换为一个字符串,并将所有元素连接在一起。它**不会改变原始数组**。以下是使用 `join` 的语法: | ||
|
|
||
| ```javascript | ||
| array.join([separator]); | ||
| ``` | ||
|
|
||
| `separator` 参数是可选的,用于指定在结果字符串中分隔各个元素所使用的字符。如果省略该参数,数组元素将使用逗号(`,`)进行分隔。 | ||
|
|
||
| 例如: | ||
|
|
||
| ```javascript | ||
| let array = ["one", "two", "three", "four"]; | ||
|
|
||
| console.log(array.join(" ")); | ||
|
|
||
| // 结果:one two three four | ||
| ``` | ||
|
|
||
| {% hint style="working" %} | ||
| 可以指定任意分隔符,但默认分隔符是逗号 `(,)`。 | ||
| {% endhint %} | ||
|
|
||
| 在上述示例中,使用了空格作为分隔符。你还可以使用 `join` 将**类数组对象**(例如 `arguments` 对象或 `NodeList` 对象)转换为字符串,方法是先使用 `Array.prototype.slice()` 将其转换为真正的数组: | ||
|
|
||
| ```javascript | ||
| function printArguments() { | ||
| console.log(Array.prototype.slice.call(arguments).join(', ')); | ||
| } | ||
|
|
||
| printArguments('a', 'b', 'c'); // 结果:a, b, c | ||
| ``` |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,46 @@ | ||
| --- | ||
| 章节: 6 | ||
| 页码: 44 | ||
| 描述: 数组有一个名为 length 的属性,用于测量数组的长度(元素数量)。 | ||
| --- | ||
|
|
||
| # 长度(Length) | ||
|
|
||
| 数组有一个名为 `length` 的属性,它的含义正如其名——表示数组的长度。 | ||
|
|
||
| ```javascript | ||
| let array = [1, 2, 3]; | ||
|
|
||
| let l = array.length; | ||
|
|
||
| // 结果:l = 3 | ||
| ``` | ||
|
|
||
| length 属性也可以用来设置数组中元素的数量。例如: | ||
|
|
||
| ```javascript | ||
| let fruits = ["Banana", "Orange", "Apple", "Mango"]; | ||
| fruits.length = 2; | ||
|
|
||
| console.log(fruits); | ||
| // 结果:['Banana', 'Orange'] | ||
| ``` | ||
|
|
||
| 你还可以将 length 作为索引来获取数组中的最后一个元素。例如: | ||
|
|
||
| ```javascript | ||
| console.log(fruits[fruits.length - 1]); // 结果:Orange | ||
| ``` | ||
|
|
||
| 你也可以使用 length 属性向数组末尾添加元素。例如: | ||
|
|
||
| ```javascript | ||
| fruits[fruits.length] = "Pineapple"; | ||
| console.log(fruits); // 结果:['Banana', 'Orange', 'Pineapple'] | ||
| ``` | ||
|
|
||
| {% hint style="info" %} | ||
| 当数组中的元素被添加或删除时,`length` 属性会自动更新。 | ||
| {% endhint %} | ||
|
|
||
| 还需要注意的是,`length` 是一个属性,而不是方法,因此在访问它时不需要使用括号。它只是数组对象的一个属性,你可以像访问其他对象属性一样访问它。 |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,48 @@ | ||
| --- | ||
| 章节: 6 | ||
| 页码: 49 | ||
| 描述: map 方法会遍历数组,并使用回调函数处理数组中的每一个元素,从而生成一个新的数组。 | ||
| --- | ||
|
|
||
| # Map | ||
|
|
||
| `Array.prototype.map()` 方法会遍历数组,并对数组中的每一个元素执行一次回调函数。 | ||
| 回调函数的返回值会组成一个新的数组,而原数组不会被修改。 | ||
|
|
||
| ```javascript | ||
| let newArray = oldArray.map(function (element, index, array) { | ||
| // element:当前正在处理的数组元素 | ||
| // index:当前元素的索引 | ||
| // array:调用 map 方法的原数组 | ||
| // return 的值会被添加到 newArray 中 | ||
| }); | ||
| ``` | ||
|
|
||
| 例如,假设你有一个数字数组,并希望创建一个新数组,使其元素是原数组中每个数字的两倍: | ||
|
|
||
| ```javascript | ||
| const numbers = [2, 4, 6, 8]; | ||
|
|
||
| const doubledNumbers = numbers.map(number => number * 2); | ||
|
|
||
| console.log(doubledNumbers); | ||
| // 结果:[4, 8, 12, 16] | ||
| ``` | ||
|
|
||
| 你也可以使用完整的箭头函数写法: | ||
|
|
||
| ```javascript | ||
| const doubledNumbers = numbers.map((number) => { | ||
| return number * 2; | ||
| }); | ||
| ``` | ||
|
|
||
| 或者更简洁地写成: | ||
|
|
||
| ```javascript | ||
| const doubledNumbers = numbers.map(number => number * 2); | ||
| ``` | ||
|
|
||
| {% hint style="info" %} | ||
| `map()` 方法不会对空元素执行回调函数,并且不会改变原数组,它始终返回一个新数组。 | ||
| {% endhint %} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,43 @@ | ||
| --- | ||
| 章节: 6 | ||
| 页码: 52 | ||
| 描述: pop 方法会移除数组的最后一个元素,并返回该元素。该方法会改变数组的长度。 | ||
| --- | ||
|
|
||
| # Pop | ||
|
|
||
| `pop()` 方法会移除数组的最后一个元素,并返回该元素。 | ||
| 此方法会**直接修改原数组**,并改变数组的长度。 | ||
|
|
||
sumn2u marked this conversation as resolved.
Show resolved
Hide resolved
|
||
| `语法`: | ||
| ```javascript | ||
| array.pop(); | ||
| ``` | ||
|
|
||
| `示例`: | ||
| ```javascript | ||
| let arr = ["一", "二", "三", "四", "五"]; | ||
|
|
||
| arr.pop(); | ||
|
|
||
| console.log(arr); | ||
| // 结果:['一', '二', '三', '四'] | ||
| ``` | ||
|
|
||
| 你也可以结合循环使用 `pop()` 方法来移除数组中的所有元素: | ||
|
|
||
| ```javascript | ||
| let array = ["a", "b", "c"]; | ||
|
|
||
| while (array.length > 0) { | ||
| array.pop(); | ||
| } | ||
|
|
||
| console.log(array); | ||
| // 结果:[] | ||
| ``` | ||
|
|
||
| {% hint style="working" %} | ||
| `pop()` 方法只适用于数组,而不适用于类数组对象(如 arguments 或 NodeList)。 | ||
| 如果需要操作这些对象,可以先使用 `Array.prototype.slice()` 将它们转换为真正的数组。 | ||
| {% endhint %} | ||
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Uh oh!
There was an error while loading. Please reload this page.