js中箭头函数 及 针对箭头函数this指向问题引出的单体模式

ES6允许使用“箭头”(=>)定义函数

var f = a = > a

//等同于
var f = function(a){
   return a;  
}

如果箭头函数不需要参数或需要多个参数,就使用一个圆括号代表参数部分。

//无形参
var f = () => 2;
// 等同于
var f = function () { return 2 };

//多个形参
var sum = (a, b) => a + b;
// 等同于
var sum = function(a, b) {
  return a + b;
};

使用箭头函数注意点:

箭头函数有几个使用注意点。

(1)函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象。

var name = '张三';
var person = {
       name:'李四',
       age:18,  
       fav:function(){
           console.log(this); 
           console.log(this.name);   // 李四
        }
    }

person.fav();

// 此时this指向的是使用它的对象,也就是person对象
var person2 = {
    name: '李四',
    age: 18,
    fav: () => {
        // 当前this指向了定义时所在的对象(window)
        console.log(this);
    }
};

person2.fav();
// 使用箭头函数,它表示定义时所在的对象window。

单体模式:

var person = {
    name: '小马哥',
    age: 18,
    fav(){
        console.log(this.name);   // 小马哥
    }
}

person.fav();

(2)不可以使用arguments对象,该对象在函数体内不存在。如果要用,可以用 rest 参数代替。

    var p1 = {
        name:'张三',
        age:18,
        fav:function () {
            console.log(arguments)
        }
    }
    p1.fav('泡妞','把妹')  // Arguments(2) ["泡妞", "把妹", callee: ƒ, Symbol(Symbol.iterator): ƒ]

// *******************************************************

    var p2 = {
        name:'张三',
        age:18,
        fav:()=>{
            console.log(arguments)
        }
    }
    p2.fav('泡妞','把妹')  // Uncaught ReferenceError: arguments is not defined
原文地址:https://www.cnblogs.com/huangjm263/p/9070682.html