Skip to content

Update translation of 1-js/05-data-types/05-array-methods #602

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 26 commits into from
Feb 17, 2020
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
@@ -1,8 +1,10 @@
function camelize(str) {
return str
.split('-') // my-long-word -> ['my', 'long', 'word']
.map(
.split('-') // splits 'my-long-word' into array ['my', 'long', 'word']
.map(
// capitalizes first letters of all array items except the first one
// converts ['my', 'long', 'word'] into ['my', 'Long', 'Word']
(word, index) => index == 0 ? word : word[0].toUpperCase() + word.slice(1)
) // ['my', 'long', 'word'] -> ['my', 'Long', 'Word']
.join(''); // ['my', 'Long', 'Word'] -> myLongWord
)
.join(''); // joins ['my', 'Long', 'Word'] into 'myLongWord'
}
8 changes: 4 additions & 4 deletions 1-js/05-data-types/05-array-methods/1-camelcase/task.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,16 +4,16 @@ importance: 5

# 将 border-left-width 转换成 borderLeftWidth

写函数 `camelize(str)` 将诸如 "my-short-string" 之类的由短划线分隔的单词变成骆驼式的 "myShortString"。
编写函数 `camelize(str)` 将诸如 "my-short-string" 之类的由短划线分隔的单词变成骆驼式的 "myShortString"。

即:删除所有短横线,短横线后的每一个单词变为首字母大写
即:删除所有短横线,并将短横线后的每一个单词的首字母变为大写

例如
示例

```js
camelize("background-color") == 'backgroundColor';
camelize("list-style-image") == 'listStyleImage';
camelize("-webkit-transition") == 'WebkitTransition';
```

提示:使用 `split` 将字符串拆分成数组,然后将其转换 `join` 并返回
提示:使用 `split` 将字符串拆分成数组,对其进行转换之后再 `join` 回来
7 changes: 3 additions & 4 deletions 1-js/05-data-types/05-array-methods/10-average-age/task.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,11 @@ importance: 4

---

# 获取平均
# 获取平均年龄

编写 `getAverageAge(users)` 函数,该函数获取一个具有 age 属性的对象数组,并获取平均值
编写 `getAverageAge(users)` 函数,该函数获取一个具有 `age` 属性的对象数组,并返回平均年龄

平均的公式是 `(age1 + age2 + ... + ageN) / N`。
平均值的计算公式是 `(age1 + age2 + ... + ageN) / N`。

例如:

Expand All @@ -19,4 +19,3 @@ let arr = [ john, pete, mary ];

