Javascript一参数胖箭头 - Javascript

Javascript一参数胖箭头 es6的语言特性之一，是一个快速简便的函数定义方式。它让函数定义变得简洁易懂，同时也提高了代码的可读性和可维护性。

胖箭头定义方式

(param1, param2, ...) => {
    // function body
};

胖箭头的定义方式如上，可以有多个参数，函数体中的代码块可以包含多个语句。下面是一个简单的例子：

const helloWorld = () => {
    console.log("Hello, World!");
};

helloWorld(); // 输出：Hello, World!

我们可以看出，在以上的代码中，我们用一个花括号括起来的代码块来定义了一个函数。这个函数称为匿名函数，因为没有给它一个名称。当调用helloWorld()函数的时候，控制台会输出 “Hello, World!”。

胖箭头的简写形式

如果函数中只有一条语句，就可以将大括号({})去掉，并将这个表达式放在箭头的右侧。下面是一个简写形式的例子：

const square = (num) => num * num;

console.log(square(5)); // 输出：25

这个函数仅仅是返回了一个表达式 num*num，所以我们可以省略花括号({})。

胖箭头和this的问题

在js中，this关键字通常指代调用函数的对象。但是，在胖箭头函数中，它没有自己的this关键字。因此，this指的是定义函数时所在的对象。下面是一个例子：

class MyClass {
    constructor() {
        this.myProperty = 42;
    }

    myMethod = () => {
        console.log(this.myProperty);
    }
}

const myInstance = new MyClass();

myInstance.myMethod(); // 输出：42

在上面的例子中，我们用胖箭头定义了一个myMethod函数，包含一个console.log(this.myProperty)语句，它调用了 myProperty 属性值，并输出到控制台上。注意myMethod函数定义中的 = () => 形式，这也是一种定义类方法的新形式。

虽然使用胖箭头定义函数也非常方便，但使用时也要注意避免滥用，尤其是写复杂函数时，不要过度使用胖箭头，因为过多的复杂逻辑可能会导致你的代码更难以维护、调试和理解。