箭头函数

分类: JavaScript 作者: 浏览:263 时间:2019年4月27日 23:40 评论:0

ES6标准新增了一种新的函数:Arrow Function(箭头函数),
箭头函数表达式的语法比函数表达式更简洁,并且没有自己的this,arguments,super或 new.target。这些函数表达式更适用于那些本来需要匿名函数的地方,并且它们不能用作构造函数
在了解箭头函数前,我们先看一个常规例子:

function fn(){  
    console.log("hello~")  
}  
fn() // hello~  

再来看看箭头函数如何表示的

fn = () => {  
    console.log("hello~")  
}  
fn() // hello~  

是不是简单很多,再来看看这条,这种只适用于只有一条语句时,可以省略大括号{}

fn = () => console.log("hello~")  
fn() // hello~  

如果我们需要传第一个和多个参数呢?

// 只有一个参数  
fn = (a) => a + 2  
// 只有一个参数时还可以省略小括号  
fn =a => a + 2  

// 多个参数  
fn = (a,b,c) a + b + c  

我们在来看看这个例子:

const Person = {  
    name: "Superficial",  
    age:23,  
    "get": function() {  
        setInterval(function (){  
            console.log(this.age)  
        })  
    }  
}  
Person.get() // undefined  

结果是不是出乎意料,没错,相信自己的眼睛,你没看错,这是由于this指向的问题
以前的写法是在函数中把this绑定到变量上

const Person = {  
    name: "Superficial",  
    age:23,  
    "get": function() {  
        let that = this;  
        setInterval(function (){  
            console.log(that.age)  
        })  
    }  
}  
Person.get() // 23  

查看详细箭头函数的语法相关内容

赞(2)

您可能感兴趣的:

评论(0)

  • 暂无评论