JavaScript:实例讲解使用ES6中默认参数和剩余参数时的注意事项

最新推荐文章于 2022-12-30 16:55:41 发布

转载最新推荐文章于 2022-12-30 16:55:41 发布 · 163 阅读

文章标签：

本文详细解析JavaScript参数的六种常见限制：参数名称冲突、普通参数与默认参数位置、剩余参数位置、默认参数值表达式、剩余参数与arguments对象的使用、默认参数值中的yield表达式限制、arguments对象在剩余参数函数中的使用限制。通过实例分析，帮助开发者避免常见的语法错误。

1.如果一个参数有了默认参数值,则其他所有类型的参数(普通参数,默认参数,剩余参数)都不能再有和它有相同的参数名:

function foo(x, x = 1) {}
//SyntaxError: duplicate argument names not allowed in this context

2.普通参数不能放在默认参数的右边:

function foo(x = 1, y) {}
//SyntaxError: parameter(s) with default followed by parameter without default

3.剩余参数必须在参数列表的最右边,它的右边不能再有任何类型的参数(也就是只能有一个剩余参数):

function foo(...x,y){}
//SyntaxError: parameter after rest parameter

4.剩余参数不能有默认参数值:

function foo(x, ...y = 1) {}
//SyntaxError: rest parameter may not have a default

5.默认参数值表达式中不能有yield表达式:

function foo(x = yield 1) {}
//SyntaxError: yield in default expression

6.在使用了剩余参数的函数中不能使用arguments对象:

function foo(...x) {arguments}  
//解析时错误
//SyntaxError: 'arguments' object may not be used in conjunction with a rest parameter

(function foo(...x) {eval("arguments")})()  
//执行时错误
//SyntaxError: 'arguments' object may not be used in conjunction with a rest parameter

7.如果不在严格模式中,直接把arguments重定义成剩余参数如何?看起来不错,但还是换个名字吧:

(function foo(...arguments) {return arguments})(1,2,3)
//[1,2,3]

(function foo(...rest) {"use strict";return rest})(1,2,3)
//[1,2,3]

8. 函数声明提升(hosting),x已经有值,所以,虽然x没有对应实参,但默认参数x的赋值操作x=1也不会执行.

(function foo(x = 1) {
    function x() {}
    return x;
})()
//function x() {}

上面代码示例的运行环境为Firefox 20.