美文网首页
箭头函数

箭头函数

作者: jasmine_6aa1 | 来源:发表于2020-04-28 21:21 被阅读0次

1,箭头函数定义

const arrowFunction = () => {
      
}

2,Es6 中箭头函数参数与返回值简写

当参数只有一个时,我们可以省略()
const arrowFunction =  num => {   }

当参数不是一个时,不可以省略()
const arrowFunction =  (num1,num2) => {   }

当返回值是一行代码时,可以省略 { return }
const arrowFunction =  (num1,num2) => num1 +num2

当返回值是多行代码时,不可以省略 { return }
const arrowFunction =  (num1,num2) => {  }

补充

const dome =  () => console.log( 'hello world' )
dome(); // hello world
console.log( dome() ); // undefined  因为 dome 函数没有return 值

3,箭头函数中 this 指向

注:箭头函数中的this,指向是上下文的this指向,继承它的父级this值

1,使用方式:最常用的是 setTimeout() 、setTimeout()
2,使用场景

直接在window下,调用

setTimeout(function() {
    //不管什么方式调这个都是通过 call() 方法,把this指向window
        console.log(this); // window,
      }, 2000);

setTimeout(() => {// 直接在window下进行调用,this指向window
      console.log(this) // window
    }, 2000) 

当在面向对象中定义
箭头函数中this查找方法:向外层作用域中,一层一层查找this,直到有this的定义

const updata = {
     setTimeout(function (){
         console.log(this) // window 
      }, 2000) 
      setTimeout(() => {//setTimeout方法中没有this,所以只能到updata中找,这里的this指向updata
          console.log(this) // updata
       }, 2000) 
 }

4,箭头函数与普通函数的区别

  • this 指向不同,箭头函数不绑定this,但会捕获上下文的this,作为自己的this
  • 箭头函数不绑定arguments, 取而代之的是用rest参数解决
  • 箭头函数是匿名函数,所以不能作为构造函数,因此也不能使用new
  • 箭头函数通过 call() 或 apply() 方法调用一个函数时,只传入了一个参数,对 this 并没有影响
  • 箭头函数没有原型属性

相关文章

  • ES6~箭头函数

    什么是箭头函数 单表达式箭头函数 相当于 多表达式箭头函数 箭头函数相当于匿名函数,并且简化了函数定义。箭头函数有...

  • 箭头函数和立即执行函数

    箭头函数 箭头函数和普通函数有什么区别?如果把箭头函数转换为不用箭头函数的形式,如何转换主要是this的差别,箭头...

  • 学习 ES 6 箭头函数

    箭头函数的用法 ES6 允许使用“箭头”(=>)定义函数。 箭头函数的一个用处是简化回调函数。 箭头函数 this...

  • 箭头函数

    箭头函数 箭头函数能让this的指向固定化 分析:1)第一个setInterval()中使用了箭头函数,箭头函数使...

  • TS  笔记this

    this 箭头函数在箭头函数创建的地方获得this;非箭头函数,在调用函数的地方获得this如图

  • 箭头函数和数组

    箭头函数&数组 箭头函数 特点: 没有 this 没有 arguments 没有prototype在箭头函数中使用...

  • 箭头函数

    箭头函数 为什么使用箭头函数

  • 箭头函数中this的指向

    箭头函数在平时开发中用着非常爽,箭头函数有什么特点呢 箭头函数不能够当做构造函数使用 箭头函数没有argument...

  • js学习笔记4(函数)

    1.箭头函数 ES6新增属性。箭头函数特别适合嵌入函数的场景。 箭头函数虽然语法简介,但是很多场合不适用。箭头函数...

  • js理解普通函数和箭头函数

    普通函数: 箭头函数: 区别: 构造函数和原型 箭头函数不能作为构造函数 不能new。会报错 箭头函数没有原型属性...

网友评论

      本文标题:箭头函数

      本文链接:https://www.haomeiwen.com/subject/ordbwhtx.html