「这是我参与2022首次更文挑战的第8天，活动详情查看：2022首次更文挑战」。
ES系列文章
函数的参数新特性有：
- 参数默认值
- 与解构赋值结合
- length属性
- 参数的作用域
- 函数的name属性
在ES中定义一个函数如下：
function foo(x,y) { // (x,y)是形参
console.log(x,y)
}
foo('hello')
// hello undefined
在ES5中：
function foo(x,y) {
y = y || 'world'
//逻辑或 只要有一个满足条件那么另一个也满足。不够严谨
console.log(x,y)
}
foo('hello','yyds')
//hello yyds
foo('hello', 0 )
//hello world
0在js中返回false所以返回hello world
参数默认值
在ES6中函数的参数可以设置默认值：
function foo(x,y = 'world') {
console.log(x,y)
}
foo('hello',)
//hello world
foo('hello', 0 )
//hello 0
优点：
- 代码简洁
- 当函数参数有默认值，能够快速确认哪些参数是必传，哪些参数可以省略
- 方便以后代码优化 注意：
- 函数内部对于参数同名的变量不能再次声明。
- 函数参数不能重名
- 参数默认值必须放到最后
与解构赋值结合
function foo({x,y = 5}) {
console.log(x,y)
}
foo({})
// undefined 5
foo({
x:1
})
// 1 5
function ajaxRequest(url,{
body=''
methods='GET'
headers={}
}={}) {
console.log(methods)
};
ajaxRequest('http://baidu.com'){
menthod:'post'
}
//当默认参数与解构赋值一起使用，代码可读更强更简洁
length长度属性
length长度属性作用：返回函数参数中没有指定默认值的个数。（例子如下：）
function foo(x,y,z) {
console.log(x,y)
}
console.log(foo.length)
//3
function foo(x,y,z=5) {
console.log(x,y)
}
console.log(foo.length)
//2
参数的作用域
let x = 1
function foo(x,y = x) {
console.log(y)
}
foo(2)
//2
//函数的参数会形成一个单独的作用域,当x等于当前作用域中的x,所以x=2,而不是全局的1，所以最后输出2。
let x = 1 //全局
function foo(y = x) {
let x = 2 //局部
console.log(y)
//函数内部的值不会影响函数外部的值
}
foo()
//1
//在当前作用域中x是没有被定义的，就会沿着作用域链往外面寻找，而外边的x等于1，所以x=1的值赋给了y，所以y=1.
function foo(y = x) {
let x = 2
console.log(y)
}
foo()
//报错
//在当前作用域中y=x，当x没有值就会沿着作用域链往外寻找，参考上面例子，上面列子定义了全局x，而在这个例子中定义在局部，所以会报错
函数的name属性
function foo() {}
console.log(foo.name)//foo
console.log((new Function).name)
//返回该函数的函数名,anonymous
//function.bind（）返回bound 函数名，匿名函数.bind（）返回bound。
一个前端小白，若文章有错误内容，欢迎大佬指点讨论！
