美文网首页JavaScript小结
JavaScript中有趣的现象

JavaScript中有趣的现象

作者: 别过经年 | 来源:发表于2020-04-02 16:22 被阅读0次

    1. 关于循环中的闭包问题

    缘起:
    MDN中的闭包章节

    function showHelp(help) {
      document.getElementById('help').innerHTML = help;
    }
    
    function setupHelp() {
      var helpText = [
          {'id': 'email', 'help': 'Your e-mail address'},
          {'id': 'name', 'help': 'Your full name'},
          {'id': 'age', 'help': 'Your age (you must be over 16)'}
        ];
    
      for (var i = 0; i < helpText.length; i++) {
        let item = helpText[i];
        document.getElementById(item.id).onfocus = function() {
          showHelp(item.help);
        }
      }
    }
    
    setupHelp();
    

    自己做了变形:

    function show() {
      for (let i = 0; i < 5; i++) {
        var j = i;
        setTimeout(() => console.log(j), 0); //4 4 4 4 4
      }
    }
    
    show();
    
    function next() {
      for (var i = 0; i < 5; i++) {
        let j = i;
        setTimeout(() => console.log(j), 0); //0 1 2 3 4
      }
    }
    
    next();
    

    next 可以正常输出,show无法正常输出
    之前的理解是,let i 后,循环体就是个独立的块级作用域,从这个结果反推,es6任然没有块级作用域,let 声明只是针对i,循环体内部的var j 还是属于函数作用域。也就是说let const 将变量绑定在了所在的块,而不是let const 创造了块级作用域。

    相关文章

      网友评论

        本文标题:JavaScript中有趣的现象

        本文链接:https://www.haomeiwen.com/subject/urwxphtx.html