JavaScript中函数分传统函数和箭头函数,核心区别在于this绑定(传统函数动态绑定,箭头函数继承外层this)、arguments、new调用及prototype等行为。

JavaScript 中定义函数主要有两种方式:传统函数(function 声明或表达式)和箭头函数(=>)。它们最核心的区别不在语法糖,而在 this 绑定、arguments、new 调用、以及词法作用域行为 上。
传统函数的定义方式
传统函数可通过函数声明、函数表达式或构造函数创建:
函数声明:function add(a, b) { return a + b; } —— 可被提升(hoisted)函数表达式:const multiply = function(a, b) { return a * b; }; —— 不提升,需先定义后调用Function 构造器:const power = new Function('x', 'n', 'return Math.pow(x, n);'); —— 动态生成,不常用,且无法访问外层闭包
箭头函数的定义方式
箭头函数是 ES6 引入的简写形式,必须用表达式写法,没有声明提升:
无参: const sayHi = () => console.log('Hi');单参: const square = x => x * x;(括号可省)多参或复杂逻辑: const greet = (name, age) => { return `I'm ${name}, ${age} years old.`; };
注意:箭头函数体若为单个表达式,隐式返回;若用花括号,则需显式写 return。
立即学习“Java免费学习笔记(深入)”;
this 绑定机制完全不同
这是最关键差异:
传统函数的 this 在调用时动态绑定,取决于谁调用它(如对象方法、事件回调、call/apply 等)箭头函数没有自己的 this,它会沿作用域链向上查找,继承外层普通函数或全局作用域的 this 值
典型场景:在对象方法中使用定时器或事件监听时,箭头函数能自然捕获当前对象的 this,而传统函数容易丢失:
const obj = { name: 'Alice', regular() { setTimeout(function() { console.log(this.name); // undefined(this 指向 global 或 undefined) }, 100); }, arrow() { setTimeout(() => { console.log(this.name); // 'Alice'(继承外层 arrow 函数的 this) }, 100); }};
其他重要区别
没有 arguments 对象:箭头函数内访问 arguments 会报错,需用剩余参数 ...args不能作为构造函数:调用 new myArrowFunc() 会抛出 TypeError没有 prototype 属性:所以不可用于需要原型链的场景(如继承)没有 super 或 new.target:在类方法中慎用箭头函数处理继承相关逻辑
基本上就这些。选哪种函数,关键看是否需要独立的 this、是否要被 new 调用、或是否在回调中需保持上下文 —— 不复杂但容易忽略细节。
以上就是javascript函数怎样定义_箭头函数与传统函数有何不同?的详细内容,更多请关注创想鸟其它相关文章!
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1543170.html
微信扫一扫
支付宝扫一扫