JavaScript中函数声明与同名变量优先级问题及书籍推荐

核心结论：函数提升优先级高于var变量声明，但赋值操作在执行阶段生效 #

你遇到的问题本质是JS的变量提升与函数提升机制导致的，拆解你的测试代码执行过程：

1. 编译（解析）阶段：
   • 浏览器先处理所有函数声明：创建sayHello变量，并将其指向对应的函数对象。
   • 接着处理var声明：发现已经存在同名的sayHello变量，所以直接跳过这个声明（var允许重复声明但不会覆盖已有变量）。
2. 执行阶段：
   • 执行var sayHello = 2;：这一步是赋值操作，把sayHello的引用从函数改成了数值2。
   • 最后调用sayHello()时，sayHello已经是数值类型，自然会抛出"不是函数"的错误。

简单说：函数声明的提升会先占住变量名，但后续的变量赋值会在执行阶段覆盖掉函数引用。

推荐书籍 #

• 《JavaScript高级程序设计》（常称"红宝书"）：全面覆盖JS核心机制，对执行上下文、变量提升、作用域链等底层概念讲解得细致易懂，是前端开发者的必读书籍。
• 《你不知道的JavaScript（上卷）》：专门深挖JS中容易被忽略的核心原理，针对提升、作用域、闭包这类问题有非常深入的剖析，能帮你彻底搞懂这类底层问题。

内容的提问来源于stack exchange，提问作者Rtyn