乐趣区

一次性理清JavaScript变量等高难度面试问题

主要是解决 JavaScript 中比较难懂的部分,当然了,这部分经常在面试题中露面,这篇文章主要是讲解解题思路,对新手会有很大帮助(如果你仔细看的话)。书籍方面,我看的是《你不知道的 javascript》, 精髓就在里面喽。文章会持续更新(如果能看到比较刁钻的题目的话,也欢迎大家将自己遇到的异常难于理解的 JavaScript 题目分享出来喔)
第 0 种 解析顺序
function a() {
b = function () {
console.log(1)
}

return this;
}

var b = function () {
console.log(2)
}

function b() {
console.log(3)
}

b();

a().b();

b();
1. 首先,你要明白的是 3 永远不可能打印出来。这涉及到函数的声明方式和执行顺序问题。直接用 function 的方式声明的函数,函数可以在 function 声明之前被调用,这说明在代码运行之前就已经调用了。再次声明的函数 var b 会替代原有的函数 b
2. 第二点:第一个函数中的 this 指向。一个点:函数中的 this 是在运行时候决定的,而不是函数定义时,具体就看谁调用了 this. 在第一个函数中,没有调用对象,在浏览器中,this 就指向 window
3. 第三点:还是第一个函数中,不使用 var 标识符直接定义的变量都属于全局变量, 也就是说第一个函数中的 b 是挂载到 window 上的。
第 1 种 变量提升
(function(){
a = 5;
alert(window.a);
var a = 10;
alert(a);
})();

喜闻乐见!看见一堆的变量 a 就知道了,这是变量提升的问题了,只需要自己模拟出执行顺序就行了.
等同于:
var a; // 第一步:变量提升
a = 5; // 后面的就直接拿上来
alert(window.a);
a = 10;
alert(a);
同类型题目:
var a=1;
function test(){
console.log(a);
var a=1;
}
test();
看见 var 就把它提升到最前面就行了,一样画瓢解决:
var a;
a = 1;

function test() {
var a;
console.log(a);
a = 1;
}

还有同类型的题目一样可以依葫芦画瓢解决:
var foo = ‘hello’;
(function (foo) {
console.log(foo);
var foo = foo || ‘world’;
console.log(foo);
})(foo);
console.log(foo);
等。
解决这些问题的关键是:不要想当然,动手一步一步模拟执行顺序,模拟变量提升情况
第二种 面向对象问题或高阶函数(等待更新)

退出移动版