Small readability changes

Small changes to improve readability. No changes to the meaning or to the example code have been made.
This commit is contained in:
Alexander Ogilvie 2017-12-22 11:06:49 +09:00 committed by GitHub
parent 0130a5967e
commit 98ef0caf8d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -8,7 +8,7 @@ For instance:
- `Object.assign(dest, src1, ..., srcN)` -- copies properties from `src1..N` into `dest`.
- ...and so on.
In this chapter we'll see how to do the same. And, more important, how to feel comfortable working with such functions and arrays.
In this chapter we'll learn how to do the same. And, more importantly, how to feel comfortable working with such functions and arrays.
[cut]
@ -27,7 +27,7 @@ alert( sum(1, 2, 3, 4, 5) );
There will be no error because of "excessive" arguments. But of course in the result only the first two will be counted.
The rest parameters can be mentioned in a function definition with three dots `...`. They literally mean: "gather the remaining parameters into an array".
The rest parameters can be mentioned in a function definition with three dots `...`. They literally mean "gather the remaining parameters into an array".
For instance, to gather all arguments into array `args`:
@ -45,9 +45,9 @@ alert( sumAll(1, 2) ); // 3
alert( sumAll(1, 2, 3) ); // 6
```
We can choose to get first parameters as variables, and gather only the rest.
We can choose to get the first parameters as variables, and gather only the rest.
Here the first two arguments go into variables and the rest goes to `titles` array:
Here the first two arguments go into variables and the rest go into `titles` array:
```js run
function showName(firstName, lastName, ...titles) {
@ -72,7 +72,7 @@ function f(arg1, ...rest, arg2) { // arg2 after ...rest ?!
}
```
The `...rest` must always be the last.
The `...rest` must always be last.
````
## The "arguments" variable
@ -98,13 +98,13 @@ showName("Julius", "Caesar");
showName("Ilya");
```
In old times, rest parameters did not exist in the language, and `arguments` was the only way to get all arguments of the function no matter of their total number.
In old times, rest parameters did not exist in the language, and using `arguments` was the only way to get all arguments of the function, no matter their total number.
And it still works, we can use it.
And it still works, we can use it today.
But the downside is that although `arguments` is both array-like and iterable, it's not an array. It does not support array methods, so we can't say call `arguments.map(...)`.
But the downside is that although `arguments` is both array-like and iterable, it's not an array. It does not support array methods, so we can't call `arguments.map(...)` for example.
Also, it always has all arguments in it, we can't capture them partially, like we did with rest parameters.
Also, it always contains all arguments. We can't capture them partially, like we did with rest parameters.
So when we need these features, then rest parameters are preferred.
@ -123,21 +123,19 @@ f(1); // 1
```
As we remember, arrow functions don't have their own `this`. Now we know they don't have the special `arguments` object either.
````
## Spread operator [#spread-operator]
We've just seen how to get an array from the list of parameters.
But sometimes we need to do exactly the reverse.
For instance, there's a built-in function [Math.max](mdn:js/Math/max) that returns the greatest number from the list:
For instance, there's a built-in function [Math.max](mdn:js/Math/max) that returns the greatest number from a list:
```js run
alert( Math.max(3, 5, 1) ); // 5
```
Now let's say we have an array `[3, 5, 1]`. How to call `Math.max` with it?
Now let's say we have an array `[3, 5, 1]`. How do we call `Math.max` with it?
Passing it "as it" won't work, because `Math.max` expects a list of numeric arguments, not a single array:
@ -149,9 +147,9 @@ alert( Math.max(arr) ); // NaN
*/!*
```
...And surely we can't manually list items in the code `Math.max(arg[0], arg[1], arg[2])`, because we may be unsure how much are there. As our script executes, there might be many, or there might be none. Also that would be ugly.
And surely we can't manually list items in the code `Math.max(arg[0], arg[1], arg[2])`, because we may be unsure how many there are. As our script executes, there could be a lot, or there could be none. And that would get ugly.
*Spread operator* to the rescue. It looks similar to rest parameters, also using `...`, but does quite the opposite.
*Spread operator* to the rescue! It looks similar to rest parameters, also using `...`, but does quite the opposite.
When `...arr` is used in the function call, it "expands" an iterable object `arr` into the list of arguments.
@ -172,7 +170,7 @@ let arr2 = [8, 3, -8, 1];
alert( Math.max(...arr1, ...arr2) ); // 8
```
...And even combine the spread operator with normal values:
We can even combine the spread operator with normal values:
```js run
@ -182,7 +180,7 @@ let arr2 = [8, 3, -8, 1];
alert( Math.max(1, ...arr1, 2, ...arr2, 25) ); // 25
```
Also spread operator can be used to merge arrays:
Also, the spread operator can be used to merge arrays:
```js run
let arr = [3, 5, 1];
@ -197,7 +195,7 @@ alert(merged); // 0,3,5,1,2,8,9,15 (0, then arr, then 2, then arr2)
In the examples above we used an array to demonstrate the spread operator, but any iterable will do.
For instance, here we use spread operator to turn the string into array of characters:
For instance, here we use the spread operator to turn the string into array of characters:
```js run
let str = "Hello";
@ -225,7 +223,7 @@ But there's a subtle difference between `Array.from(obj)` and `[...obj]`:
- `Array.from` operates on both array-likes and iterables.
- The spread operator operates only on iterables.
So, for the task of turning something into an array, `Array.from` appears more universal.
So, for the task of turning something into an array, `Array.from` tends to be more universal.
## Summary
@ -234,8 +232,8 @@ When we see `"..."` in the code, it is either rest parameters or the spread oper
There's an easy way to distinguish between them:
- When `...` is at the end of function parameters, it's "rest parameters" and gathers the rest of the list into the array.
- When `...` occurs in a function call or alike, it's called a "spread operator" and expands an array into the list.
- When `...` is at the end of function parameters, it's "rest parameters" and gathers the rest of the list of arguments into an array.
- When `...` occurs in a function call or alike, it's called a "spread operator" and expands an array into a list.
Use patterns: