先给几段代码,看看你能知道运行结果不

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的解析顺序问题的更多相关文章

  1. 从var func=function 和 function func()区别谈Javascript的预解析机制

    var func=function 和 function func()在意义上没有任何不同,但其解释优先级不同:后者会先于同一语句级的其他语句. 即: { var k = xx(); function ...

  2. js的解析顺序 作用域 严格模式

    一.javascript的解析顺序 我们大家所理解的代码的执行顺序都是从上到下的,但是实际上确不是这样的.我们看一下下面的代码. 1 alert(a); 2 var a = 1; 如果执行顺序是从上到 ...

  3. js解析顺序了解一下??

    我们在学习一种新事物的时候,总是知其然,而不知其所然.有些人会探究到底,有一些人会得过且过. 好了,开场白结束,直接进入正题. js不像C语言那样只要编译一次之后成.exe文件之后就不用在编译可以直接 ...

  4. javascript的解析顺序

    一.javascript的解析顺序 我们大家所理解的代码的执行顺序都是从上到下的,但是实际上确不是这样的.我们看一下下面的代码. 1 alert(a);2 var a = 1;如果执行顺序是从上到下的 ...

  5. 请教前辈:关于JS的一个奇怪的错误,不知是解析顺序造成的,还是什么原因。。

    各位前辈好,如题,不知道是HTML解析顺序造成的,还是JS预编译的结果(见注释). 烦请各位前辈进行指导. <!DOCTYPE html> <html> <head> ...

  6. JavaScript解析顺序和变量作用域

    JavaScript基础之变量作用域. 一. 1.全局变量:全局变量的意思就是,在代码的不论什么地方都能够訪问到.注意:未定义 直接赋值的变量拥有全局属性. 2.局部变量:局部变量的意思就是,变量的作 ...

  7. JavaScript 中,定义函数时用 var foo = function () {} 和 function foo() {}有什么区别?

    对于新手来说(本人也是新手-_-!),好像var foo = function () {} 和 function foo(){}并没有什么区别,意识里可能就认为就是两种不同的写法而已.但是,通过网上查 ...

  8. function(){}、var fun=function(){}和function fun(){}的区别

    一.基本定义 1.函数声明:使用function声明函数,并指定函数名. function fun() { // ...... } 2.函数表达式:使用function声明函数,但未指定函数名,将匿名 ...

  9. var abc = function(x){} 和 function abc(x){}的区别

    转自百度知道. 问:js里声明函数有几种方式? var abc = function(x){} 和 function abc(x){} 这两种声明方法有什么不同? 答:首先后者是指函数声明,前者是指函 ...

随机推荐

  1. Django之视图层

    一.视图函数 一个视图函数,简称视图,是一个简单的python函数,接收web请求并返回web响应.响应可以是一张网页的HTML内容,一个重定向,一个404错误等.在函数中必须写一个request的参 ...

  2. JavaScript之破解数独(附详细代码)

      在上一篇分享中,我们用Python和Django来破解数独,这对不熟悉Python和Django的人来说是非常不友好的.这次,笔者只用HTML和JavaScript写了破解数独的程序,对于熟悉前端 ...

  3. EF SaveChanges() 报错(转载)

    最佳答案 报这个错是因为,提交了主键重复的数据,虽然未提交到数据库中 但是现在的EF上下文中已经包含了我提交的数据,下次在提交正确数据时, 原来添加到上下文中的数据依然还在..如何处理这个问题呢?   ...

  4. java根据年月显示每周

    一.页面效果 1.展示7月份的所有周. 2.当前时间2018.08.02  ,  显示到本周. 二.前端代码 1.显示层的代码 <span id="weekyear"> ...

  5. Tests of the Equality of Two Means

    Introduction In this lesson, we'll continue our investigation of hypothesis testing. In this case, w ...

  6. 基于mave的dubbo分别架构

    开始前,先看一下demo项目工程结构: 1.抽离接口 dubbo-api工程,根据业务抽离接口,deploy到mave nexus. public interface TestService { /* ...

  7. 【代码笔记】Web-ionic-列表

    一,效果图. 二,index.html代码. <!DOCTYPE html> <html> <head> <meta charset="utf-8& ...

  8. vue-cli脚手架目录一览

    最近在学习vue,看的稀里糊涂.今天从头开始,把cli配置的vue项目目录和配置文件搞清楚. 先看看整个项目目录结构: 再看看build文件夹下相关文件及目录: config文件夹下目录和文件: 接下 ...

  9. docker-使用Dockerfile制作镜像

    最近项目中有使用docker,组内做了关于docker的培训,然后自己跟着研究了一下,大概了解如何使用.我是基于tomcat镜像制作(不需要安装jdk,配置环境变量),基于centos镜像制作需要安装 ...

  10. 喜闻乐见-Android简介

    本文主要是对Android系统做一个简介,包括其架构.启动流程.沙箱机制.APK.Darlvik以及ART. 1. 架构 Android是基于Linux内核开发出的一个移动操作系统,系统结构大致可以分 ...