JavaScript中箭头函数和用法是什么，怎样应用？

发布时间：2022-02-11 13:22:46 所属栏目：语言来源：互联网

导读：这篇文章我们来了解JavaScript中箭头函数的内容，下文介绍了什么是箭头函数，箭头函数的使用及不适用的场景等等，文中介绍很详细，有需要的朋友可以参考，感兴趣的朋友接下来就跟随小编来了解看看吧！ 1.什么是箭头函数？箭头函数表达式语法比函数表达式更

这篇文章我们来了解JavaScript中箭头函数的内容，下文介绍了什么是箭头函数，箭头函数的使用及不适用的场景等等，文中介绍很详细，有需要的朋友可以参考，感兴趣的朋友接下来就跟随小编来了解看看吧！

1. 什么是箭头函数？
箭头函数表达式语法比函数表达式更简洁，即函数的一种简化形式。
它的写法：

() => {};   // 可以用来写一个匿名函数
    它的结构：

const / let 函数名参数 => 函数体
    比如现在有一个一般形式的函数表达式

let add = function(x, y) {
return x + y;};
    可以用箭头函数来写：

let add = (x, y) => {
return x + y;};
    2. 箭头函数的化简写法
单个参数
// 对于单个参数，我们可以省略外面的圆括号let addOne = x => {
return x + 1;}
单行函数体
// 对于单行返回函数体，可以同时省略 {} 和 returnlet add (x, y) => x + y;
单行对象
// 对于返回单行对象，在外面加个 ()let add (x, y) => ({
value: x + y;});
    3. 箭头函数的基础知识
    箭头函数没有 this，它会根据作用域链在外层中寻找 this。
    举个例子：

var A = 1;let fun = {
    A: 2,
    printA: () => {
        console.log(this.A);
    },
    printAA: function() {
        let print = () => {
            console.log(this.A);
        }
        print();
    }};fun.printA(); // 1fun.printAA(); // 2
    调用 printA，里面是输出 this.A，由于箭头函数没有 this，所以在外层寻找，外层是 fun。在这里，fun.printA()是在全局作用域中调用的，所以外层的 this 指向的是 window，由于之前用 var 定义了一个 A = 1，所以输出的是 1。

    调用 printAA，在里面调用了 print()，输出 this.A，看 print 这个函数，是个箭头函数，他没有 this，所以找外层，它的外层是 printAA，它是由 fun 调用的，所以它的 this 指向 fun，所以输出 fun 中定义的 A，也就是 2。

    4. 箭头函数不适用的场景
作为构造函数
    实例化构造函数之后，它的 this 指向实例化的对像，而箭头函数没有 this，所以它不能用来做构造函数。

需要 this 指向调用对象的时候

需要使用 arguments 的时候

    箭头函数中没有 arguments，可以使用剩余参数来存参数。

（编辑：周口站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!