讲师中心 微信公众号
AI工具推荐 视频效率加速

javascript函数怎样定义_箭头函数与传统函数有何不同?

阿宇同学_5804

阿宇同学_5804

发布时间:2025-12-17 13:05:02

|

775人浏览过

|

来源于php中文网

原创

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

javascript函数怎样定义_箭头函数与传统函数有何不同?

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 Api Extractor
Java Api Extractor

从 Java 项目中提取 Controller 层接口定义为 JSON 数据。

下载

立即学习“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 调用、或是否在回调中需保持上下文 —— 不复杂但容易忽略细节。

热门AI工具

更多
Lovart
Lovart Hot

一款面向视觉设计创作的AI设计平台,可通过智能体和画布工作流辅助制作海报、Logo、网页、PPT及其他视觉内容。

UP简历
UP简历 Hot

一款AI办公效率工具,主要用于基于AI技术的免费在线简历制作工具,适合需要提升相关任务效率的用户。

WorkBuddy

一款AI办公效率工具,主要用于腾讯云推出的AI原生桌面智能体工作台,适合需要提升相关任务效率的用户。

DeepSeek

DeepSeek是一款面向对话、写作、编程和推理场景的AI大模型工具。

码上飞
码上飞 Hot

一款基于自然语言的AI应用开发平台,可根据用户描述自动生成应用程序,帮助个人和团队快速完成应用原型与开发。

小橡皮AI

一款AI工具,主要用于小橡皮一键去AI味,将机器味重的内容改得更有活人感,防止因为 AI 内容被平台打上 AI 标签,以及限流,适合需要提升相关任务效率的用户。

讯飞绘文

讯飞绘文是一款由科大讯飞推出的一站式 AIGC 内容运营平台。

豆包大模型

豆包大模型是一款由字节跳动推出的企业级大语言模型服务平台。

切问学术

切问学术是一款AI论文写作工具,复旦大学NLP团队推出的AI学术智能体。

相关专题

更多
es6新特性
es6新特性

es6新特性有:1、块级作用域变量;2、箭头函数;3、模板字符串;4、解构赋值;5、默认参数;6、 扩展运算符;7、 类和继承;8、Promise。本专题为大家提供es6新特性的相关的文章、下载、课程内容,供大家免费下载体验。

305

2023.07.17

es6新特性有哪些
es6新特性有哪些

es6的新特性有:1、块级作用域;2、箭头函数;3、解构赋值;4、默认参数;5、扩展运算符;6、模板字符串;7、类和模块;8、迭代器和生成器;9、Promise对象;10、模块化导入和导出等等。本专题为大家提供es6新特性的相关的文章、下载、课程内容,供大家免费下载体验。

406

2023.08.04

JavaScript ES6新特性
JavaScript ES6新特性

ES6是JavaScript的根本性升级,引入let/const实现块级作用域、箭头函数解决this绑定问题、解构赋值与模板字符串简化数据处理、对象简写与模块化提升代码可读性与组织性。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

395

2025.12.24

c语言const用法
c语言const用法

const是关键字,可以用于声明常量、函数参数中的const修饰符、const修饰函数返回值、const修饰指针。详细介绍:1、声明常量,const关键字可用于声明常量,常量的值在程序运行期间不可修改,常量可以是基本数据类型,如整数、浮点数、字符等,也可是自定义的数据类型;2、函数参数中的const修饰符,const关键字可用于函数的参数中,表示该参数在函数内部不可修改等等。

2358

2023.09.20

go语言闭包相关教程大全
go语言闭包相关教程大全

本专题整合了go语言闭包相关数据,阅读专题下面的文章了解更多相关内容。

4853

2025.07.29

console接口是干嘛的
console接口是干嘛的

console接口是一种用于在计算机命令行或浏览器开发工具中输出信息的工具,提供了一种简单的方式来记录和查看应用程序的输出结果和调试信息。本专题为大家提供console接口相关的各种文章、以及下载和课程。

916

2023.08.08

console.log是什么
console.log是什么

console.log 是 javascript 函数,用于在浏览器控制台中输出信息,便于调试和故障排除。想了解更多console.log的相关内容,可以阅读本专题下面的文章。

6783

2024.05.29

function是什么
function是什么

function是函数的意思,是一段具有特定功能的可重复使用的代码块,是程序的基本组成单元之一,可以接受输入参数,执行特定的操作,并返回结果。本专题为大家提供function是什么的相关的文章、下载、课程内容,供大家免费下载体验。

3460

2023.08.04

Docker Desktop怎么设置端口映射
Docker Desktop怎么设置端口映射

本专题聚焦Docker Desktop容器端口映射与访问配置,整理从创建容器、设置端口绑定到验证本地服务访问的操作流程。针对端口被占用、映射配置错误、容器服务无法访问等情况,也提供相应的检查方向,方便用户完成端口配置。

0

2026.11.03

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
WebStorm 官方调试文档
WebStorm 官方调试文档

共0课时 | 0人学习

React 教程
React 教程

共58课时 | 12.4万人学习

TypeScript 教程
TypeScript 教程

共19课时 | 6.8万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn