箭头函数及其this的指向

目录

一、箭头函数

1、  基础语法

 2、箭头函数简写

 二、箭头函数的 this

1、全局函数下的 this

2、对象方法里面的 this

3、构造函数的this

4、 call()、apply()、bind()调用时的 this

---

一、箭头函数

ES6中引入了箭头函数。箭头函数允许我们编写更短的函数。

//之前普通函数
hello = function() {
  return "Hello World!";
}

//使用箭头函数之后

hello = () => {
  return "Hello World!";
}

1、  基础语法

 语法：() =>{} // ():函数 =>:必须的语法，指向代码块 {}:代码块

   原js写法
        function sum(a,b){
            return a+b;
        }
        console.log(sum(1,2));  //3

   现es6写法
        const sum=(a,b)=>{
            return a+b;
        }
        let res=sum(1,2);
        console.log(res);  //3

 2、箭头函数简写

代码块只有一句话，省略 { } 和 return

            const sum = (a,b)=> a+b;

            let res =  sum(1,2);

            console.log(res);   //3

只有一个参数时，小括号 ( ) 可省略 

        const sum=a=>a+3;

        let res=sum(1);

        console.log(res);   //4

       

        const sum=a=>{

            return a+3;

        }