ES6箭头函数的特点以及this的指向,通俗理解

5 篇文章 0 订阅
    /*没有参数的时候
    * ()不可省略,否则报错
    * */
    let fn1 = () => console.log('我是箭头函数fn1')
    fn1() // '我是箭头函数fn1'

    /*
    * 只有一个参数的时候
    * ()可省略
    *
    * */
    let fn2 = a => console.log(a)
    fn2('我是箭头函数fn2') // '我是箭头函数fn2'

    /*
    * 两个参数
    * ()不可省略
    * */
   let fn3 = (a, b) => console.log(a + b)
    fn3(3, 5) //8

    //函数体
    /*
    * 只有一条语句时候,{}可省略,并且默认返回这条语句
    *
    * */
    let fn4 = (a, b) => a + b
    console.log(fn4(4, 4)) //8

    /*
    * 多条语句,{}不可省略
    *
    * */
    let fn5 = (a, b) => {
      console.log(a, b) // 1 2
      // a + b 所有的函数都有reture,没有明确指出返回值,测返回undefined
      return a + b
    }
   // console.log(fn5(10, 10)) // undefined
    console.log(fn5(1, 2)) //3
  //----------------------------------------------------------------
    //箭头函数的this
    /*
    * 箭头函数没有直接的this,this的指向不是由调用的时候决定的,而是在定义的时候处在的对象都是箭头函数的this
    *
    * */
  //箭头函数的外部没有其他函数包裹,所以this指向window
    let fn6 = () => console.log(this)
    fn6() // window

 //外面包裹箭头函数setName,this指向obj,所以箭头函数的this都是指向obj
    let obj = {
      name: '123',
      setName() {
        let fn7 = () => {
          console.log(this)
        }
        fn7()
      }
    }
    obj.setName() //obj
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值