alert( getAverageAge(arr) ); // (25 + 30 + 29) / 3 = 28
```

18 changes: 9 additions & 9 deletions 1-js/05-data-types/05-array-methods/11-array-unique/solution.md
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
遍历数组
让我们先遍历数字:
- 对于每个元素,我们将检查结果数组是否已经有该元素。
- 如果有,则忽略,否则添加结果
- 如果有,则忽略,否则将其添加到结果中

```js run
```js run demo
function unique(arr) {
let result = [];

Expand All @@ -24,16 +24,16 @@ alert( unique(strings) ); // Hare, Krishna, :-O

代码有效,但其中存在潜在的性能问题。

方法 `result.includes(str)` 在内部遍历数组 `result` 并将每个元素与 `str` 进行比较以找到匹配项。
方法 `result.includes(str)` 在内部遍历数组 `result`并将每个元素与 `str` 进行比较以找到匹配项。

所以如果 `result` 中有 `100` 个元素,并且没有一个匹配上 `str`,那么它将遍历整个 `result` 并进行完全的 `100` 比较。如果 `result` 很大,比如 `10000`,那么会有 `10000` 次的比较。
所以如果 `result` 中有 `100` 个元素,并且没有任何一项与 `str` 匹配,那么它将遍历整个 `result` 并进行 `100` 次比较。如果 `result` 很大,比如 `10000`,那么就会有 `10000` 次的比较。

这本身并不是问题,因为 JavaScript 引擎速度非常快,所以遍历 10000 次就是几微秒的事
这本身并不是问题,因为 JavaScript 引擎速度非常快,所以遍历一个有 `10000` 个元素的数组只需要几微秒

但是我们在 `for `循环中为 `arr` 的每个元素做了这样的测试
但是我们在 `for `循环中对 `arr` 的每个元素都进行了一次检测

所以如果 `arr.length` 是 `10000`,我们会有 `10000 * 10000` = 100 百万的比较。好多啊
因此,如果 `arr.length` 是 `10000`,我们会有 `10000 * 10000` = 1 亿次的比较。那真的太多了

所以该解决方案仅适用于小型数组。

进一步, <info:map-set-weakmap-weakset> 我们将看到如何优化它
进一步,在后面的 <info:map-set> 一章中,我们将看到如何对该方法进行优化
4 changes: 2 additions & 2 deletions 1-js/05-data-types/05-array-methods/11-array-unique/task.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,9 +4,9 @@ importance: 4

# 数组去重

`arr` 是一个数组
`arr` 是一个数组

创建一个函数 `unique(arr)`,返回去除重复元素的 arr。
创建一个函数 `unique(arr)`,返回去除重复元素后的数组 `arr`

例如:

Expand Down
10 changes: 5 additions & 5 deletions 1-js/05-data-types/05-array-methods/12-reduce-object/task.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ importance: 4

# 从数组创建键(值)对象

假设我们有以下形式的用户数组 `{id:..., name:..., age... }`。
假设我们收到了一个用户数组,形式为:`{id:..., name:..., age... }`。

创建一个函数 `groupById(arr)` 从该数组创建对象,以 `id` 为键(key),数组项为值。

Expand All @@ -20,7 +20,7 @@ let users = [
let usersById = groupById(users);

/*
// 调用方法后我们得到:
// 调用函数后我们得到:

usersById = {
john: {id: 'john', name: "John Smith", age: 20}
Expand All @@ -31,8 +31,8 @@ usersById = {
```


处理服务端数据时,此功能很有用
处理服务端数据时,这个函数很有用

在这个任务里我们假设 `id` 是唯一的。没有哪两个数组项具有相同的 `id` 。
在这个任务里我们假设 `id` 是唯一的。没有两个具有相同 `id` 的数组项

请使用数组 `.reduce` 方法解决
请在解决方案中使用数组的 `.reduce` 方法
14 changes: 14 additions & 0 deletions 1-js/05-data-types/05-array-methods/2-filter-range/solution.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
```js run demo
function filterRange(arr, a, b) {
// added brackets around the expression for better readability
return arr.filter(item => (a <= item && item <= b));
}

let arr = [5, 3, 8, 1];

let filtered = filterRange(arr, 1, 4);

alert( filtered ); // 3,1 (matching values)

alert( arr ); // 5,3,8,1 (not modified)
```
2 changes: 1 addition & 1 deletion 1-js/05-data-types/05-array-methods/2-filter-range/task.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ importance: 4

# 过滤范围

写一个函数 `filterRange(arr, a, b)` 获取一个数组 `arr`,查找 `a` 和 `b` 之间的元素并返回它们的数组
写一个函数 `filterRange(arr, a, b)`,该函数获取一个数组 `arr`,在其中查找数值大小在 `a` 和 `b` 之间的元素,并返回它们的数组

该函数不应该修改原数组。它应该返回新的数组。

Expand Down
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@


function filterRangeInPlace(arr, a, b) {

for (let i = 0; i < arr.length; i++) {
Expand All @@ -12,4 +11,4 @@ function filterRangeInPlace(arr, a, b) {
}
}

}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
```js run demo
function filterRangeInPlace(arr, a, b) {

for (let i = 0; i < arr.length; i++) {
let val = arr[i];

// remove if outside of the interval
if (val < a || val > b) {
arr.splice(i, 1);
i--;
}
}

}

let arr = [5, 3, 8, 1];

filterRangeInPlace(arr, 1, 4); // removed the numbers except from 1 to 4

alert( arr ); // [3, 1]
```
Original file line number Diff line number Diff line change
Expand Up @@ -2,17 +2,17 @@ importance: 4

