【箭头函数和传统函数的区别】 前端

1. 传统的函数中， this的指向性不明确，对着环境的变化随之发生变化

     箭头函数，this指向性明确 永远指向生产环境

 // function show() {
        //     console.log(this)//49行调用 这里输出object
        // }

        let show = () => {
            console.log(this)//49行调用 这里输出window
        }

        let obj = {
            name: "123",
            show
        }
        obj.show()

2. function函数 存在提升功能， 箭头函数没有

       //箭头函数  无法在定义函数之前使用 
          show(1, 2, 3, 4)//报错 无法在初始化之前访问 show
         let show = () => {
            console.log(arguments)
        }
       

        //传统函数   定义的函数是全局的 可以在定义函数的代码上面使用函数
         show2()//1111

         function show2() {
            console.log(1111)
        }

3. function函数可以作为构造函数，但是箭头函数不可以

原因：箭头函数的this不会发生改变，永远指向生产环境

 //创建构造函数 人类
        function person(name, age) {
            this.name = name;
            this.age = age;

        }
        person.prototype.eat = function() {
            console.log(this.name + "正在吃")
        }

        // 创建一个人类对象 张三
        var p1 = new person("张三", 22)
        p1.eat()

4. function函数中 存在 arguments参数集合，箭头函数没有 但是可以利用拓展运算符 ...

 function show(a, b) {
            console.log(arguments) //arguments永远保存所有的参数
        }

//拓展运算符 ...
 let show2 = (a, b, ...args) => { //...args  rest参数 
            console.log(args) //保存除了形参之外的所有的参数的数组
        }

        show(1, 2, 3, 4)//[1,2,3,4]
        show2(1, 2, 3, 4)//[3,4]