JavaScript变量提升:能否引用下方声明的函数?
为什么函数表达式定义的
add在multiply下方,调用multiply却不报错? 嘿,这个问题戳中了JavaScript变量提升里一个很容易混淆的点,我来给你掰扯清楚~
首先你对变量提升的理解是对的:var声明的变量确实会被提升到当前作用域的顶部,但只有变量声明会被提升,变量的赋值(包括函数表达式的赋值)不会被提升。所以代码在执行前,作用域里确实会先有:
var multiply; // 值为 undefined var add; // 值为 undefined
但关键在于函数内部的代码只有在函数被调用的时候才会执行,我们一步步看代码的执行顺序:
- 先执行
multiply = function(num) { return add(num) * 2; };——此时multiply被赋值为一个函数,但这个函数里的add(num)并没有立刻执行,只是被定义了而已。 - 接着执行
add = function(num) { return num + 1; };——这时候add被赋值为一个有效的函数了。 - 最后调用
multiply(1),这时候才会进入multiply函数内部执行代码,去调用add(1),而此时add已经是一个可用的函数了,自然不会报错,最终结果是(1+1)*2 = 4。
要是把调用顺序换一下,比如把console.log(multiply(1))放在add赋值的前面:
var multiply = function(num) { return add(num) * 2; }; console.log(multiply(1)); // 这里会报错:add is not a function var add = function(num) { return num + 1; };
这时候调用multiply时,add还只是undefined,尝试调用undefined就会触发错误,这才是你一开始预期的情况~
总结一下:函数表达式的赋值不会被提升,但只要在函数被调用前完成了赋值,函数内部就能正常使用这个变量。
内容的提问来源于stack exchange,提问作者Hadoren
相关产品推荐
相关产品推荐

