JS---作用域和作用域链

作用域就是变量与函数的可访问范围,即作用域控制着变量与函数的可见性和生命周期。在JavaScript中,变量的作用域有全局作用域和局部作用域两种。

  1. //常犯的一个错误
  2.  
  3. <button id="button1">Button1</button>
  4. <button id="button2">Button2</button>
  5. <button id="button3">Button3</button>
  6.  
  7. <script type="text/javascript">
  8. function buttonInit(){
  9. for(var i=1;i<4;i++){
  10. var b=document.getElementById("button"+i);
  11. b.addEventListener("click",function(){ alert("Button"+i);},false);
  12. }
  13. }
  14. window.onload=buttonInit;
  15. </script>
  16.  
  17. //结果都是 button3!!
  18. //这是因为,for等没有块级作用域的概念,就算是 函数,也不算是块级作用域,只能叫做为函数作用域。var i =1,相当于在函数buttonInit()里的全局变量,每次的循环,都会改变这个变量。所以i最终的结果都是3!!
  19.  
  20. //如何修改呢
  21. function buttonInit(){
  22. for(var i=1;i<4;i++){
  23. var b = document.getElementById("button" + i);
  24. (function (a)
  25. {
  26. b.addEventListener("click", function () { alert("Button" + a); }, false);
  27. })(i);
  28. //采用自调用函数
  29. }
  30. }

JS---作用域和作用域链的更多相关文章

  1. 了解 JS 作用域与作用域链

    (1)作用域 一个变量的作用域(scope)是程序源代码中定义的这个变量的区域. 1. 在JS中使用的是词法作用域(lexical scope) 不在任何函数内声明的变量(函数内省略var的也算全局) ...

  2. JS的作用域和作用域链

    每个函数都有自己的作用域,当执行流进入一个函数时,函数就会被推入栈中,而在函数执行之后,栈将其执行环境弹出,把控制权放回给之前的作用域,全局作用域是最外围的一个作用域,因此,所有全局变量和函数都是作为 ...

  3. 第十八篇 js高级知识---作用域链

    一直有想法去写写js方面的东西,我个人是最喜欢js这门语言,喜欢的他的自由和强大,虽然作为脚本语言有很多限制的地方,但也不失为一个好的语言,尤其是在H5出现之后.下面开始说说js的方面的东西,由于自己 ...

  4. js学习--变量作用域和作用域链

    作为一名菜鸟的我,每天学点的感觉还是不错的.今天学习闭包的过程中看到作用域与作用域链这两个概念,我觉得作为一名有追求的小白,有必要详细了解下. 变量的作用域 就js变量而言,有全局变量和局部变量.这里 ...

  5. js 作用域,作用域链,闭包

    什么是作用域? 作用域是一种规则,在代码编译阶段就确定了,规定了变量与函数的可被访问的范围.全局变量拥有全局作用域,局部变量则拥有局部作用域. js是一种没有块级作用域的语言(包括if.for等语句的 ...

  6. Js 作用域与作用域链与执行上下文不得不说的故事 ⁄(⁄ ⁄•⁄ω⁄•⁄ ⁄)⁄

    最近在研究Js,发现自己对作用域,作用域链,活动对象这几个概念,理解得不是很清楚,所以拜读了@田小计划大神的博客与其他文章,受益匪浅,写这篇随笔算是自己的读书笔记吧~. 作用域 首先明确一个概念,js ...

  7. 理解js中的作用域,作用域链以及闭包

    作用域变量作用域的类型:全局变量和局部变量全局作用域对于最外层函数定义的变量拥有全局作用域,即对任何内部函数来说,都是可以访问的 <script> var outerVar = " ...

  8. js对象系列【二】深入理解js函数,详解作用域与作用域链。

    这次说一下对象具体的一个实例:函数,以及其对应的作用域与作用域链.简单的东西大家查下API就行了,这里我更多的是分享自己的理解与技巧.对于作用域和作用域链,相信绝大多数朋友看了我的分享都能基本理解,少 ...

  9. js基础梳理-如何理解作用域和作用域链?

    本文重点是要梳理执行上下文的生命周期中的建立作用域链,在此之前,先回顾下关于作用域的一些知识. 1.什么是作用域(scope)? 在<JavaScritp高级程序设计>中并没有找到确切的关 ...

  10. JS作用域,作用域,作用链详解

    前言   通过本文,你大概明白作用域,作用域链是什么,毕竟这也算JS中的基本概念. 一.作用域(scope) 什么是作用域,你可以理解为你所声明变量的可用范围,我在某个范围内申明了一个变量,且这个变量 ...

随机推荐

  1. 论文阅读: Siam FC

    一.研究动机 一方面传统算法设计的跟踪模型过于简单,另一方面深度学习方法很难达到实时效果然而现实场景中的应用对速度要求较高. "shallow method"(HCFT)没有很好地 ...

  2. VC++调试错误的解决方案

    这篇文章主要用来记录使用Visual Studio过程中,出现的各种error,并提供自己当时解决的方案.但是,一个error可能由不用原因引起的,文中案例仅供大家参考. nafxcwd.lib(th ...

  3. sublime Text 常用插件

    1.LocalizedMenu 语言插件 2.SublimeRPEL   这个我主要是用python,设置快捷键后很方便 3.以后用到什么再补充

  4. psycopg2+postgis+pgAdmin4

    基于docker的postgres 部署见这篇 https://www.cnblogs.com/xuanmanstein/p/7742647.html 连接数据库 import psycopg2cla ...

  5. python内置函数详细描述与实例演示

    python有许多内置函数,列出表格如下 内置函数 abs() delattr() hash() memoryview() set() all() dict() help() min() setatt ...

  6. mui预加载

    1.只能加载一个页面 mui.init(); var page = null; mui.plusReady(function() { //预加载页面mui.preload必须放在plusReady事件 ...

  7. ubuntu 安装nginx, 出现 Unable to locate package

    今天在初始化一台新的ubuntu 服务器时,敲上了 sudo apt-get install nginx 来安装nginx, 却发现提示:  Reading package lists... Done ...

  8. CF-551-D-树dp/思维

    http://codeforces.com/contest/1153/problem/D 给出一颗有根树,叶子节点可以从1开始赋值但不能相同,每个节点有一个属性max/min表示选择所有儿子值中的ma ...

  9. Jekyll博客添加Valine评论

    Jekyll博客添加Valine评论 关于github搭建jekyl博客,在这里不做过多描述,详情参考: 百度搜索关键字:github搭建jekyll博客 官网:https://www.jekyll. ...

  10. idea函数被调用

    打开一个复杂的程序或者项目进行分析的时候,我们就需要知道一个方法在哪里被调用,用于迅速厘清代码逻辑.操作如下:选中函数,右键,点击Find Usages. 如图: 操作简单,但右键还是没有快捷键方便. ...