//先从一个面试题提及 console.log(a) if (a) { var a = 1; console.log(a) } function a() { console.log(this); } console.log(a); a()
下面咱们针对这个栗子解析一下面试
咱们知道变量和很熟定义都会提高到做用域最前边浏览器
惟一须要确认的是变量和函数的前后顺序函数
咱们预想 函数是用第一公民会不会提高到最前边呢?测试
//若是是解析完顺序是这样的 function a() { console.log(this); } var a; console.log(a) if (a) { a = 1; console.log(a) } console.log(a); a()
按照咱们预想的解析结果应该是this
// undefined
// undefined
// 报错spa
理由 函数在上var在下,第一个console时a未赋值,其结果是undefined,if为false 只剩最后一个console也是undefined 最后a is not a function.3d
不过结果是code
我机智的认为 预想错了?blog
//再次测试 var a; function a() { console.log(this); } console.log(a) if (a) { a = 1; console.log(a) } console.log(a); a()
这样?对比一下结果
人工解析结果 :
一、a()
二、1
三、1
四、a() 报错作用域
浏览器执行结果:
没毛病!
看到这里一切完美,不过我仍是从新搜索了一些高质量文章,发现我错了,虽然执行结果是对的,不过浏览器和人工解析仍是不同的,和咱们最开始预想的同样,函数优先。
既然标题说到了 变量 和 函数,咱们就一块来讲说
//简单的栗子 function a(){ console.log(a) } console.log(a) var a = 1 a()
首先上边已经说到咱们预想和认为的是错的。
正确解析顺序是这样的
function a(){ console.log(a) } var a; console.log(a) a = 1 a()
可是,这个可是很重要浏览器执行结果是:
why?这就要讲讲我所了解到的原理。
function a(){ console.log(a) } var a;//忽略 console.log(a) //打印函数自己 a = 1 a()// a is not a function
完美!
还有呢?是的还有同名变量是怎样的顺序,同名函数是怎样的顺序。
console.log(a) var a = 1 console.log(a) var a = 2 console.log(a) //解析完顺序是这样的 var a; var a; //忽略 console.log(a) // undfined a = 1 console.log(a) //1 a = 2 console.log(a)//2
*同名变量,声明会被提高,后边会忽略。
function a(){console.log(1)} console.log(a) function a(){console.log(2)} console.log(a) a() //解析完 function a(){console.log(1)} function a(){console.log(2)} console.log(a) console.log(a) a()
执行结果
我想你已经猜到了,同名函数会被覆盖。
终于完了!
您的点赞是我继续下去的动力,谢谢!