> 文档中心 > 【箭头函数和传统函数的区别】 前端

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

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]