1.箭頭函式作用

作用：定義匿名函式

function (){}     ——>    ()=>{}        引數、函式體

2.箭頭函式基本語法

 *沒有引數： ()=>console.log('xxx')
 *一個引數：  i=>i+2 
 *大於一個引數 :   (x,y)=>x+y

寫法規則：
1.箭頭函式的引數可以一直加()，但只有一個引數時，可加可不加。
2.箭頭函式的函式體可以一直加{ }，但函式體只有一條語句時，可加可不加。

    若加{ }時，要返回內容，則需要用return
    若不加{ }時，則可以自動返回語句或表示式執行的結果，不需要return

使用場景：多用來定義回撥函式

<script type="text/javascript">
//形參的情況：
    //1.沒有形參的時候
        let fun3=()=>console.log("我是箭頭函式3");
        fun3();
    //2.只有一個形參的時候,    形參的位置()，可加可不加；
       let fun4=(a)=>console.log(a);
       fun4("aaa");
       let fun5=b=>console.log(b);
       fun5("bbb");
    
    //3.兩個及兩個以上形參的時候,   形參的位置()不可以省略
       let fun6=(x,y)=>console.log(x,y);
       fun6(20,30);
    	
 //函式體的情況：
    //1.函式體只有一條語句或表示式的時候, 函式體可以加{},也可以不加；
    //若{}省略時===》會自動返回語句執行的結果或表示式的結果；
    //若{}沒有省略===》則要加return去返回；
      let funn=()=>console.log("我是箭頭函式funn");
      let funn2=()=>{  console.log("我是箭頭函式funn2");  };
      funn();
      funn2();
      let funn3=(x,y)=>x+y;        //會將表示式自動返回；
      console.log(funn3(30,50));   //80
    
    //2.函式體不止一條語句或者表示式的情況；  {}不能省略；    
       let funn4=(x,y)=>{ 
            console.log(x,y);
            return x+y;         //加上{ }後，要加return來返回；
       }
       funn4(250,520);
       console.log(funn4(250,520)); 
 </script>

3.箭頭函式的特點

1.簡潔
2.箭頭函式this的特點 *

* 箭頭函式中的this，不是在呼叫它的時候決定的，而是在定義時所處的物件就是它的this；
* 擴充套件理解：  (判斷箭頭函式的this)
    1.看箭頭函式外層是否有函式
    2.如果有，則箭頭函式的this和外層函式指向相同。
        (若外層也是箭頭函式，則再往外層去找)
    3.如果沒有，則this指向window    

    <button id="btn1">測試箭頭函式this1</button>   
    <button id="btn2">測試箭頭函式this2</button> 
    <button id="btn3">測試箭頭函式this3</button>   
    <button id="btn4">測試箭頭函式this4</button>
    <script type="text/javascript">
    	let btn1=document.getElementById("btn1");
    	let btn2=document.getElementById("btn2");
    	btn1.onclick=function(){
    		alert(this);        //btn1來呼叫onclick，this在函式內
    	}                       //this指向btn1
    	btn2.onclick=()=>{          
    		alert(this);      //this指向window
    	}
    //理解1：這個箭頭函式在定義時，不是在某個物件中，而是在window大環境下定義的，所以指向window
    //理解2：看箭頭函式外層有沒有函式，沒有函式，則箭頭函式的this就是指向window；
    	
    	let btn3=document.getElementById("btn3");    	
    	let obj={
    		 name:"kobe",
    		 getName:function(){
    		 	btn3.onclick=()=>{
    		     alert(this);        //此時箭頭函式外有一個函式
       	        }
    		 } 
    	}
       obj.getName();  
       //外層函式的this指向obj，所以箭頭函式的this也指向obj
           
       let btn4=document.getElementById("btn4");
       let obj2={
    		 name:"kobe",
    		 getName:()=>{
    		 	btn4.onclick=()=>{
    		     alert(this);      //此時箭頭函式外有一個函式
       	        }
    		 } 
    	}
       obj2.getName();       //指向window；
       //箭頭函式找外面的函式，外面的還是箭頭函式，
       //則再找外面的，而外層沒有函式了，則指向window
       
       //總結：從箭頭函式往外層找，最近層的this指向什麼，箭頭函式this就指向什麼。