diff --git a/docs/class.md b/docs/class.md index 870bf3d..b326790 100644 --- a/docs/class.md +++ b/docs/class.md @@ -76,7 +76,7 @@ var firstName = 'David'; var lastName = 'Belle'; var year = 1973; -export {firstName, lastName, year} +export {firstName, lastName, year}; ``` @@ -132,7 +132,19 @@ console.log("圆面积:" + area(4)); console.log("圆周长:" + circumference(14)); ``` -上面写法是逐一指定要导入的方法。另一种写法是使用module关键字,整体导入。 + +上面写法是逐一指定要导入的方法。另一种写法是整体导入。 + +```javascript + +import * as circle from 'circle'; + +console.log("圆面积:" + circle.area(4)); +console.log("圆周长:" + circle.circumference(14)); + +``` + +module关键字可以取代import语句,达到整体输入模块的作用。 ```javascript @@ -177,6 +189,14 @@ customName(); // 'foo' 显然,一个模块只能有一个默认方法。 +如果想在一条import语句中,同时输入默认方法和指定名称的变量,可以写成下面这样。 + +```javascript + +import customName, { otherMethod } from './export-default'; + +``` + 如果要输出默认属性,只需将值跟在`export default`之后即可。 ```javascript diff --git a/docs/destructuring.md b/docs/destructuring.md index 3df12fd..3fd5e5e 100644 --- a/docs/destructuring.md +++ b/docs/destructuring.md @@ -145,6 +145,9 @@ y // "World" var { x = 3 } = {}; x // 3 +var {x, y = 5} = {x: 1}; +console.log(x, y) // 1, 5 + ``` 如果要将一个已经声明的变量用于解构赋值,必须非常小心。 diff --git a/docs/function.md b/docs/function.md index 8ba947e..9fe50fd 100644 --- a/docs/function.md +++ b/docs/function.md @@ -2,7 +2,56 @@ ## 函数参数的默认值 -ES6允许为函数的参数设置默认值。 +在ES6之前,不能直接为函数的参数指定默认值,只能采用变通的方法。 + +```javascript + +function log(x, y) { + y = y || 'World'; + console.log(x, y); +} + +log('Hello') // Hello World +log('Hello', 'China') // Hello China +log('Hello', '') // Hello World + +``` + +上面代码检查函数log的参数y有没有赋值,如果没有,则指定默认值为World。这种写法的缺点在于,如果参数y赋值了,但是对应的布尔值为false,则该赋值不起作用。就像上面代码的最后一行,参数y等于空字符,结果被改为默认值。 + +为了避免这个问题,通常需要先判断一下参数y是否被赋值,如果没有,再等于默认值。这有两种写法。 + +```javascript + +// 写法一 +if (typeof y === 'undefined') { + y = 'World'; +} + + +// 写法二 +if (arguments.length === 1) { + y = 'World'; +} + + +``` + +ES6允许为函数的参数设置默认值,即直接写在参数定义的后面。 + +```javascript + +function log(x, y = 'World') { + console.log(x, y); +} + +log('Hello') // Hello World +log('Hello', 'China') // Hello China +log('Hello', '') // Hello + +``` + +可以看到,ES6的写法比ES5简洁许多,而且非常自然。下面是另一个例子。 ```javascript @@ -16,18 +65,16 @@ var p = new Point(); ``` -任何带有默认值的参数,被视为可选参数。不带默认值的参数,则被视为必需参数。 - 利用参数默认值,可以指定某一个参数不得省略,如果省略就抛出一个错误。 ```javascript function throwIfMissing() { - throw new Error('Missing parameter'); - } + throw new Error('Missing parameter'); +} function foo(mustBeProvided = throwIfMissing()) { - return mustBeProvided; + return mustBeProvided; } foo() @@ -37,6 +84,40 @@ foo() 上面代码的foo函数,如果调用的时候没有参数,就会调用默认值throwIfMissing函数,从而抛出一个错误。 +从上面代码还可以看到,参数mustBeProvided的默认值等于throwIfMissing函数的运行结果(即函数名之后有一对圆括号),这表明参数的默认值不是在定义时执行,而是在运行时执行(即如果参数已经赋值,默认值中的函数就不会运行),这与python语言不一样。 + +另一个需要注意的地方是,参数默认值所处的作用域,不是全局作用域,而是函数作用域。 + +```javascript + +var x = 1; + +function foo(x, y = x) { + console.log(y); +} + +foo(2) // 2 + +``` + +上面代码中,参数y的默认值等于x,由于处在函数作用域,所以x等于参数x,而不是全局变量x。 + +参数默认值可以与解构赋值,联合起来使用。 + +```javascript + +function foo({x, y = 5}) { + console.log(x, y); +} + +foo({}) // undefined, 5 +foo({x: 1}) // 1, 5 +foo({x: 1, y: 2}) // 1, 2 + +``` + +上面代码中,foo函数的参数是一个对象,变量x和y用于解构赋值,y有默认值5。 + ## rest参数 ES6引入rest参数(...变量名),用于获取函数的多余参数,这样就不需要使用arguments对象了。rest参数搭配的变量是一个数组,该变量将多余的参数放入数组中。 diff --git a/docs/reference.md b/docs/reference.md index 046e0b1..b27e1a3 100644 --- a/docs/reference.md +++ b/docs/reference.md @@ -26,6 +26,7 @@ - Axel Rauschmayer, [ECMAScript 6’s new array methods](http://www.2ality.com/2014/05/es6-array-methods.html): 对ES6新增的数组方法的全面介绍 - Nicholas C. Zakas, [Creating defensive objects with ES6 proxies](http://www.nczonline.net/blog/2014/04/22/creating-defensive-objects-with-es6-proxies/) - Addy Osmani, [Data-binding Revolutions with Object.observe()](http://www.html5rocks.com/en/tutorials/es7/observe/): 介绍Object.observer()的概念 +- Dmitry Soshnikov, [ES6 Notes: Default values of parameters](http://dmitrysoshnikov.com/ecmascript/es6-notes-default-values-of-parameters/): 介绍参数的默认值 ## Generator