关于全局变量问题请求解答

Question

最开始申明的index=0属于全局变量，后续给左右按钮绑定点击事件的时候，index=index+1，这个时候得到的index是全局变量所以会覆盖前面申明的index值，因为没有加var所以是全局变量。但是如果在绑定函数里面改成var index=index+1的话，这个时候index就是局部变量了，无法覆盖前面申明的index值了。这样理解对吗ar container = document.getElementById('container');var list = document.getElementById('list');var buttons = document.getElementById('buttons').getElementsByTagName('span');var prev = document.getElementById('prev');var next = document.getElementById('next');var index = 1;...next.onclick = function(){if(index == 5){index = 1;}else {index += 1;}showButton();animate(-600);}

Answer 1

好像没什么不对。不过我这里还是再解释得清楚点吧。

在ES6之前，JS只有全局作用域和函数作用域，也就是所谓的scope，JS在访问你代码中的变量或函数时就是沿着作用域链查找的，如果你了解了JS的原型链的概念的话，作用域链应该也不难想象，

// 这里是全局作用域
var index = 1;

function local() {
    // 这里是函数的作用域
    var index = 2;
    // 在这个函数作用域中有一个index变量，所以执行此函数时这里直接打印2
    console.log(index);
}

function foo() {
    // 在这里引擎同样还是会在foo的函数中先查找index，很明显函数中没有index变量
    // 于是向上层作用域查找找到全局的index,打印1
    console.log(index); 
}

function closure() {
    // 这里就是JS中常被提起的闭包
    var index = 3;
    function fn() {
        // 根据前两个例子，可以知道fn中没有index
        // 那引擎往上查询closure的作用域中是否有index，所以这里打印3，
        // 如果把上面的那句index注释掉则继续往上查找全局作用域，则打印1
        console.log(index);
    }
    fn();
}

local();
foo();
closure();

在代码中我都是初始化一个新的作用域内的变量，这只是为了阐述清楚作用域这个概念，理解了作用域，那么var不过是区分到底是声明一个新变量还是重新赋值变量的值而已【ps:在同一作用域内重复声明等于赋值】，如果是赋值，那么赋值的变量就是作用域链上最先找到的变量，仅此而已。