在写javascript代码的时候,经常会碰到一些奇怪的问题,例如:
console.log(typeof hello); var hello = 123;//变量 function hello(){//函数声明 } console.log(typeof hello); var hello = function(){//函数表达式 } console.log(typeof hello);//function number function
对于为什么会是这样的一个结果:function number function 很多人可能会抱着一种疑问的态度,为什么不是 undefined function function ?
在上面的代码中其实就涉及到了变量提升与函数提升这个概念,在javascript引擎中,对于javascript代码的解析并不是从上往下,逐行进行解析的,而是以代码块进行解析:
在相同作用域下,首先是将声明函数提升到代码的最顶端,其次就是变量提升,最后就是函数表达式,上述代码在javascript引擎中的解析就是可以看成如下:
function hello(){//函数声明 }console.log(typeof hello);//function var hello;hello = 123;console.log(typeof hello);//numbervar hello;hello = function(){}console.log(typeof hello);//function //function number function
var hello = 123;的解析是先对变量hello进行定义,var hello;然后再给变量赋值,这里的var hello 就是对变量的一个提升。如:
console.log(typeof hello);//undefinedvar hello = 123;console.log(typeof hello);//number //这里的变量hello被声明到作用域的顶端
常见的例子还有:
var hello = 123;function test(){ console.log(hello);//undefined var hello = ‘haha‘; console.log(hello);//haha}test();console.log(hello);//123//undefined haha 123
在test函数的作用域下,由于hello 变量被提升,所以第一个console.log(hello);打印的就是undefined,第二个console.log(hello);打印的就是haha
最终结果就是 undefined haha 123
时间: 2024-10-03 13:45:58