From 20fd6b578f43e7571b52b75f96c678ea09849c60 Mon Sep 17 00:00:00 2001 From: Jessica <29631279+cyz980908@users.noreply.github.com> Date: Tue, 26 Nov 2019 17:24:24 +0800 Subject: [PATCH 1/3] =?UTF-8?q?=E7=AE=AD=E5=A4=B4=E5=87=BD=E6=95=B0?= =?UTF-8?q?=EF=BC=8C=E5=9F=BA=E7=A1=80=E4=B8=AD=E7=9A=84=E5=9F=BA=E7=A1=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 完成翻译 --- .../16-arrow-functions-basics/article.md | 62 +++++++++---------- 1 file changed, 31 insertions(+), 31 deletions(-) diff --git a/1-js/02-first-steps/16-arrow-functions-basics/article.md b/1-js/02-first-steps/16-arrow-functions-basics/article.md index c51775f92e..7ab8d5e9c8 100644 --- a/1-js/02-first-steps/16-arrow-functions-basics/article.md +++ b/1-js/02-first-steps/16-arrow-functions-basics/article.md @@ -1,16 +1,16 @@ -# Arrow functions, the basics +# 箭头函数，基础中的基础 -There's another very simple and concise syntax for creating functions, that's often better than Function Expressions. +创建函数除了一般的函数表达式以外，还有一另种更好的非常简单和简洁的语法。 -It's called "arrow functions", because it looks like this: +它被称为“箭头函数”，因为它看起来像这样： ```js let func = (arg1, arg2, ...argN) => expression ``` -...This creates a function `func` that accepts arguments `arg1..argN`, then evaluates the `expression` on the right side with their use and returns its result. +...这里创建一个函数 `func`，它接受参数 `arg1..argN`，然后使用参数对右侧的 `expression` 求值并返回其结果。 -In other words, it's the shorter version of: +换句话说，它是下面版本的缩写： ```js let func = function(arg1, arg2, ...argN) { @@ -18,12 +18,12 @@ let func = function(arg1, arg2, ...argN) { }; ``` -Let's see a concrete example: +让我们来看一个具体的例子： ```js run let sum = (a, b) => a + b; -/* This arrow function is a shorter form of: +/* 这个箭头函数是下面这个函数的缩写： let sum = function(a, b) { return a + b; @@ -33,22 +33,22 @@ let sum = function(a, b) { alert( sum(1, 2) ); // 3 ``` -As you can, see `(a, b) => a + b` means a function that accepts two arguments named `a` and `b`. Upon the execution, it evaluates the expression `a + b` and returns the result. +可以看到 `(a, b) => a + b` 表示一个函数，该函数接受两个名为 `a` 和 `b` 的参数。在执行时，它将对表达式 `a + b` 求值并返回结果。 -- If we have only one argument, then parentheses around parameters can be omitted, making that even shorter. +- 如果我们只有一个参数，还可以省略掉参数外的圆括号，使其更短。 - For example: + 例如： ```js run *!* let double = n => n * 2; - // roughly the same as: let double = function(n) { return n * 2 } + // 差不多等同于：let double = function(n) { return n * 2 } */!* alert( double(3) ); // 6 ``` -- If there are no arguments, parentheses will be empty (but they should be present): +- 如果没有参数，括号里将是空的（但括号应该是保留）： ```js run let sayHi = () => alert("Hello!"); @@ -56,9 +56,9 @@ As you can, see `(a, b) => a + b` means a function that accepts two arguments na sayHi(); ``` -Arrow functions can be used in the same way as Function Expressions. +箭头函数可以像函数表达式一样使用。 -For instance, to dynamically create a function: +例如，动态创建一个函数： ```js run let age = prompt("What is your age?", 18); @@ -67,26 +67,26 @@ let welcome = (age < 18) ? () => alert('Hello') : () => alert("Greetings!"); -welcome(); // ok now +welcome(); // 现在好了 ``` -Arrow functions may appear unfamiliar and not very readable at first, but that quickly changes as the eyes get used to the structure. +一开始，箭头函数可能看起来不熟悉，也不容易读懂，但一旦我们的眼睛习惯之后，情况很快会改变。 -They are very convenient for simple one-line actions, when we're just too lazy to write many words. +而且当我们懒得写太多字的时候，箭头函数这种简单的一行操作是非常方便。 -## Multiline arrow functions +## 多行的箭头函数 -The examples above took arguments from the left of `=>` and evaluated the right-side expression with them. +上面的例子从 `=>` 的左侧获取参数，然后使用参数计算右侧表达式的值。 -Sometimes we need something a little bit more complex, like multiple expressions or statements. It is also possible, but we should enclose them in curly braces. Then use a normal `return` within them. +但有时我们需要更复杂一点的东西，比如多个表达式或语句。这也是可以做到的，但是我们应该用花括号括起来。然后在返回时使用一个普通的 `return`。 -Like this: +就像这样： ```js run -let sum = (a, b) => { // the curly brace opens a multiline function +let sum = (a, b) => { // 花括号打开一个多行函数 let result = a + b; *!* - return result; // if we use curly braces, then we need an explicit "return" + return result; // i如果我们使用花括号，那么我们需要一个显式的 “return” */!* }; @@ -94,18 +94,18 @@ alert( sum(1, 2) ); // 3 ``` ```smart header="More to come" -Here we praised arrow functions for brevity. But that's not all! +在这里，我们赞扬箭头功能的简洁性。但这还不止这些！ -Arrow functions have other interesting features. +箭头函数还有其他有趣的特性。 -To study them in-depth, we first need to get to know some other aspects of JavaScript, so we'll return to arrow functions later in the chapter . +为了更深入地研究它们，我们首先需要了解一些 JavaScript 其他方面的知识，因此我们将在后面的 一章中再继续研究箭头函数。 -For now, we can already use arrow functions for one-line actions and callbacks. +现在，我们已经可以将箭头函数用于单行操作和回调了。 ``` -## Summary +## 总结 -Arrow functions are handy for one-liners. They come in two flavors: +对于一句代码的函数来说，箭头函数是相当方便的。它具体有两种： -1. Without curly braces: `(...args) => expression` -- the right side is an expression: the function evaluates it and returns the result. -2. With curly braces: `(...args) => { body }` -- brackets allow us to write multiple statements inside the function, but we need an explicit `return` to return something. +1. 不带花括号：`(...args) => expression` -- 右边是一个表达式：函数计算它并返回结果。 +2. 带花括号：`(...args) => { body }` -- 花括号允许我们在函数中编写多个语句，但是我们需要显式的返回来 `return` 一些内容。 From 456e937eda453c73e07817398185e0bfd8e450d9 Mon Sep 17 00:00:00 2001 From: Jessica <29631279+cyz980908@users.noreply.github.com> Date: Tue, 26 Nov 2019 17:26:46 +0800 Subject: [PATCH 2/3] =?UTF-8?q?=E5=81=9A=E5=87=BA=E4=B8=80=E7=82=B9?= =?UTF-8?q?=E4=BF=AE=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- 1-js/02-first-steps/16-arrow-functions-basics/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/02-first-steps/16-arrow-functions-basics/article.md b/1-js/02-first-steps/16-arrow-functions-basics/article.md index 7ab8d5e9c8..e9a2df54ec 100644 --- a/1-js/02-first-steps/16-arrow-functions-basics/article.md +++ b/1-js/02-first-steps/16-arrow-functions-basics/article.md @@ -48,7 +48,7 @@ alert( sum(1, 2) ); // 3 alert( double(3) ); // 6 ``` -- 如果没有参数，括号里将是空的（但括号应该是保留）： +- 如果没有参数，括号里将是空的（但括号应该保留）： ```js run let sayHi = () => alert("Hello!"); From 87f42d636f6fc37eb3fc51335d984616398dec11 Mon Sep 17 00:00:00 2001 From: LeviDing Date: Wed, 27 Nov 2019 10:58:28 +0800 Subject: [PATCH 3/3] improve the translation --- .../16-arrow-functions-basics/article.md | 42 +++++++++---------- 1 file changed, 21 insertions(+), 21 deletions(-) diff --git a/1-js/02-first-steps/16-arrow-functions-basics/article.md b/1-js/02-first-steps/16-arrow-functions-basics/article.md index e9a2df54ec..4c086df641 100644 --- a/1-js/02-first-steps/16-arrow-functions-basics/article.md +++ b/1-js/02-first-steps/16-arrow-functions-basics/article.md @@ -1,6 +1,6 @@ -# 箭头函数，基础中的基础 +# 箭头函数，基础知识 -创建函数除了一般的函数表达式以外，还有一另种更好的非常简单和简洁的语法。 +创建函数还有另外一种非常简单的语法，并且这种方法通常比函数表达式更好。 它被称为“箭头函数”，因为它看起来像这样： @@ -8,9 +8,9 @@ let func = (arg1, arg2, ...argN) => expression ``` -...这里创建一个函数 `func`，它接受参数 `arg1..argN`，然后使用参数对右侧的 `expression` 求值并返回其结果。 +……这里创建了一个函数 `func`，它接受参数 `arg1..argN`，然后使用参数对右侧的 `expression` 求值并返回其结果。 -换句话说，它是下面版本的缩写： +换句话说，它是下面这段代码的更短的版本： ```js let func = function(arg1, arg2, ...argN) { @@ -23,7 +23,7 @@ let func = function(arg1, arg2, ...argN) { ```js run let sum = (a, b) => a + b; -/* 这个箭头函数是下面这个函数的缩写： +/* 这个箭头函数是下面这个函数的更短的版本： let sum = function(a, b) { return a + b; @@ -33,22 +33,22 @@ let sum = function(a, b) { alert( sum(1, 2) ); // 3 ``` -可以看到 `(a, b) => a + b` 表示一个函数，该函数接受两个名为 `a` 和 `b` 的参数。在执行时，它将对表达式 `a + b` 求值并返回结果。 +可以看到 `(a, b) => a + b` 表示一个函数接受两个名为 `a` 和 `b` 的参数。在执行时，它将对表达式 `a + b` 求值，并返回计算结果。 -- 如果我们只有一个参数，还可以省略掉参数外的圆括号，使其更短。 +- 如果我们只有一个参数，还可以省略掉参数外的圆括号，使代码更短。 例如： ```js run *!* let double = n => n * 2; - // 差不多等同于：let double = function(n) { return n * 2 } + // 差不多等同于：let double = function(n) { return n * 2 } */!* alert( double(3) ); // 6 ``` -- 如果没有参数，括号里将是空的（但括号应该保留）： +- 如果没有参数，括号将是空的（但括号应该保留）： ```js run let sayHi = () => alert("Hello!"); @@ -70,42 +70,42 @@ let welcome = (age < 18) ? welcome(); // 现在好了 ``` -一开始，箭头函数可能看起来不熟悉，也不容易读懂，但一旦我们的眼睛习惯之后，情况很快会改变。 +一开始，箭头函数可能看起来并不熟悉，也不容易读懂，但一旦我们看习惯了之后，这种情况很快就会改变。 -而且当我们懒得写太多字的时候，箭头函数这种简单的一行操作是非常方便。 +箭头函数对于简单的单行动作来说非常方便，尤其是当我们懒得打太多字的时候。 ## 多行的箭头函数 上面的例子从 `=>` 的左侧获取参数，然后使用参数计算右侧表达式的值。 -但有时我们需要更复杂一点的东西，比如多个表达式或语句。这也是可以做到的，但是我们应该用花括号括起来。然后在返回时使用一个普通的 `return`。 +但有时我们需要更复杂一点的东西，比如多行的表达式或语句。这也是可以做到的，但是我们应该用花括号括起来。然后使用一个普通的 `return` 将需要返回的值进行返回。 就像这样： ```js run -let sum = (a, b) => { // 花括号打开一个多行函数 +let sum = (a, b) => { // 花括号表示开始一个多行函数 let result = a + b; *!* - return result; // i如果我们使用花括号，那么我们需要一个显式的 “return” + return result; // 如果我们使用了花括号，那么我们需要一个显式的 “return” */!* }; alert( sum(1, 2) ); // 3 ``` -```smart header="More to come" -在这里，我们赞扬箭头功能的简洁性。但这还不止这些！ +```smart header="更多内容" +在这里，我们赞扬了箭头功能的简洁性。但还不止这些！ 箭头函数还有其他有趣的特性。 -为了更深入地研究它们，我们首先需要了解一些 JavaScript 其他方面的知识，因此我们将在后面的 一章中再继续研究箭头函数。 +为了更深入地学习它们，我们首先需要了解一些 JavaScript 其他方面的知识，因此我们将在后面的 一章中再继续研究箭头函数。 -现在，我们已经可以将箭头函数用于单行操作和回调了。 +现在，我们已经可以用箭头函数进行单行操作和回调了。 ``` ## 总结 -对于一句代码的函数来说，箭头函数是相当方便的。它具体有两种： +对于一行代码的函数来说，箭头函数是相当方便的。它具体有两种： -1. 不带花括号：`(...args) => expression` -- 右边是一个表达式：函数计算它并返回结果。 -2. 带花括号：`(...args) => { body }` -- 花括号允许我们在函数中编写多个语句，但是我们需要显式的返回来 `return` 一些内容。 +1. 不带花括号：`(...args) => expression` — 右侧是一个表达式：函数计算表达式并返回其结果。 +2. 带花括号：`(...args) => { body }` — 花括号允许我们在函数中编写多个语句，但是我们需要显式地 `return` 来返回一些内容。