首页 > 代码库 > js---07 js解析器作用域
js---07 js解析器作用域
js解析器首先不会逐行读代码,这是第二部了。 首先 根据var找到变量,根据function找函数,找到变量var a = 1,js解析器只会读取等号前面的var a,并把a设置值未定义,并不会读取等号后面的a = 1,所以a的值是未定义,并加入仓库,根据function找到函数后,function a (){ alert(2); },找到函数是函数整体,这是js的预解析(预解析只找var 和函数)。遇到重名的留下后面的,变量和函数重名了,函数在后面,只留下函数。 正式读取代码的时候,是从上到下从左到右,上面<script/>块中定义的变量可以直接在下面的<script/>中使用。 alert(a); var a = 1; 读取到alert(a);时候,因为之前a是未定义,所以这个报错,遇到表达式a = 1,就把之前a是未定义变成1。 var a = 1; function fn1(){ alert(a); var a = 2; } fn1(); alert(a); 首先预解析找到var a = 1,此时a未定义,和函数,加入仓库(预解析只解析var 和 函数的定义)。 预解析完了,从上到下执行,遇到函数调用fn1(); 函数是一个局部的域,会新开一个局部作用域,遇到域就进行预解析和逐行执行代码,局部预解析时var a 是未定义,局部预解析完了就开始逐行执行代码,alert(a)只会在函数局部域内找a是未定义,var a = 2只是改变局部域中a为2不会改变全局域的a,最后alert(a)弹出1 var a = 1; function fn1(){ alert(a); a = 2; } fn1(); alert(a); 首先预解析,a是未定义,函数fn1也加入仓库,全局域的预解析完了。下面开始逐行执行代码。var a = 1把仓库中的a改成1,找到函数的定义,这里不动它,然后找到函数的调用fn1(),开始函数局部域的预解析,局部域中没有var 和函数定义,局部域的预解析完了,然后逐行执行函数内部,读到alert(a),在局部域中没有找到a,则会向上级域中去找,找到全局域的a = 1,弹出a = 1,在执行a = 2,局部作用域没有a则找到上级域,把a改成了2,最后弹出2. var a = 1; function fn1(a){ alert(a); //a是局部域中的仓库中的a, a = 2; } fn1(); alert(a); 首先预解析var a = 未定义 ,和函数fn1()加入仓库。 逐行执行代码a = 1,函数调用fn1(),看到参数a,会在函数局部作用域解析a = 未定义,alert(a)弹出未定义,a= 2改变局部作用域中的a的值,最后alert(a),弹出1。 var a = 1; function fn1(a){ alert(a);//a是局部域中的仓库中的a, a = 2; } fn1(a); alert(a); 全部预解析,a=未定义,函数就是一个函数。 读代码,全局a=1,函数定义不动。函数调用,局部开始新的预解析和逐行读代码,局部没有var 没有function,有参数a,加入局部域的仓库a = 未定义,接下来局部域逐行读代码,首先从参数开始读,a= 1,是从全局前面传进来的,局部作用域的a等于1了,alert(a)弹出1,a=2修改局部作用域的a = 2,全局a没有改变,因为a参数传进来相当于局部域定义了一个新变量a,最后弹出1 function fn2(){ var a = ‘9999999克拉钻石23456789‘; fn3(a); } fn2(); function fn3(a){ alert(a); } 全局解析:把函数fn2()和fn3()加入全局的仓库。 逐行读代码: fn2()调用: 局部解析 var a = 未定义,无函数定义 局部逐行读代码,a = ‘9999999克拉钻石23456789‘,函数调用fn3(a),局部域仓库中没有找到fn3()的定义,去全局域中找,找到了,fn3(a)调用开始: 局部的局部解析,参数相当于新定义一个局部变量,a = 未定义 局部的局部逐行执行代码,a = 全局传进来的值9999999克拉钻石23456789,alert(a)
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>无标题文档</title> <script> window.onload = function (){ var aBtn = document.getElementsByTagName(‘input‘); for( var i=0; i<aBtn.length; i++ ){ aBtn[i].onclick = function (){ alert( i ); // 一直是3,因为for执行完之后i一直等于3 //aBtn[i].style.background = ‘yellow‘; for( var i=0; i<aBtn.length; i++ ){ aBtn[i].style.background = ‘yellow‘; } }; } }; </script> </head> <body> <input type="button" value="http://www.mamicode.com/按钮1" /> <input type="button" value="http://www.mamicode.com/按钮2" /> <input type="button" value="http://www.mamicode.com/按钮3" /> </body> </html>
js---07 js解析器作用域
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。