关于javascript:js箭头函数使用

箭头函数应用

简化回调函数，简化函数表达式，固定this指向

arr.map(function(x) {
    return x * 2;
})

arr.map((x) => 2 * x)

• 没有本人的this，无奈通过call、apply、bind扭转this指向
• 没有arguments对象
• 没有protoType属性
• 没有[[Construct]]办法，不能被new调用，没有new.target绑定

 const fn1 = () => {
    console.log('arguments', arguments)
 }
 fn1(100, 200)  // error
   
 function fn2(){
    console.log('arguments', arguments)
 }
 fn2(100, 200)  // [100, 200, callee: ƒ, Symbol(Symbol.iterator): ƒ]

防止如下场景

1. 对象办法（原型办法）

2. 构造函数申明

   构造函数是通过 new 关键字来生成对象实例，生成对象实例的过程也是通过构造函数给实例绑定 this 的过程，而箭头函数没有本人的 this。因而不能应用箭头作为构造函数，也就不能通过 new 操作符来调用箭头函数

3. 事件监听回调
4. vue选项式api(生命周期、数据等)

留神：react组件中能够应用箭头函数

Vue组件实质上是一个 JS 对象；React 组件（非Hooks）他实质上是一个 ES6 的 class

class Man {
    constructor(name, city) {
        this.name = name
        this.city = city
    }
    getName = () => {
        return this.name
    }
}
const f = new Man('李四','上海')
console.log(f.getName())   // 李四

嵌套箭头函数

管道机制部署

const pipeline = (...funcs) =>
  val => funcs.reduce((a, b) => b(a), val);

const plus = a => a + 1;
const multiply = a => a * 2;
const addThenMultiply = pipeline(plus, multiply);

addThenMultiply(5)   // 12