0

0

JavaScript中函数声明与函数表达式的定义区别

舞夢輝影

舞夢輝影

发布时间:2026-03-17 20:36:22

|

139人浏览过

|

来源于php中文网

原创

函数声明和函数表达式最核心区别在于提升行为与语法位置约束:前者全量提升且只能出现在顶层或函数体,后者仅变量名提升、可置于任意表达式位置,并支持命名但名称仅内部有效。

javascript中函数声明与函数表达式的定义区别

函数声明和函数表达式在 JavaScript 中最核心的区别在于提升(hoisting)行为语法位置约束,这直接影响它们的可调用时机和作用域使用方式。

提升机制不同:函数声明会被完全提升,函数表达式只提升变量名

JavaScript 引擎在执行前会进行“提升”处理。对于函数声明,整个函数定义会被提升到当前作用域顶部;而函数表达式只是将 var 声明的变量名 提升,赋值(即函数体)仍保留在原位置。

例如:

foo(); // ✅ 正常运行,输出 "hello"
function foo() { console.log("hello"); }
<p>bar(); // ❌ 报错:TypeError: bar is not a function
var bar = function() { console.log("world"); };</p>

这是因为第二段代码实际等价于:

立即学习Java免费学习笔记(深入)”;

var bar;        // 变量声明被提升
bar();          // 此时 bar 是 undefined,调用失败
bar = function() { console.log("world"); }; // 赋值发生在后面

语法位置限制不同:函数声明只能出现在程序顶层或函数体内,不能在条件语句中

函数声明是一种独立的语句,不允许直接写在 if、for、try 等块级结构内部(尽管某些引擎允许,但属于非标准行为,且各浏览器表现不一致)。

函数表达式则没有此限制,它可以作为值出现在任何允许表达式的地方:

  • 赋值给变量或对象属性
  • 作为参数传入另一个函数
  • 立即执行(IIFE)
  • 放在 if 分支里动态创建

例如合法的函数表达式用法:

ARTi.PiCS
ARTi.PiCS

ARTi.PiCS是一款由AI驱动的虚拟头像生产器,可以生成200多个不同风格的酷炫虚拟头像

下载
if (condition) {
  var fn = function() { return "yes"; };
} else {
  var fn = function() { return "no"; };
}
<p>[1, 2, 3].map(function(x) { return x * 2; });</p><p>(function() { console.log("IIFE"); })();</p>

名称行为差异:函数表达式可选命名,但名字仅在内部可用

函数声明必须有名字,且该名字在所在作用域中绑定为函数引用。

函数表达式可以是匿名的(如 var f = function() {}),也可以带名字(如 var f = function named() {})。这个“named”只在函数内部用于递归或调试,在外部不可访问:

var f = function named() {
  console.log(named); // ✅ 可以访问自身名字
};
console.log(named); // ❌ ReferenceError: named is not defined
console.log(f.name); // ✅ 输出 "named"(现代环境)

严格模式下的额外注意点

在严格模式中,函数声明在块内(如 if 中)会产生语法错误,进一步强调应避免依赖非标准的块级函数声明。而函数表达式天然兼容严格模式,是更安全、更可预测的选择。

现代开发中,推荐优先使用函数表达式(尤其是箭头函数和 const 声明),或使用 ES6 的 const myFn = () => {} 形式,逻辑清晰、无提升陷阱、便于静态分析。

热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

WorkBuddy
WorkBuddy

腾讯云推出的AI原生桌面智能体工作台

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
es6新特性
es6新特性

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

106

2023.07.17

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

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

197

2023.08.04

JavaScript ES6新特性
JavaScript ES6新特性

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

234

2025.12.24

if什么意思
if什么意思

if的意思是“如果”的条件。它是一个用于引导条件语句的关键词,用于根据特定条件的真假情况来执行不同的代码块。本专题提供if什么意思的相关文章,供大家免费阅读。

848

2023.08.22

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

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

565

2023.09.20

function是什么
function是什么

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

500

2023.08.04

js函数function用法
js函数function用法

js函数function用法有:1、声明函数;2、调用函数;3、函数参数;4、函数返回值;5、匿名函数;6、函数作为参数;7、函数作用域;8、递归函数。本专题提供js函数function用法的相关文章内容,大家可以免费阅读。

167

2023.10.07

抖漫入口地址合集
抖漫入口地址合集

本专题整合了抖漫入口地址相关合集,阅读专题下面的文章了解更多详细地址。

109

2026.03.17

多环境下的 Nginx 安装、结构与运维实战
多环境下的 Nginx 安装、结构与运维实战

本专题聚焦多环境下Nginx实战,详解开发、测试及生产环境的差异化安装策略与目录结构规划。深入剖析配置模块化设计、灰度发布流程及跨环境同步机制。结合监控告警、故障排查与自动化运维工具,提供全链路管理方案,助力团队构建灵活、高可用的Nginx服务体系,从容应对复杂业务场景挑战。

13

2026.03.17

热门下载

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

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
React 教程
React 教程

共58课时 | 6.2万人学习

TypeScript 教程
TypeScript 教程

共19课时 | 3.5万人学习

Bootstrap 5教程
Bootstrap 5教程

共46课时 | 3.7万人学习

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

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号