3道js面试题引发的脑洞

后台小伙伴面试的时候紧急微信向我求助3道面试题，本着助人为乐+根正苗红的前端开发出身，这重任必须接下！

力能扛鼎

二话不说，先上这3道题目，：

一、普通函数の this指向

var a = 'one';
function func() {
    this.a = 'two'
}
func()
    console.log(a);

这个简单，显然考的是this指向问题
当一个函数并非一个对象的属性时候(就是我们正常的函数使用，不是new的构造函数)，那么就会当作函数来调用，此时，this被绑定为全局对象，浏览器环境下就是window对象
所以this.a显然就是修改了全局里var出来的那个a
输出结果：two
难不倒我社会人

二、构造函数this指向2

    var a = 'one';
    function func() {
        this.a = 'two';
    }
    var o = new func();
    console.log(a);

也是考的this指向四大方式之一 — 构造函数模式
如果在一个函数前面那加上new关键字来调用，那么其实就是会自动创建一个链接到该函数的原型prototype成员的新对象，所以此时this绑定的是这个新对象，不再是全局。
意思就是：你构造函数想new折腾到天亮，都不管我window的事情，该是我的，还不是乖乖到console碗里来~
输出结果：one

稳住！我们能赢

三、

 var funcs = [];
    for(var i = 0; i<3;i++) {
        funcs[i] = function () {   
              console.log(i);  
        }
    }
    for(var j = 0;j<3;j++) {
        funcs[j]()
    }

嘘，这题目有点意思

是时候该展现真正的技术了：搬出我的男神和大佬

越厉害的人，越谦逊和善和耐心，点名表扬~~~

1.0 进阶的我内心是这么挣扎的

小小佬的我

尚不知名但即将崛起的小佬–正是在下

2.0 男神是这么讲解的：

首先男神肯定我的理解，okey的(开心到飞起~)
其次，JavaScript的特性是变量跟着闭包，不是跟着{}(这就是在其他语言中常被称为的块)，所以使用let可以模拟块级作用域
除此之外，有其他方法可以解决假如你想输出012的方法：

面对男神的我
距离男神还有XXXXXXXXXX公里

//先写一个函数
function focusGenerator(i) {
    return function() {
        console.log(i)
    }
}

var focues = [];
for (var i = 0; i < 3; i++) {
    focues[i] = focusGenerator(i); //i作为了形参，跟着for循环走
}
//其实就是下面这三个，
//focues[0] = focusGenerator(0);
//focues[1] = focusGenerator(1);
//focues[2] = focusGenerator(2);

for (let i = 0; i < 3; i++) {
    focues[i]()
}  
//输出0 1 2 



//或者用下面的，两者效果一样的
var focues = [];
for (var i = 0; i < 3; i++) {
    focues[i] = focusGenerator(i);
}
for (let i = 0; i < 3; i++) {
    focues[i]()
}
//输出0 1 2 

//其实上面四个for循环里 var let随便换，大概是2x2x2x2=16种排列组合，反正结果都是012

3.0 大佬是这么讲解滴：

var focues = [];
//划重点：----
for (var i = 0; i < 3; i++) { //这里设置了全局的i
    focues[i] = function () {
        console.log(i) //在这里用的也是全局的i

    }
}
for (let i = 0; i < 3; i++) {
    focues[i]()
}

考察js的运行顺序，
for循环你可以理解为瞬间执行完 ；所以后面事件触发的时候，i已经是3了
对于js来讲， for (var i = 0; i < 3; i++)….这是一个代码块；let可以做到让i变成这个作用域中独享，即将这个var换成let,此时输出的就会是0 1 2了

距离大佬还有XXXXXXXXXXXXX行代码
大佬还亲自指点示范：
- 打个比方现在有三个蛋挞皮你要给里面塞蛋挞想的是来一个塞一个但是三个是同时来的结果你只能给第三个里面塞
本来想亲自操刀，画个蛋挞啥的：

科技抽象的蛋挞原型