---

# 范围过滤
# 原位(in place)过滤范围

写一个函数 `filterRangeInPlace(arr, a, b)` 获取一个数组 `arr`,并从中除去 `a` 和 `b` 区间以外的所有值。测试:`a ≤ arr[i] ≤ b`。
写一个函数 `filterRangeInPlace(arr, a, b)`,该函数获取一个数组 `arr`,并删除其中介于 `a` 和 `b` 区间以外的所有值。检测:`a ≤ arr[i] ≤ b`。

该函数只应修改数组。它不应该返回任何东西。
该函数应该只修改数组。它不应该返回任何东西。

例如:
```js
let arr = [5, 3, 8, 1];

filterRangeInPlace(arr, 1, 4); // 删除了从 1 到 4 之外的数字
filterRangeInPlace(arr, 1, 4); // 删除了范围在 1 到 4 之外的所有值

alert( arr ); // [3, 1]
```
5 changes: 3 additions & 2 deletions 1-js/05-data-types/05-array-methods/4-sort-back/task.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,12 +2,13 @@ importance: 4

---

# 倒序
# 降序排列

```js
let arr = [5, 2, 1, -10, 8];

// ... 倒序
// ……你的代码以降序对其进行排序

alert( arr ); // 8, 5, 2, 1, -10
```

4 changes: 2 additions & 2 deletions 1-js/05-data-types/05-array-methods/5-copy-sort-array/task.md
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,6 @@ let arr = ["HTML", "JavaScript", "CSS"];

let sorted = copySorted(arr);

alert( sorted ); // CSSHTMLJavaScript
alert( arr ); // HTMLJavaScriptCSS(没有变化)
alert( sorted ); // CSS, HTML, JavaScript
alert( arr ); // HTML, JavaScript, CSS (no changes)
```
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ importance: 5

# 映射到 names

你有一个 `user` 对象数组,每个对象都有 `user.name `。编写将其转换为 names 数组的代码。
你有一个 `user` 对象数组,每个对象都有 `user.name`。编写将其转换为 names 数组的代码。

例如:

Expand Down
Original file line number Diff line number Diff line change
@@ -1,3 +1,3 @@

- 请注意如何存储方法。它们只是被添加到 `this.methods` 属性中。
- 所有测试和数值转换都在 `calculate` 方法中完成。将来它可能会扩展到支持更复杂的表达式
- 请注意方法的存储方式。它们只是被添加到 `this.methods` 属性中。
- 所有检测和数字转换都通过 `calculate` 方法完成。将来可能会扩展它以支持更复杂的表达式
Original file line number Diff line number Diff line change
Expand Up @@ -4,11 +4,11 @@ importance: 5

# 创建一个可扩展的 calculator

创建一个构造函数 `Calculator`,创建可扩展的 calculator 对象。
创建一个构造函数 `Calculator`,以创建“可扩展”的 calculator 对象。

该任务由两部分组成。

1. 首先,实现 `calculate(str)` 方法,接受像 `"1 + 2"` 这样格式为“数字 运算符 数字”(以空格分隔)的字符串,并返回结果。该方法需要能够理解加号 `+` 和减号 `-`。
1. 首先,实现 `calculate(str)` 方法,该方法接受像 `"1 + 2"` 这样格式为“数字 运算符 数字”(以空格分隔)的字符串,并返回结果。该方法需要能够理解加号 `+` 和减号 `-`。

用法示例:

Expand All @@ -17,7 +17,7 @@ importance: 5

alert( calc.calculate("3 + 7") ); // 10
```
2. 然后添加 calculator 的新操作方法 `addOperator(name, func)`。它需要运算符 `name` 和实现它的双参数函数 `func(a,b)`。
2. 然后添加方法 `addMethod(name, func)`,该方法教 calculator 进行新操作。它需要运算符 `name` 和实现它的双参数函数 `func(a,b)`。

例如,我们添加乘法 `*`,除法 `/` 和求幂 `**`:

