js作用域的理解
script:自上而下 全局变量、全局函数
函数:由里到外
浏览器:
“JS解析器”
1)“找一些东西”: var function
参数 a = 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=2(函数内部的a=2);//内部有的值,不改变外部a变量的值;
}
fn1(a);//1
alert(a);//1
注意:如果fn1函数中带有其他函数fn1x(){} 并且执行该函数的,那么过程就是 预解析: a=未定义 a = 1,然后再是 fn1x = fn1x(){。。。},再执行函数内部。。。
js作用域的理解的更多相关文章
- 对JS作用域和作用域链的理解
理解好javascript的变量作用域和链式调用机制对用好变量起着关键的作用,下面我来谈谈这两个概念的理解. (1)链式调用机制 作用域链的定义:函数在调用参数时会从函数内部到函数外部逐个”搜索“参数 ...
- Atitit 作用域的理解attilax总结
Atitit 作用域的理解attilax总结 1.1. 作用域是指对某一变量和方法具有访问权限的代码空间, 1 1.2. 作用域的使用提高了程序逻辑的局部性,增强程序的可靠性,减少名字冲突.1 1.3 ...
- 前端基本知识(三):JS的闭包理解
JS闭包的理解 一.变量的作用域 二.如何从外部读取局部变量 三.什么是闭包 四.深入理解闭包 五.闭包的用途 六.使用闭包注意情况 七.JavaScript的垃圾回收机制 八.一些思考题 一.变量作 ...
- 前端基本知识(三):JS的闭包理解(第一个思考题有错误,已修改)
JS闭包的理解 一.变量的作用域 二.如何从外部读取局部变量 三.什么是闭包 四.深入理解闭包 五.闭包的用途 六.使用闭包注意情况 七.JavaScript的垃圾回收机制 八.一些思考题 一.变量作 ...
- JS作用域,作用域,作用链详解
前言 通过本文,你大概明白作用域,作用域链是什么,毕竟这也算JS中的基本概念. 一.作用域(scope) 什么是作用域,你可以理解为你所声明变量的可用范围,我在某个范围内申明了一个变量,且这个变量 ...
- JS底层知识理解之执行上下文篇
JS底层知识理解之执行上下文篇 一.什么是执行上下文(Execution Context) 执行上下文可以理解为当前代码的执行环境,它会形成一个作用域. 二.JavaScript引擎会以什么方式去处理 ...
- JS作用域和ASP(vbs)作用域比较
一.js作用域,先上图: 以上代码执行的效果是,依次弹出 undefined, undefined, a, a,为什么是这样的结果啦?因为JS的作用域为链式作用域. 作用域链: 用VAR声明一个变量时 ...
- JS闭包的理解及常见应用场景
JS闭包的理解及常见应用场景 一.总结 一句话总结: 闭包是指有权访问另一个函数作用域中的变量的函数 1.如何从外部读取函数内部的变量,为什么? 闭包:f2可以读取f1中的变量,只要把f2作为返回值, ...
- JS作用域、变量提升和闭包
作用域 作用域可以理解为JS引擎执行代码的时候,查找变量的规则. 从确定变量访问范围的阶段的角度,可以分为2类,词法作用域和动态作用域.js是词法作用域. 从变量查找的范围的角度,可以分为3类,全局作 ...
随机推荐
- bzoj3242 [Noi2013]快餐店
Description 小T打算在城市C开设一家外送快餐店.送餐到某一个地点的时间与外卖店到该地点之间最短路径长度是成正比的,小T希望快餐店的地址选在离最远的顾客距离最近的地方. 快餐店的顾客分布在城 ...
- 动态规划专题(三)——数位DP
前言 数位\(DP\) 真的是最恶心的\(DP\). 简介 看到那种给你两个数,让你求这两个数之间符合条件的数的个数,且这两个数非常大,这样的题目一般就是 数位\(DP\) 题. 数位\(DP\)一般 ...
- PMBOK(第六版) PMP笔记——第十章(项目沟通管理)
PM 大多数时间都用在与干系人的沟通上.第十章有三个过程: 规划沟通管理:根据干系人的需求,制定沟通管理计划管理沟通:根据沟通管理计划发布.收集.处理信息监督沟通:确保在正确时间将正确信息传递给正确的 ...
- Shell重启Tomcat脚本
#!/bin/bash echo -e "\n\n\n" #force kill flag,if equal [f] to force kill all flag="He ...
- 人脸验证算法Joint Bayesian详解及实现(Python版)
人脸验证算法Joint Bayesian详解及实现(Python版) Tags: JointBayesian DeepLearning Python 本博客仅为作者记录笔记之用,不免有很多细节不对之处 ...
- CVE-2018-4878
0x00前言 该漏洞影响 Flash Player 版本28.0.0.137以及之前的所有版本 0x01 poc Poc 这里只列出关键代码 public function triggeruaf() ...
- 当GetWindowText获取不到标题时可以用SendMessage
GetWindowText所有父窗口标题基本可以获取到, 但是当获取父窗口下的子窗口控件标题文本时有时候就没那么好用了, 这个时候可以通过SendMessage发送消息来获取,也很简单,C/C++代码 ...
- kubernetes搭建dashboard-v1.10.1
一键部署脚本(或者可使用helm安装): wget https://raw.githubusercontent.com/kubernetes/dashboard/v1.10.1/src/deploy/ ...
- PhotoSwipe图片展示插件
这个插件相当棒!功能也很强大,可以自行体会. 官方网址:http://www.photoswipe.com/ github地址:https://github.com/codecomputerlove/ ...
- JavaScript事件对象与事件的委托
事件对象 包含事件相关的信息,如鼠标.时间.触发的DOM对象等 js默认将事件对象封装好,并自动的以参数的形式,传递给事件处理函数的第1个参数,如下: document.getElementsByTa ...