箭头函数与普通函数的区别-优快云博客

本文链接：https://blog.youkuaiyun.com/weixin_52378257/article/details/120873167

箭头函数与普通函数的区别

箭头函数比普通函数书写更加简洁

如果没有要传递参数，就直接写一个空括号即可
如果只有一个参数，可以省去外面的括号
如果函数体只有一句返回语句没有其它代码，可以省略大括号

const fn = () => {}
//箭头函数没有要传递的参数可以只写一个括号
const test = prop => {}
//如果只有一个参数，可以省去外面的括号
const bandle = (a,b) => { return a + b}
//如果函数体只有一句返回语句没有其它代码，可以省略大括号
//可以简写为
const bandle = (a,b) => a + b

箭头函数没有自己的this和arguments
箭头函数是不会创建this和arguments，箭头函数的this是继承其上层作用域的this，所以在其定义的时候其this就已经确定了，并且this指向永不改变，在内部访问arguments其实是获取到其外层函数的arguments。

	const obj = {
            fn: function (a, b) {
                const test = () => {
                    console.log(this)
                    console.log(arguments)
                }
                test()
            }
        }
        //定义个箭头函数p
        const p = () => {console.log(this)}
        //将其赋值给obj内部属性p
        obj.p = p;
        obj.p() //Window {window: Window, self: Window, document: document, name: '', location: Location, …}
        //箭头函数在其定义的时候其this就已经确定了
        obj.fn(1,2) // {fn: ƒ, p: ƒ}
               //Arguments(2) [1, 2, callee: ƒ, Symbol(Symbol.iterator): ƒ]
        //其内部打印的this和arguments是其外面fn函数的this和arguments

箭头函数不能作为构造函数使用
构造函数是由new关键字操作的，主要做了几件事：
1. 首先创建了一个新的空对象
2. 设置原型，将空对象的隐式原型设置为构造函数的 prototype 对象。
3. 让函数的 this 指向这个新创建的空对象，执行构造函数的代码。为新创建的空对象添加属性。
4. 判断调用函数过后的返回值类型，如果是基本数据类型，则返回创建的对象。如果是引用类型，就返回这个引用类型的对象。

但是箭头函数并有没有自己的this和prototype对象所以它不同作为构造函数使用

箭头函数没有prototype对象

	const d = function () {  }
    console.log(d.prototype) //{constructor: ƒ}

    const a = ()=>{}
    console.log(a.prototype) //undefined

call()、apply()、bind()等方法不能改变箭头函数中this的指向

	 const obj = {
            c: 123
        };
        let fn = () => {
            console.log(this.c)
        };
        fn(); // undefined
        fn.call(obj); // undefined
        fn.apply(obj); // undefined
        fn.bind(obj)(); //undefined