首页 > web前端 > js教程 > 正文

JavaScript 函数:函数声明与函数表达式的异同

狼影
发布: 2025-11-01 17:58:01
原创
971人浏览过
函数声明会被完整提升,可在声明前调用;函数表达式仅变量名提升,值为undefined。1. 函数声明语法为function name(){},必须有名字;函数表达式将函数赋值给变量,可匿名或具名。2. 函数声明提升整个函数,允许提前调用;函数表达式中let/const声明的变量存在暂时性死区,var声明会报错TypeError。3. 函数表达式更灵活,适用于回调、IIFE、对象方法等场景。4. 理解差异有助于避免执行顺序错误和模块设计问题。

javascript 函数:函数声明与函数表达式的异同

在 JavaScript 中,函数是头等公民,可以通过多种方式创建。最常见的两种方式是函数声明函数表达式。虽然它们都能定义函数,但在语法、提升(hoisting)行为以及使用场景上存在关键差异。

语法形式不同

函数声明以 function 关键字开头,后跟函数名:

function greet() {
  console.log("Hello!");
}

函数表达式是将一个函数赋值给变量,函数可以有名字,也可以是匿名的:

const greet = function() {
  console.log("Hello!");
};

// 或者带名字的函数表达式
const greet = function hello() {
  console.log("Hello!");
};

函数表达式的函数名只能在函数内部访问,主要用于调试或递归调用。

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

变量提升行为不同

这是两者最显著的区别

函数声明会被完整地提升到其作用域顶部。这意味着你可以在声明之前调用它:

greet(); // 输出: Hello!
function greet() {
  console.log("Hello!");
}

函数表达式不会被提升函数体,只有变量名被提升(如果是 var 声明),但值为 undefined:

怪兽AI数字人
怪兽AI数字人

数字人短视频创作,数字人直播,实时驱动数字人

怪兽AI数字人44
查看详情 怪兽AI数字人
sayHi(); // 报错:Cannot access 'sayHi' before initialization
const sayHi = function() {
  console.log("Hi!");
};

使用 var 时情况略有不同:

sayHi(); // 报错:TypeError: sayHi is not a function
var sayHi = function() {
  console.log("Hi!");
};

因为 var 被提升,但值是 undefined,调用 undefined 会报错。

适用场景与灵活性

函数声明适合定义需要在整个作用域中可用的工具函数或逻辑主干函数。由于可被提前调用,代码组织更自由。

函数表达式更灵活,常用于:

  • 作为回调函数传递(如 setTimeout、addEventListener)
  • 立即执行函数表达式(IIFE)
  • 对象方法或模块导出
  • 箭头函数替代(现代常用)

例如:

setTimeout(function() {
  console.log("延迟执行");
}, 1000);

总结关键点

  • 函数声明会被完全提升,可在声明前调用;函数表达式不会
  • 函数声明必须有名字,函数表达式可以匿名或具名
  • 函数表达式更适合作为“值”来操作,比如赋值、传参、返回
  • 在块级作用域中,两者的提升和暂时性死区行为受 let/const 影响

基本上就这些。理解它们的异同有助于避免运行时错误,尤其是在处理执行顺序和模块设计时。不复杂但容易忽略。

以上就是JavaScript 函数:函数声明与函数表达式的异同的详细内容,更多请关注php中文网其它相关文章!

最佳 Windows 性能的顶级免费优化软件
最佳 Windows 性能的顶级免费优化软件

每个人都需要一台速度更快、更稳定的 PC。随着时间的推移,垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是,许多工具可以让 Windows 保持平稳运行。

下载
来源:php中文网
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新问题
开源免费商场系统广告
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

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