-
Notifications
You must be signed in to change notification settings - Fork 0
/
10-2.html
189 lines (170 loc) · 5.33 KB
/
10-2.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
<!DOCTYPE html>
<html lang="zh-TW">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="icon" href="./public/favicon.ico" />
<meta http-equiv="cache-control" content="no-cache" />
<title></title>
<link rel="stylesheet" href=" https://necolas.github.io/normalize.css/8.0.1/normalize.css" />
<link rel="stylesheet" href="./hightlight/default.min.css" />
<link rel="stylesheet" href="./css/main.css" />
<link rel="stylesheet" href="./css/copybutton.css" />
<link rel="stylesheet" href="./css/hightlight.css" />
<script src="./hightlight/hightlight.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.11/clipboard.min.js"></script>
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-BEVZJDBC7Z"></script>
<script src="./js/gtag.js"></script>
</head>
<body>
<header>
<nav>
<h1>
<span id="toggle-menu"></span>
<a href="index.html"></a>
</h1>
</nav>
</header>
<main>
<aside>
<nav></nav>
</aside>
<article>
<h2 id="10-2">10-2 Exponentiation Operator (指數運算子)</h2>
<h3>ES6之前的 Math.pow()</h3>
<p>
過去要進行指數運算 (即計算 a 的 n 次方 , a 為底數， n
為指數，通常指數寫成上標，放在底數的右邊)，常用的是 Math.pow()
</p>
<pre><code class="language-js">
// 平方：
let x = 2;
console.log(Math.pow(x, 2)); // 4
// 相當於
console.log(x * x); // 4
</code></pre>
<pre><code class="language-js">
// 三次方：
let x = 2;
console.log(Math.pow(x, 3)); // 8
// 相當於
console.log(x * x * x); // 8
</code></pre>
<pre><code class="language-js">
// 函式表示
let square = x => Math.pow(x, 2);
let cube = x => Math.pow(x, 3);
console.log(square(6)); // 36
console.log(cube(3)); // 27
</code></pre>
<h3>現代的 Exponentiation Operator</h3>
<p>在 ES2016 (ES7) 提供了 exponentiation operator (指數運算子)，用於指數運算。</p>
<p>exponentiation 運算子會先做 Number()強轉。基本運算範例如下:</p>
<pre><code class="language-js">
2 ** 3; // 8
3 ** 2; // 9
3 ** 2.5; // 15.588457268119896
10 ** -1; // 0.1
2 ** 1024; // Infinity
Infinity ** Infinity // Infinity
NaN ** 2; // NaN
1 ** Infinity; // NaN
undefined ** 2 // NaN
NaN ** NaN // NaN
NaN ** 0; // 1
0 ** 0 // 1
undefined ** 0 // 1
'' ** '' // 1
0 ** 2 // 0
null ** 2 // 0
2n ** 3n; // 8n
2n ** 1024n; // A very large number, but not Infinity
2n ** 2; // TypeError: Cannot mix BigInt and other types, use explicit conversions
// To do exponentiation with a BigInt and a non-BigInt, convert either operand
2n ** BigInt(2); // 4n
Number(2n) ** 2; // 4
</code></pre>
<h3>Associativity</h3>
<p>exponentiation 運算子的 associativity 是 right-associative</p>
<pre><code class="language-js">
console.log(2 ** 3 ** 2); // 512
console.log(2 ** (3 ** 2)); // 512
// 實際計算順序：
// 1. 2 ** 3 ** 2
// 2. 2 ** 9
// 3. 512
</code></pre>
<p>若加上括號則結果會不同</p>
<pre><code class="language-js">
console.log((2 ** 3) ** 2); // 64
// 實際計算順序：
// 1. (2 ** 3) ** 2
// 2. 8 ** 2
// 3. 64
</code></pre>
<h3>Usage with unary operators</h3>
<p>搭配其他運算子使用錯誤案例如下:</p>
<pre><code class="language-js">
let a = 2;
let n = 3;
console.log(+a ** n);
console.log(-a ** n);
console.log(~a ** n);
console.log(!a ** n);
delete a ** n;
void a ** n;
typeof a ** n;
// 以上全部 SyntaxError: Unary operator used immediately before exponentiation expression. Parenthesis must be used to disambiguate operator precedence
</code></pre>
<p>
由此可知不能直接加在前面‧我們看一下
<a
href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Exponentiation"
>
mozilla Exponentiation
</a>
給出的正確範例:
</p>
<pre><code class="language-js">
-(2 ** 2); // -4
</code></pre>
<pre><code class="language-js">
(-2) ** 2; // 4
</code></pre>
<h3>Exponentiation assignment (**=)</h3>
<pre><code class="language-js">
let a = 3;
console.log(a **= 2);
// Expected output: 9
console.log(a **= 0);
// Expected output: 1
console.log(a **= 'hello');
// Expected output: NaN
</code></pre>
<pre><code class="language-js">
let bar = 5;
bar **= 2; // 25
bar **= "foo"; // NaN
</code></pre>
<pre><code class="language-js">
// 可以計算 BigInt
let foo = 3n;
foo **= 2n; // 9n
// 比較 ES6 以前處理 BigInt 的寫法是會報錯
console.log(Math.pow(2n, 3n)); // TypeError: Cannot convert a BigInt value to a number
</code></pre>
<p>
參考資料:
<a
href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Exponentiation_assignment"
>
Exponentiation assignment (**=)n
</a>
</p>
</article>
</main>
</body>
<script type="module" src="./js/main.js"></script>
</html>