Expand All @@ -32,5 +32,5 @@ importance: 5
```

- 此任务中没有括号或复杂的表达式。
- 数字和运算符用一个空格分隔
- 你可以自行选择是否添加错误处理
- 数字和运算符之间只有一个空格
- 你可以自行选择是否添加错误处理功能
6 changes: 3 additions & 3 deletions 1-js/05-data-types/05-array-methods/7-map-objects/solution.md
Original file line number Diff line number Diff line change
Expand Up @@ -35,9 +35,9 @@ let usersMapped = users.map(user => *!*{*/!*
});
```

我们记得,有两个箭头函数写法:直接返回值`value => expr` 和带主体的 `value => {...}`。
我们记得,有两种箭头函数的写法:直接返回值 `value => expr` 和带主体的 `value => {...}`。

JavaScript 会把 `{` 作为函数体的开始,而不是对象的开始。解决方法是将它们包装在正常括号中
JavaScript 在这里会把 `{` 视为函数体的开始,而不是对象的开始。解决方法是将它们包装在普通括号 `()` 中

```js
let usersMapped = users.map(user => *!*({*/!*
Expand All @@ -46,6 +46,6 @@ let usersMapped = users.map(user => *!*({*/!*
}));
```

现在就好了
这样就可以了


4 changes: 2 additions & 2 deletions 1-js/05-data-types/05-array-methods/7-map-objects/task.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ importance: 5

你有一个 `user` 对象数组,每个对象都有 `name`,`surname` 和 `id`。

编写代码以从中创建另一个具有 `id` 和 `fullName` 的对象,其中 `fullName` 由 `name` 和 `surname` 生成。
编写代码以该数组为基础,创建另一个具有 `id` 和 `fullName` 的对象数组,其中 `fullName` 由 `name` 和 `surname` 生成。

例如:

Expand All @@ -33,4 +33,4 @@ alert( usersMapped[0].id ) // 1
alert( usersMapped[0].fullName ) // John Smith
```

所以,实际上你需要将一个对象数组映射到另一个对象数组。可以尝试使用箭头函数来编写
所以,实际上你需要将一个对象数组映射到另一个对象数组。在这儿尝试使用箭头函数 `=>` 来编写
18 changes: 17 additions & 1 deletion 1-js/05-data-types/05-array-methods/8-sort-objects/solution.md
Original file line number Diff line number Diff line change
Expand Up @@ -11,8 +11,24 @@ let arr = [ pete, john, mary ];

sortByAge(arr);

// 现在排序是:[john, mary, pete]
// 排序后的数组为:[john, mary, pete]
alert(arr[0].name); // John
alert(arr[1].name); // Mary
alert(arr[2].name); // Pete
```

译注:解决方案的代码还可以更短一些

```js
function sortByAge(arr) {
arr.sort((a, b) => a.age - b.age);
}
```

因为 `sort()` 方法的语法为 `arr.sort([compareFunction])`,如果没有指明 `compareFunction`,那么元素会被按照转换为的字符串的诸个字符的 Unicode 编码进行排序,如果指明了 `compareFunction`,那么数组会按照调用该函数的返回值排序。即 `a` 和 `b` 是两个将要被比较的元素:

- 如果 `compareFunction(a, b)` 小于 `0`,那么 `a` 会被排列到 `b` 之前;
- 如果 `compareFunction(a, b)` 等于 `0`,那么 `a` 和 `b` 的相对位置不变。备注:ECMAScript 标准并不保证这一行为,而且也不是所有浏览器都会遵守(例如 Mozilla 在 2003 年之前的版本);
- 如果 `compareFunction(a, b)` 大于 `0`,那么 `b` 会被排列到 `a` 之前。

因此,升序排列的函数可以简写为:`(a, b) => a.age - b.age`。
2 changes: 1 addition & 1 deletion 1-js/05-data-types/05-array-methods/8-sort-objects/task.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ importance: 5

# 按年龄对用户排序

编写函数 `sortByAge(users)` 获得对象数组的 `age` 属性并对它进行排序
编写函数 `sortByAge(users)` 获得对象数组的 `age` 属性,并根据 `age` 对这些对象数组进行排序

例如:

Expand Down
Loading