@@ -17,7 +17,7 @@ log('Hello', 'China') // Hello China
17
17
log (' Hello' , ' ' ) // Hello World
18
18
```
19
19
20
- 上面代码检查函数` log ` 的参数` y ` 有没有赋值,如果没有,则指定默认值为` World ` 。这种写法的缺点在于,如果参数` y ` 赋值了,但是对应的布尔值为` false ` ,则该赋值不起作用。就像上面代码的最后一行,参数` y ` 等于空字符,结果被改为默认值。
20
+ 上面代码检查函数` log() ` 的参数` y ` 有没有赋值,如果没有,则指定默认值为` World ` 。这种写法的缺点在于,如果参数` y ` 赋值了,但是对应的布尔值为` false ` ,则该赋值不起作用。就像上面代码的最后一行,参数` y ` 等于空字符,结果被改为默认值。
21
21
22
22
为了避免这个问题,通常需要先判断一下参数` y ` 是否被赋值,如果没有,再等于默认值。
23
23
@@ -93,7 +93,7 @@ x = 100;
93
93
foo () // 101
94
94
```
95
95
96
- 上面代码中,参数` p ` 的默认值是` x + 1 ` 。这时,每次调用函数` foo ` ,都会重新计算` x + 1 ` ,而不是默认` p ` 等于 100。
96
+ 上面代码中,参数` p ` 的默认值是` x + 1 ` 。这时,每次调用函数` foo() ` ,都会重新计算` x + 1 ` ,而不是默认` p ` 等于 100。
97
97
98
98
### 与解构赋值默认值结合使用
99
99
@@ -110,7 +110,7 @@ foo({x: 1, y: 2}) // 1 2
110
110
foo () // TypeError: Cannot read property 'x' of undefined
111
111
```
112
112
113
- 上面代码只使用了对象的解构赋值默认值,没有使用函数参数的默认值。只有当函数` foo ` 的参数是一个对象时,变量` x ` 和` y ` 才会通过解构赋值生成。如果函数` foo ` 调用时没提供参数,变量` x ` 和` y ` 就不会生成,从而报错。通过提供函数参数的默认值,就可以避免这种情况。
113
+ 上面代码只使用了对象的解构赋值默认值,没有使用函数参数的默认值。只有当函数` foo() ` 的参数是一个对象时,变量` x ` 和` y ` 才会通过解构赋值生成。如果函数` foo() ` 调用时没提供参数,变量` x ` 和` y ` 就不会生成,从而报错。通过提供函数参数的默认值,就可以避免这种情况。
114
114
115
115
``` javascript
116
116
function foo ({x, y = 5 } = {}) {
@@ -136,7 +136,7 @@ fetch('http://example.com')
136
136
// 报错
137
137
```
138
138
139
- 上面代码中,如果函数` fetch ` 的第二个参数是一个对象,就可以为它的三个属性设置默认值。这种写法不能省略第二个参数,如果结合函数参数的默认值,就可以省略第二个参数。这时,就出现了双重默认值。
139
+ 上面代码中,如果函数` fetch() ` 的第二个参数是一个对象,就可以为它的三个属性设置默认值。这种写法不能省略第二个参数,如果结合函数参数的默认值,就可以省略第二个参数。这时,就出现了双重默认值。
140
140
141
141
``` javascript
142
142
function fetch (url , { body = ' ' , method = ' GET' , headers = {} } = {}) {
@@ -149,7 +149,19 @@ fetch('http://example.com')
149
149
150
150
上面代码中,函数` fetch ` 没有第二个参数时,函数参数的默认值就会生效,然后才是解构赋值的默认值生效,变量` method ` 才会取到默认值` GET ` 。
151
151
152
- 作为练习,请问下面两种写法有什么差别?
152
+ 注意,函数参数的默认值生效以后,参数解构赋值依然会进行。
153
+
154
+ ``` javascript
155
+ function f ({ a, b = ' world' } = { a: ' hello' }) {
156
+ console .log (b);
157
+ }
158
+
159
+ f () // world
160
+ ```
161
+
162
+ 上面示例中,函数` f() ` 调用时没有参数,所以参数默认值` { a: 'hello' } ` 生效,然后再对这个默认值进行解构赋值,从而触发参数变量` b ` 的默认值生效。
163
+
164
+ 作为练习,大家可以思考一下,下面两种函数写法有什么差别?
153
165
154
166
``` javascript
155
167
// 写法一
@@ -161,11 +173,7 @@ function m1({x = 0, y = 0} = {}) {
161
173
function m2 ({x, y} = { x: 0 , y: 0 }) {
162
174
return [x, y];
163
175
}
164
- ```
165
176
166
- 上面两种写法都对函数的参数设定了默认值,区别是写法一函数参数的默认值是空对象,但是设置了对象解构赋值的默认值;写法二函数参数的默认值是一个有具体属性的对象,但是没有设置对象解构赋值的默认值。
167
-
168
- ``` javascript
169
177
// 函数没有参数的情况
170
178
m1 () // [0, 0]
171
179
m2 () // [0, 0]
0 commit comments