首页 > 其他分享 >js作用域的理解

js作用域的理解

时间:2022-09-29 15:02:50浏览次数:52  
标签:function 未定义 fn1 作用域 alert 理解 var js 函数

一、变量作用域解析过程

​对于s​​​​cript脚本中的变量:自上而下 全局变量、全局函数​​​​对于函数中的变量:由里到外​

​浏览器解析变量过程:​

​“JS解析器”​

​1)“找一些东西”: var和function​

​      如果函数带参数,则参数 x = undefine 所有的变量,在正式运行代码之前,都提前赋了一个值:未定义​

​      fn1 = function fn1(){ alert(2); } 所有的函数,在正式运行代码之前,都是整个函数块​

​      JS 的预解析原则: 遇到重名的:只留一个;变量和函数重名了,就只留下函数​

2)逐行解读代码:表达式(​​= + - * / % ++ -- ! ​​)可以修改预解析的值! 注意:函数块不要放在if/else、for的{}里面执行;函数如果带参数,预编译 先找 参数的声明 并且把 实参赋值给形参,再执行找函数的操作

代码解析

1)预解析:查找var,function参数例如下面这个例子

    a= 未定义 

    fn1={alert(2)}函数的话,是整个整体

 2):逐行读代码:类似=+-%*等都是表达式,表达式可以改变值

example1:


<script>

alert(a) //最终结果:undefiner

var a=1

function fn1(){

alert(alert(2));

}

</script>


 

 

分析:

  预解析: a=未定义;fn1=function fn1(){alert(alert(2));}

  执行:

    alert(a)   ==》未定义

    var a=1

    function fn1(){

      alert(alert(2));

    }

example2:


alert(a)         //4

var a=1

alert(a) //1

function a(){alert(2)}

alert(a) //1

var a=3;

alert(a) //3

function a(){alert(4)}

alert(a) //3


 

 

分析:

  预解析: a=未定义;a=function a(){alert(2)} a=未定义;a=function a(){alert(4)}(查找var  function 参数,,重名时只会留下有值的,这里第一个是undefine,所以踢掉,若都有值,那么谁后执行就留下谁)

  执行:  

    alert(a)         ==>function a(){alert(4)}

    var a=1    ==>a=1

    alert(a)       ==>1

    function a(){alert(2)} ==>没有表达式,不改变值

    alert(a)      ==》1

    var a=3; ==》3

    alert(a)     ==》3

    function a(){alert(4)}==>没有表达式,不改变值

    alert(a)   ==》3

example3:


var a=1;

function fn1(){

alert(a);

var a=2

}

fn1();//undefine

alert(a)//a=1


 

 

预解析:

  1):查找var function 参数

    a=未定义

    fn1=function fn1(){

    alert(a);

    var a=2

  }

 

执行:

  var a=1;==》a=1

  function fn1(){`==》不改变值

  alert(a);

  var a=2

  }

  fn1();==》

    开始预编译: a=1,a=未定义;,

    开始执行:

      alert(a)==》未定义

       a=2        

  alert(a) ==>a=1,因为这是函数里面的变量,不能作用到函数外;

 

example4:


var a=1;

function fn1(){

alert(a);//1

a=2

}

fn1()

alert(a)//2


 

 

预解析:

  a=undefine

  fn1=function fn1(){

  alert(a)

  a=2}

执行:

  var a=1;==》1️⃣a=1

  function fn1(){    3️⃣预解析:无var,无function,所以没有了

    alert(a);    4️⃣执行 a=1

    a=2     5️⃣执行a=2

    }

    fn1()   2️⃣

    alert(a)    6️⃣a=2

example5:


var a=1

function fn1(a){

alert(a);

a=2;

}

fn1(a);//1

alert(a);//1


预解析: a=未定义 fn1=function fn1(a){....}

执行:  

  var a=1 ==》a=1

  function fn1(a){  预解析: 1.a=未定义(原因是有参数,这里相当于 var a=1)  2.赋值实参 a=1, 3.a=2

    alert(a);  ==>a=1

函数内部的a=2);//内部有的值,不改变外部a变量的值;

  }

    fn1(a);//1

    alert(a);//1

 注意:如果fn1函数中带有其他函数fn1x(){} 并且执行该函数的,那么过程就是 预解析: a=未定义 a = 1,然后再是 fn1x = fn1x(){。。。},再执行函数内部。。。


我从来不相信什么懒洋洋的自由。我向往的自由是通过勤奋和努力实现的更广阔的人生。 我要做一个自由又自律的人,靠势必实现的决心认真地活着。










标签:function,未定义,fn1,作用域,alert,理解,var,js,函数
From: https://blog.51cto.com/u_10632206/5722957

相关文章

  • js中小数取整的方法
    varnum=123.123常用方法console.log(parseInt(num));//123“双按位非”操作console.log(~~num);//123按位或console.log(num|0);//123按位异或console.log......
  • hive中使用hive原生的json报错的问题
    默认我们使用的hive自带的json包格式,创建表时格式为:CREATEEXTERNALTABLE`ods.ods_test`(...)ROWFORMATSERDE'org.apache.hive.hcatalog.data.JsonSerDe'STO......
  • jQuery的$.getJSON()方法在浏览器上不能请求到本地文件
    前言今天运行很久之前写的一个echarts页面,当时是练习写demo之前写了关于地图动态的一个图表,突然显示不成功,并且报错发现了是jQuery的$.getJSON()这个方法在浏览器上不能......
  • JSP实现登录删除添加星座等(带样式)
    功能要求1、完成两个页面2、第一个登陆页面login.jsp3、第二个用户管理页面useManage.jsp4、有登录功能(能进行用户名密码的校验,用户名若为自己的学号密码为班级号,......
  • JS - 初识作用域
    作用域2022-09-29----------------全局作用域:函数之外声明的变量局部作用域:代码块里变量定义的位置-函数内外 - ES2015let:重新声明变量1{2le......
  • [JSOI2007]祖玛
    做题时间:2022.9.28\(【题目描述】\)给定一排\(N\)个整数,可以向之间插入任意一个整数,得到相邻的多于2个相同的整数就可以把他们消除掉,其余整数按顺序合并起来,也可以继续......
  • JSON APIs and Ajax
    JSONAPIsandAjaxonclick希望代码仅在页面完成加载后执行。将名为DOMContentLoaded的JavaScript事件附加到document中。以下是实现的代码:document.addEventList......
  • 如何监听Vue或js项目报错的4种方式
    背景onerrorelement.onerrorerrorHandlererrorCapturederror传播规则(划重点)如何监听异步错误总结背景在开发Vue项目时,使用浏览器调试可以比较清晰的看到报的什......
  • SpringBoot中写前端代码JSP、HTML、thymeleaf
    为什么springboot不能很好的支持jsp?:https://www.zhihu.com/question/61385975在springboot中使用jsp:https://blog.csdn.net/cflsup/article/details/123089542>>freemak......
  • JS对象数组使用IndexOf方法得到索引
    获得数组里某一个对象的索引的最佳方法是什么呢?比如如下场景:varhello={hello:'world',foo:'bar'};varqaz={hello:'stevie',foo:'baz'}......