vue前端--箭头函数() =＞ {}详解

箭头函数 () => {}

• 基本语法：

(参数1, 参数2, ..., 参数N) => { 函数体 }

• 如果函数体只有一行，并且不需要返回语句（即隐式返回），则可以省略大括号和花括号：

(参数1, 参数2, ..., 参数N) => 表达式  
// 等同于  
(参数1, 参数2, ..., 参数N) => { return 表达式; }

•  如果函数只有一个参数，可以省略圆括号：

参数 => { 函数体 }  
// 或者  
参数 => 表达式

• 举例：

方法名 = (a,b) => a+b;

方法名(参数1,参数2)

//基本的箭头函数
const add = (a, b) => a + b;  
console.log(add(2, 3)); // 输出: 5

//只有一个参数的箭头函数
const square = x => x * x;  
console.log(square(4)); // 输出: 16

• 箭头函数会改变 this 的绑定方式

const obj = {  
  value: 1,  
  increment: function() {  
    // 这里的 this 指向 obj 对象  
    this.value++;  
  },  
  getValue: () => this.value // 注意：这里的 this 不会指向 obj 对象  
};