函数默认参数
之前,在调用函数有形参的函数时,如果没有传递参数,或者传递的参数个数小于函数形参的个数时,会默认什麽都不输出,给函数设置默认参数后,当出现这种情况时,会显示事先设置的默认值。例如:
function a(c,b){
console.log(c,b);
}
a();// undefined undefined
a('我是');//我是 undefined
给b设置默认值:
function a(c,b='小杨'){
console.log(c,b);
}
a();// undefined "小杨"
a('我是');//我是 小杨
箭头函数
* 作用: 定义匿名函数
* 基本语法:
* 没有参数: () => console.log('xxxx')
* 一个参数: i => i+2
* 大于一个参数: (i,j) => i+j
* 函数体不用大括号: 默认返回结果
* 函数体如果有多个语句, 需要用{}包围,若有需要返回的内容,需要手动返回
* 使用场景: 多用来定义回调函数
* 箭头函数的特点:
1、简洁
2、箭头函数没有自己的this,箭头函数的this不是调用的时候决定的,而是在定义的时候处在的对象就是它的this
3、扩展理解: 箭头函数的this看外层的是否有函数,
如果有,外层函数的this就是内部箭头函数的this,
如果没有,则this是window。
```
<script type="text/javascript">
let fun = function () {
console.log('fun()');
};
fun();
//没有形参,并且函数体只有一条语句
let fun1 = () => console.log('fun1()');
fun1();
console.log(fun1());
//一个形参,并且函数体只有一条语句
let fun2 = x => x;
console.log(fun2(5));
//形参是一个以上
let fun3 = (x, y) => x + y;
console.log(fun3(25, 39));//64
//函数体有多条语句
let fun4 = (x, y) => {
console.log(x, y);
return x + y;
};
console.log(fun4(34, 48));//82
setTimeout(() => {
console.log(this);
},1000)
let btn = document.getElementById('btn');
//没有箭头函数
btn.onclick = function () {
console.log(this);//btn
};
//箭头函数
let btn2 = document.getElementById('btn2');
let obj = {
name : 'kobe',
age : 39,
getName : () => {
btn2.onclick = () => {
console.log(this);//obj
};
}
};
obj.getName();
function Person() {
this.obj = {
showThis : () => {
console.log(this);
}
}
}
let fun5 = new Person();
fun5.obj.showThis();
</script>
```
注意:
1、this问题,箭头函数里,this指向函数所在的对象,不再是运行所在的对象。例:
let json={
id:1,
show:function(){
setTimeout(function(){
alert(this.id);//undefined 因为setTimeout是由window执行的,这里的this指向window,而window中没有id
},2000)
}
};
json.show();
更改为箭头函数:
let json={
id:1,
show:function(){
setTimeout(()=>{
alert(this.id);//1 因为箭头函数里,this指向函数所在的对像
},2000)
}
};
json.show();
2、箭头函数里没有 arguments,可以用'...'运算符完美替代。
3、箭头函数不能当构造函数
网友评论