ES6 箭头函数和java的lambda类似
1、和java中的lambda区别是这里使用=>,java使用->;
2、普通function中的this,谁调用方法,this就指向谁
3、箭头函数中的this,在哪定义this就指向哪,在script定义就指向window,若箭头函数外面包裹一层函数,则箭头函数的this就和外面包裹层的函数的this一样
(1)无形参:()=> xxx
(2)只有一个形参: 形参=> xxx
(3)两个即两个以上的形参: (形参1,形参2,...)=> xxx
(4)函数体只有一条语句,大括号可省略
(5)若只有一条表达式语句,省略大括号自动返回值,加上大括号得调用函数才能返回值
(6)多条语句大括号不可省略
代码示例:
<html ng-app='app' ng-controller='main' >
<head>
<meta charset="utf-8">
<meta name='viewport' content='width=device-width,user-scalable=no,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0'>
<script src='jq/jquery-3.4.1.js'></script>
<style>
</style>
</head>
<body >
<button class='b1'>1</button>
<button class='b2'>2</button>
<script>
let fun=() => console.log('箭头函数');
fun();
let fun2=a=> console.log(a);
fun2(1);
let fun3=(x,y)=> console.log(x+y);
fun3(1,2);
let fun4=(x,y)=>x+y;
console.log(fun4(2,2));
let fun5=(x,y)=>{console.log(x+y); return x+y;};
console.log(fun5(2,3));
var b1=document.querySelector('.b1');
var b2=document.querySelector('.b2');
b1.onclick=function(){
console.log(this);
}
b2.onclick=()=>console.log(this);
</script>
</body>
</html>