手撸代码面试题1-局部作用域与全局作用域

var let const
//解释： 
// var
// 1. 允许重复的变量声明，会导致数据被覆盖
// 2. 变量提升
// 3. 全局对象污染问题

// let 
// let在全局作用域下定义变量不会挂在window上
// let声明的变量，不允许当前作用域内重复声明，在块级作用域中用let定义的变量，在作用域外不能访问
// let不会有变量提升，所以不能在定义let变量之前使用它 会报错

// const
// const 和let特性相同，唯一不同的是，const一般指的都是常量，常量的定义是不可改变的变量，所以用const的变量是不可变的

//  建议：  使用let const 代替 var  你能用const  不用let  能用let  不用var

//一、执行结果   并解释原因

var a = [];
for(var i = 0;i<10;i++){
    a[i] = function(){
        console.log(i)
    }
}
a[6]();  

// 输出：10
//解释：  主要考察局部作用域的问题   使用var定义的变量i是全局作用域   for循环循环10次 很快就会执行完 且每次都会输出10   
// 举一反三： let 实现
var a = [];
for(let i = 0;i<10;i++){
    a[i] = function(){
        console.log(i)
    }
}
a[6]();  
// 输出：6
//解释：  使用let关键字来定义变量i  它属于局部作用域（类似于闭包所实现）所以会输出6

// 举一反三： 闭包 实现
var a = [];
for(var i = 0;i<10;i++){
    (function(i){
        a[i] = function(){
            console.log(i)
        }
    })(i)
}
a[6]();  
// 输出：6
//解释：  使用闭包来实现  也是有一个局部作用域的概念（类似于let）所以依然会输出6

说明 var let const
var  a = 10;
var obj = {
    a:20,
    fn(){
        setTimeout(()=>{
            console.log(this.a)
        })
    }
}
obj.fn()
//输出 20
//解释： 考察箭头函数的特性 箭头函数的this永远指向其父作用域 他的父级指向obj 所以输出20
// 举一反三：
var  a = 10;
var obj = {
    a:20,
    fn(){
        setTimeout(function(){
            console.log(this.a)
        })
    }
}
obj.fn()
//输出 10   
//解释： setTimeout中的this 指向window  所以输出10
var  a = 10;
var obj = {
    a:20,
    fn(){
        let self =  this;
        setTimeout(function(){
            console.log(self.a)
        })
    }
}
obj.fn()
//输出 20
//解释： 同样实现箭头函数一样的功能  提前保存下this的值  使用self代替setTimeout中的this