【箭头函数和传统函数的区别】 前端
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]