关于var与function的解析顺序问题
先给几段代码,看看你能知道运行结果不
function example1() {
var f = function() {return 1;};
return f;
var f = function() {return 2;};
}
var a1 = example1();
alert(a1());
function example2() {
function f() {return 1;};
return f;
function f() {return 2;};
}
var a2 = example2();
alert(a2());
function example3() {
function f() {return 1;};
return f;
var f = function() {return 2;};
}
var a3 = example3();
alert(a3());
function example4() {
var f = function() {return 1;};
return f;
function f() {return 2;};
}
var a4 = example4();
alert(a4());
function example5() {
var f = function() {return 1;};
function f() {return 2;};
return f;
}
var a5 = example5();
alert(a5());
function example6() {
function f() {return 1;};
var f = function() {return 2;};
return f;
}
var a6 = example6();
alert(a6());
function example7() {
function f() {return 1;};
var f = function() {return 2;};
var f;
return f;
}
var a7 = example7();
alert(a7());
先给出运行结果1,2,1,1,1,2,2
解释一下,这里必须搞清楚js在解析运行时会把声明放在前边,比如var a=1;那解析时会把var放在当前作用域最前面进行解析,而a=1只是个赋值操作,解析运行时位置不变,举个简单的例子,比如有如下代码:
alert(f);
执行时肯定会报错,因为f未定义,如果我们改写成如下代码
var f = function(){};
alert(f);
那一定会打印function(){},这个地球人都知道,如果把代码写成下面样子
alert(f);
var f = function(){};
那么可能有人就不太注意了,这时候执行是不会报错的,打印的是undefined,因为执行时会把声明提前,所以上面的代码在解析执行时,实际上变成了以下代码:
var f;
alert(f);
f = function(){};
然后再说一下function,function是一种声明加赋值的写法,还是继续上面的例子,先给出一段代码
alert(f);
function f(){}
这时候会打印出function f(){},我们可以看到使用function进行函数定义时,不仅声明提前了,就连赋值也提前了,上面的代码在解析执行时,实际变成这样
var f;
f = function f(){};
alert(f);
接下来我们讨论var 与 function一起出现的时候优先级问题,function的优先级要大于var,也就是function的声明会在var前面,并且function的赋值会在等号赋值的前面,我们就分析一下文章开关的example5的代码
function example5() {
var f = function() {return 1;};
function f() {return 2;};
return f;
}
var a5 = example5();
alert(a5());
我们看到var和function都声明了一个变量f,而且这个f进行了两次赋值,一次是直接用等号赋值,另一次是function赋值,依据前面的优先级规则,function的声明和赋值都会优先,所以这段代码在解析执行时变成了下面的代码:
function example5() {
var f; // function声明
var f; // var声明
f = function f() {return 2;}; // function赋值
f = function() {return 1;}; // 等号赋值
return f;
}
var a5 = example5();
alert(a5());
所以最后的运行结果为1。
案例
1 function example() {
f = 1;
return f;
function f(){return 1;};
}
var a = example();
alert(f);
执行结果为1
2 function fun(){
alert(0);
}
fun();
var fun = function(){
alert(1);
}
fun();
var fun = function(){
alert(2);
}
fun();
function fun(){
alert(3);
}
fun();
结果是3 1 2 2
关于var与function的解析顺序问题的更多相关文章
- 从var func=function 和 function func()区别谈Javascript的预解析机制
var func=function 和 function func()在意义上没有任何不同,但其解释优先级不同:后者会先于同一语句级的其他语句. 即: { var k = xx(); function ...
- js的解析顺序 作用域 严格模式
一.javascript的解析顺序 我们大家所理解的代码的执行顺序都是从上到下的,但是实际上确不是这样的.我们看一下下面的代码. 1 alert(a); 2 var a = 1; 如果执行顺序是从上到 ...
- js解析顺序了解一下??
我们在学习一种新事物的时候,总是知其然,而不知其所然.有些人会探究到底,有一些人会得过且过. 好了,开场白结束,直接进入正题. js不像C语言那样只要编译一次之后成.exe文件之后就不用在编译可以直接 ...
- javascript的解析顺序
一.javascript的解析顺序 我们大家所理解的代码的执行顺序都是从上到下的,但是实际上确不是这样的.我们看一下下面的代码. 1 alert(a);2 var a = 1;如果执行顺序是从上到下的 ...
- 请教前辈:关于JS的一个奇怪的错误,不知是解析顺序造成的,还是什么原因。。
各位前辈好,如题,不知道是HTML解析顺序造成的,还是JS预编译的结果(见注释). 烦请各位前辈进行指导. <!DOCTYPE html> <html> <head> ...
- JavaScript解析顺序和变量作用域
JavaScript基础之变量作用域. 一. 1.全局变量:全局变量的意思就是,在代码的不论什么地方都能够訪问到.注意:未定义 直接赋值的变量拥有全局属性. 2.局部变量:局部变量的意思就是,变量的作 ...
- JavaScript 中,定义函数时用 var foo = function () {} 和 function foo() {}有什么区别?
对于新手来说(本人也是新手-_-!),好像var foo = function () {} 和 function foo(){}并没有什么区别,意识里可能就认为就是两种不同的写法而已.但是,通过网上查 ...
- function(){}、var fun=function(){}和function fun(){}的区别
一.基本定义 1.函数声明:使用function声明函数,并指定函数名. function fun() { // ...... } 2.函数表达式:使用function声明函数,但未指定函数名,将匿名 ...
- var abc = function(x){} 和 function abc(x){}的区别
转自百度知道. 问:js里声明函数有几种方式? var abc = function(x){} 和 function abc(x){} 这两种声明方法有什么不同? 答:首先后者是指函数声明,前者是指函 ...
随机推荐
- 3分钟看完Java 8——史上最强Java 8新特性总结之第四篇 其他新特性
目录 · 默认方法和静态方法 · 初步理解 · 应用模式 · 优先级问题 · Optional · CompletableFuture · 基本用法 · CompletableFuture与Strea ...
- JS截取字符串substr 和 substring方法的区别
substr 方法 返回一个从指定位置开始的指定长度的子字符串. stringvar.substr(start [, length ]) 参数 stringvar 必选项.要提取子字符串的字符串文字或 ...
- vb.net 使用NPOI控制Excel檔
'導入命名空間 Imports NPOI.HSSF.UserModelImports NPOI.HPSFImports NPOI.POIFS.FileSystem Private Sub A1()'方 ...
- vue VNode如何使用,是什么东西?
前言:element ui 中有些 demo 使用了 vue 的 VNode,但是 demo 毕竟不全,所以想要了解 VNode 到底是什么,如何写出符合自己业务的代码. vue 官网介绍:渲染函数 ...
- linux -bash . startup.sh Permission denied
在执行./startup.sh,或者./shutdown.sh的时候,爆出了Permission denied, 其实很简单,就是今天在执行tomcat的时候,用户没有权限,而导致无法执行, 用命令c ...
- java获取文件路径
情况:工程项目没有放到tomcat下,在eclipse运行 1.获取项目根目录,根据在哪里运行 2. 3.从最终生成的.class文件为着手点 4.在controller下
- 【代码笔记】Web-ionic-index创建侧边栏
一,创建侧边栏. <!DOCTYPE html> <html> <head> <meta charset="utf-8"> < ...
- 03--css形状--css揭秘
形状 一 自适应的椭圆 1.难题 1> 圆 你可能注意到过, 给任何正方形元素设置一个足够大的border-radius, 就可以把它变成一个圆形.所用到的CSS 代码如下所示: #bd { w ...
- easyUI combobox combotree 模糊查询,带上下键选择功能,待完善。。。。
/2017年4月9日 11:52:36 /** * combobox和combotree模糊查询 * combotree 结果带两级父节点(手动设置数量) * 键盘上下键选择叶子节点 * 键盘回车键设 ...
- 【Java入门提高篇】Day29 Java容器类详解(十一)LinkedHashSet详解
当当当当当当当,本来打算出去浪来着,想想还是把这个先一起写完吧,毕竟这篇的主角跟我一样是一个超级偷懒的角色——LinkedHashSet,有多偷懒?看完你就知道了. 本篇将从以下几个方面对Linked ...