美文网首页
JS作用域

JS作用域

作者: WantACocktail | 来源:发表于2018-03-09 17:58 被阅读3次

一.前言

都知道JS存在三种作用域,即全局,函数,块级。其实是没有块级作用域的,但我们可以通过闭包来实现它。

二.函数作用域

很好理解,在函数内部声明的变量在函数调用后会销毁

三.块级作用域

在if,while,for等代码体用{}包括的,成为块级作用域,但是在JS中没这说法。
比如

  <script>
      for(var i=0;i<10;i++)
      {
          console.log(i);
      }
      alert(i)   //    9
  </script>

问题出来了,按理说正常情况是控制台输出0~9,弹出undefined,但是alert出来的却是9,

那这足以说明咱们的JS是不存在块级作用域的,块里面的变量是被挂载在window上的。

那么这会引发一个问题,看下面代码:

  var arrs=[];
  <script>
      for(var i=0;i<10;i++)
      {
          arrs[i]=function(){
               console.log(i);
          }
      }
      arrs[0]   //   9
      arrs[1]   //   9
      ..........
  </script>

这里你不管执行 第几个函数都是打印9,原因有两个,第一因为JS中不存在块级作用域,i的声明是挂载在window上的,再一个,函数在执行的时候获取到的i为循环最后一次+1的i,所以恒定为9。
解决办法:利用闭包虚构一个块级作用域,并将i的值传入。

注意事项:
1.函数的传参是传入的复制值
2.闭包其实就是能获取到函数内部变量的函数
3.闭包的两个主要作用:
i.获取函数内部的变量
ii.使函数内部的变量不被回收

 var arrs=[];
  <script>
      for(var i=0;i<10;i++)
      {
         (function(i){
             arrs[i]=function(){
                  console.log(i);
             }
         })(i)  //将循环的i的值传入
      }
      arrs[0]   //   0
      arrs[1]   //   1
      ..........
  </script>

此时当函数执行的时候会拿到这个立即执行函数的i的值,而立即执行函数的值是for循环传入的,所以就能正常输出0~9。

相关文章

  • 变量作用域

    变量作用域:静态作用域、动态作用域JS变量作用域:JS使用静态作用域JS没有块级作用域(全局作用域、函数作用域等)...

  • JS作用域的练习

    Js作用域练习demo1 Js作用域练习demo2 JS作用域练习demo3 JS作用域练习demo4 JS作用域...

  • 你不知道的JS-上卷

    作用域整体理解:JS作用域分为函数作用域,全局作用域,with和try catch形成的块级作用域。 JS引擎在编...

  • js 闭包

    一、js 作用域 讲闭包首先就要理解 js 的作用域。再 ES5 中,js 有两种作用域,全局作用域和函数作用域(...

  • 2019-08-13JS里面的作用域Scope

    作用域指一个变量的作用范围。 JS的作用域 在JS中,有两种作用域 全局作用域直接编写在script标签中 JS代...

  • 干货!月薪80k前端大佬面试笔记:JS闭包解析!

    三点注意事项 JS没有块级作用域,只有全局作用域和局部作用域(函数作用域)。 JS中的作用域链,内部的作用域可以访...

  • JavaScript作用域的理解

    作用域:就是起作用的区域。JS的作用域规定了变量和函数可访问的范围。JS作用域分为:全局作用域和局部作用域 全局作...

  • JS 作用域链、导入导出

    1. JS 的作用域链 作用域在 JS 中表示变量的可访问性和可见性。JS 作用域有 3 种:1. 全局作用域;2...

  • JS的作用域

    JS的作用域: 全局作用域、函数作用域、eval 作用域、块级作用域 全局作用域: 函数作用域: 结果截屏: 说...

  • ES5中JS的作用域和变量提升(hoisting)

    ES5 中JS 的作用域: 在ES5 中,JS 只有两种形式的作用域:全局作用域和函数作用域。 全局作用域全局对象...

网友评论

      本文标题:JS作用域

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