You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: manuscript/B-ECMAScript-7.md
+23-18Lines changed: 23 additions & 18 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,13 +1,15 @@
1
-
# ECMAScript 7 (2016)
1
+
# Minor Changes in ECMAScript 7 (2016)
2
2
3
-
The development of ECMAScript 6 took about four years, and after that, TC39 decided that this process was not sustainable. As a result, they moved to a yearly release cycle that would ensure new language features could make it into development sooner. The more frequent releases meant that each new edition would have a much smaller number of features than ECMAScript 6. To signify this change, future versions of the specification no longer prominently feature the edition number, and instead refer to the year in which the specification was published. As a result, ECMAScript 6 is also known as ECMAScript 2015, and ECMAScript 7 is formally known as ECMAScript 2016. Going forward, it's expected that the year-based name will be used for all future ECMAScript editions.
3
+
The development of ECMAScript 6 took about four years, and after that, TC39 decided that such a long development process was unsustainable. Instead, they moved to a yearly release cycle to ensure new language features would make it into development sooner.
4
4
5
-
ECMAScript 2016 was finalized in March 2016 and contained only two additions to the language, which are covered in this chapter.
5
+
More frequent releases mean that each new edition of ECMAScript should have fewer new features than ECMAScript 6. To signify this change, new versions of the specification no longer prominently feature the edition number, and instead refer to the year in which the specification was published. As a result, ECMAScript 6 is also known as ECMAScript 2015, and ECMAScript 7 is formally known as ECMAScript 2016. TC39 expects to use the year-based naming system for all future ECMAScript editions.
6
6
7
+
ECMAScript 2016 was finalized in March 2016 and contained only two additions to the language: a new mathematical operator and a new array method. Both are covered in this appendix.
7
8
8
-
## Exponentiation Operator
9
9
10
-
The only change to JavaScript syntax introduced in ECMAScript 2016 is the exponentiation operator, which is a mathematical operation that applies an exponent to a base. JavaScript already had the `Math.pow()` method to perform exponentiation, however, JavaScript was one of the only languages that required a method rather than a formal operator (which some argue is easier to read and reason about).
10
+
## The Exponentiation Operator
11
+
12
+
The only change to JavaScript syntax introduced in ECMAScript 2016 is the *exponentiation operator*, which is a mathematical operation that applies an exponent to a base. JavaScript already had the `Math.pow()` method to perform exponentiation, but JavaScript was also one of the only languages that required a method rather than a formal operator. (And some developers argue an operator is easier to read and reason about.)
11
13
12
14
The exponentiation operator is two asterisks (`**`) where the left operand is the base and the right operand is the exponent. For example:
13
15
@@ -22,25 +24,25 @@ This example calculates 5^2^, which is equal to 25. You can still use `Math.pow(
22
24
23
25
### Order of Operations
24
26
25
-
The exponentiation operator has the highest precedence of all operators in JavaScript. That means it is applied first to any compound operation, for example:
27
+
The exponentiation operator has the highest precedence of all operators in JavaScript. That means it is applied first to any compound operation, as in this example:
26
28
27
29
```js
28
30
let result =2*5**2;
29
31
console.log(result); // 50
30
32
```
31
33
32
-
In this example, the calculation of 5^2^ happens first and then the result is multiplied by 2 for a result of 50.
34
+
The calculation of 5^2^ happens first. The resulting value is then multiplied by 2 for a final result of 50.
33
35
34
36
### Operand Restriction
35
37
36
-
The exponentiation operator does have a somewhat unusual restriction that isn't present for other operators.The left side of an exponentiation operation cannot be a unary expression other than `++` or `--`. For example, this is invalid syntax:
38
+
The exponentiation operator does have a somewhat unusual restriction that isn't present for other operators.The left side of an exponentiation operation cannot be a unary expression other than `++` or `--`. For example, this is invalid syntax:
37
39
38
40
```js
39
41
// syntax error
40
42
let result =-5**2;
41
43
```
42
44
43
-
The `-5` in this example is a syntax error because the order of operations is ambiguous. Does the `-` apply just to `5` or the result of `5 ** 2`? Disallowing unary expressions on the left side eliminates the ambiguity. In order to clearly specify intent, you need to include parentheses either around `-5` or around `5 ** 2`, as in this example:
45
+
The `-5` in this example is a syntax error because the order of operations is ambiguous. Does the `-` apply just to `5` or the result of the `5 ** 2` expression? Disallowing unary expressions on the left side of the exponentiation operator eliminates that ambiguity. In order to clearly specify intent, you need to include parentheses either around `-5` or around `5 ** 2` as follows:
44
46
45
47
```js
46
48
// ok
@@ -49,8 +51,9 @@ let result1 = -(5 ** 2); // equal to -25
49
51
// also ok
50
52
let result2 = (-5) **2; // equal to 25
51
53
```
54
+
If you put the parentheses around the expression, the `-` is applied to the whole thing. When the parentheses surround `-5`, it's clear that you want to raise -5 to the second power.
52
55
53
-
The only unary operations allowed on the left side of an exponentiation operation are `++` and `--`. Both of these operators have clearly-defined behavior on their operands, where a prefix `++` or `--` changes the operand before any other operations take place and the postfix versions don't apply any changes until after the entire expression has been evaluated. In both cases, they are safe to use on the left side:
56
+
You don't need parentheses to use `++` and `--` on the left side of the exponentiation operator because both operators have clearly-defined behavior on their operands. A prefix `++` or `--` changes the operand before any other operations take place, and the postfix versions don't apply any changes until after the entire expression has been evaluated. Both use casesare safe on the left side of this operator, as this code demonstrates:
54
57
55
58
```js
56
59
let num1 =2,
@@ -65,11 +68,13 @@ console.log(num2); // 1
65
68
66
69
In this example, `num1` is incremented before the exponentiation operator is applied, so `num1` becomes 3 and the result of the operation is 9. For `num2`, the value remains 2 for the exponentiation operation and then is decremented to 1.
67
70
68
-
## Array.prototype.includes()
71
+
## The Array.prototype.includes() Method
72
+
73
+
You might recall that ECMAScript 6 added `String.prototype.includes()` in order to check whether certain substrings exist within a given string. Originally, ECMAScript 6 was also going to introduce an `Array.prototype.includes()` method to continue the trend of treating strings and arrays similarly. But the specification for `Array.prototype.includes()` was incomplete by the ECMAScript 6 deadline, and so `Array.prototype.includes()` ended up in ECMAScript 2016 instead.
69
74
70
-
You might recall that ECMAScript 6 added `String.prototype.includes()` in order to find if certain substrings exist within a given string. The original plan was to also introduce `Array.prototype.includes()` in ECMAScript 6 to continue the trend of treating strings and arrays similarly. However, the specification for `Array.prototype.includes()` was incomplete by the ECMAScript 6 deadline, and so `Array.prototype.includes()` ended up in ECMAScript 2016 instead.
75
+
### How to Use Array.prototype.includes()
71
76
72
-
The `Array.prototype.includes()` method accepts two arguments: the value to search for and an optional index from which to start the search. When the second argument is provided, `includes()` starts the match from that index (the default is `0`). The return value is `true`when the value is found inside of the array and `false` if not. For example:
77
+
The `Array.prototype.includes()` method accepts two arguments: the value to search for and an optional index from which to start the search. When the second argument is provided, `includes()` starts the match from that index. (The default starting index is `0`.) The return value is `true`if the value is found inside the array and `false` if not. For example:
In this example, `values.includes()` returns `true` for the value of `1` and `false` for the value of `0`, which is not in the array. When the second argument is used to start the search at index 2 (which contains the value `3`), `values.includes()` returns `false` because the number `1` is not found between index 2 and the end of the array.
89
+
Here, calling `values.includes()` returns `true` for the value of `1` and `false` for the value of `0` because `0` isn't in the array. When the second argument is used to start the search at index 2 (which contains the value `3`), the `values.includes()` method returns `false` because the number `1` is not found between index 2 and the end of the array.
85
90
86
91
### Value Comparison
87
92
88
-
The value comparison performed by the `includes()` method uses the `===` with one exception: `NaN` is considered equal to `NaN` even though `NaN === NaN` evaluates to `false`. This is different than the behavior of `indexOf()`, which strictly uses `===` for comparison. For example:
93
+
The value comparison performed by the `includes()` method uses the `===`operotor with one exception: `NaN` is considered equal to `NaN` even though `NaN === NaN` evaluates to `false`. This is different than the behavior of the `indexOf()` method, which strictly uses `===` for comparison. To see the difference, consider this code:
In this example, `values.indexOf()` returns `-1` for `NaN` even though it is contained in `values`. On the other hand, `values.includes()` returns `true` for `NaN` because of the different value comparison used.
102
+
The `values.indexOf()`method returns `-1` for `NaN` even though `NaN` is contained in the `values` array. On the other hand, `values.includes()` returns `true` for `NaN` because it uses a different value comparison operator used.
98
103
99
-
W> Because of the difference in how `NaN` is treated, I recommend using `includes()` instead of `indexOf()` whenever you want to check just for the existence of a value in an array and don't need to know the index. If you need to know where in the array a value exists, then you have to use `indexOf()`.
104
+
W> When you want to check just for the existence of a value in an array and don't need to know the index , I recommend using `includes()` because of the difference in how `NaN` is treated by the `includes()` and `indexOf()` methods. If you do need to know where in the array a value exists, then you have to use the `indexOf()` method.
100
105
101
106
Another quirk of this implementation is that `+0` and `-0` are considered to be equal. In this case, the behavior of `indexOf()` and `includes()` is the same:
Here, both `indexOf()` and `includes()` find `+0` when `-0` is passed because the two values are considered equal. Note that this is different than the behavior of `Object.is()`, which considers `+0` and `-0` to be different values.
115
+
Here, both `indexOf()` and `includes()` find `+0` when `-0` is passed because the two values are considered equal. Note that this is different than the behavior of the `Object.is()` method, which considers `+0` and `-0` to be different values.
0 commit comments