在思考javascript解释过程的时候,看过别人几篇文章,自己做了几个测试

容易理解,在javascript,形如这样的代码可以正常执行:

alert(hello());
function hello(){
alert('hello');
}

可以得到“hello”字符串。

形如这样的代码,有问题。

alert(hello());

var hello = function(){

    alert('hello');

}
结果为undefined。两种代码执行结果不同的原因是,在javascript执行之前有个预解释阶段,形如function name()方式定义的函数会优
先赋值,就是说第一遍name变量就已经指向相应函数了,所以第一段代码在解释阶段可以访问到后面的hello函数,第二段代码中,则还要讲到,预解释阶段创建一个活动对象,然后在这个对象里把变量丢进
去,而这种定义函数的方式会然解释器认为hello是一个变量,所以,给他们赋值为undefined,第二段代码实际是以变量的形式保存了hello的值为undefined,故执行阶段时它还是允许了undefined,它在后面才得到函数定义。
当然,html的执行顺序是从上到下执行,那么嵌套在,<script></script>也应该是从上到下一块一块执行,即使是外链接的javascript代
码也不例外。
接下来是这一段代码
function hello(){

    alert('hello');

}

hello();

var hello = function () {

    alert('hello2')

}

hello();

你可以想象上面的解释,然后想象结果。

结果和预想的一样,“hello”,“hello2”。怎么样,是不是有点糊涂了,之前我们把hello放前面,所以执行到前面的hello时是undefined,首先,看上面代码,预解释阶段,本应该报错的第一个hello正常执行,说明
了给hello定义undefined在预解释阶段应该是在函数定义之前
然后是这一段,结果是什么呢,需要思考下了
function hello(){

    alert('hello');

}

hello();

function hello() {

    alert('hello2')

}

hello();

两次都是hello2而不是hello和hello2,结合前面的,可以理解,在预编译阶段已经把hello重新赋值,并且第二次遇见function hello()会忽略,或者说是直接提前了,总而言之,以上代码实际上执行顺序是

function hello(){

    alert('hello');

}

hello = function() {

    alert('hello2')

}
hello(); hello();
就是这样,然后我们在看两段代码,第一段比较简单是这样:
<script type="text/javascript">

    function hello(){

        alert('hello');

    }

    hello();

</script>

<script type="text/javascript">

    function hello() {

        alert('hello2')

    }

    hello();

</script>
得到预想结果,hello 和hello2,不同就是拆成了两块,而代码是一块一块执行的。前面已经提到。
然后下面这一段需要深入仔细的看看,和思考哈哈。
<script type="text/javascript">

    var hello = function () {

        alert('hello');

    }

    hello();

    function hello() {

        alert('hello2')

    }

    hello();

</script>

先不说结果,猜猜是什么结果,是不是有人会以为第二次从新赋值,结果不是和那一段代码一样吗,错了,两次都是hello,是前面的那个函数的值,原因其实很简单function hello()提前了,所以实际上是第一个函数覆盖了第二个函数。

修改了一点东西,同时附上之前看到链接,其实,现在看看,这东西还是有点怪怪,不过它还是挺重要,怎么说,至少要知道其实js解释分两次,有这感觉这对写代码时候是很有帮助:

参考:http://www.jb51.net/article/44123.htm

javascript耐人寻味的更多相关文章

  1. JavaScript –类型之我晕

    每次写博我觉得取上恬当的题目比整篇行文都难,词量有限的情况下突然想到JavaScript拾遗应该会是一个非常文艺而夺目的博文题目,但我并没有急着使用,经验告诉我应该先去搜一下看有没有被用过.果不其然, ...

  2. JavaScript之引用类型讲解

    Object类型 Object类型是JavaScript中使用最多的一种类型.虽然Object的实例不具备多少功能,但对于在应用程序中存储和传输数据而言,它确实是非常理想的选择. 创建Object实例 ...

  3. JavaScript –type

    JavaScript –类型之我晕 每次写博我觉得取上恬当的题目比整篇行文都难,词量有限的情况下突然想到JavaScript拾遗应该会是一个非常文艺而夺目的博文题目,但我并没有急着使用,经验告诉我应该 ...

  4. 《JavaScript高级程序设计》读书笔记 ---Function 类型

    说起来ECMAScript 中什么最有意思,我想那莫过于函数了——而有意思的根源,则在于函数实际上是对象.每个函数都是Function 类型的实例,而且都与其他引用类型一样具有属性和方法.由于函数是对 ...

  5. JavaScript高级程序设计学习(四)之引用类型(续)

    一.Date类型 其实引用类型和相关的操作方法,远远不止昨天的所说的那些,还有一部分今天继续补充. 在java中日期Date,它所属的包有sql包,也有util包.我个人比较喜欢用util包的.理由, ...

  6. 《Javascript高级程序设计》阅读记录(四):第五章 下

    这个系列,我会把阅读<Javascript高级程序设计>之后,感觉讲的比较深入,而且实际使用价值较大的内容记录下来,并且注释上我的一些想法.做这个一方面是提升了我的阅读效果以及方便我以后阅 ...

  7. [转]JavaScript之引用类型

    Object类型 Object类型是JavaScript中使用最多的一种类型.虽然Object的实例不具备多少功能,但对于在应用程序中存储和传输数据而言,它确实是非常理想的选择. 创建Object实例 ...

  8. JavaScript 原型 原型链

    一. 普通对象与函数对象 JavaScript 中,万物皆对象!但对象也是有区别的.分为普通对象和函数对象,Object .Function 是 JS 自带的函数对象.下面举例说明 var o1 = ...

  9. JavaScript原型和闭包学习笔记

    在这里先和大家推荐一个博客,这博客的<深入理解javascript原型和闭包(完结)>系列,看了比较多的视频和书本,这个博客讲得很耐人寻味. 深入理解javascript原型和闭包(完结) ...

随机推荐

  1. JSon_零基础_002_将List类型数组转换为JSon格式的对象字符串,返回给界面

    将List类型数组转换为JSon格式的对象字符串,返回给界面 所需要导入的包: 编写bean: package com.west.webcourse.po; /** * 第01步:编写bean类, * ...

  2. 自定义Scrollview--实现仿淘宝Toolbar透明度渐变效果

    ,上个月做了下电商的项目,本来以为本简单的,但做起来还是遇到了不少的问题,上个周五项目就上线了,不过时间还是很紧,PM给了我两天时间总结总结,然后又要开始一个新的项目和这个项目的迭代,感觉又要开始累死 ...

  3. Facebook开源项目:我们为什么要用Fresco框架?

    (Facebook开源项目)Fresco:一个新的Android图像处理类库 在Facebook的Android客户端上快速高效的显示图片是非常重要的.然而多年来,我们遇到了很多如何高效存储图片的问题 ...

  4. BJFU 1009

    描述 现在社会上的抽奖活动简直是太多了.前段时间中国联通就举办了一个很无聊的抽奖活动,规则是每人可以向中国联通的短信系统发送一个实数,系统每天会从这些数字中选择一个无重复(就是有且只有一个)且最小的数 ...

  5. [Ubuntu] ubuntu13.04 从php5.4降级到php5.3

    ubuntu12.10以后,默认的deb安装库上面的php版本已经是5.4了,公司的项目使用5.4的时候,还是会出现很多问题,所以不得不降级安装5.3 顺便说一句,我原来的环境是nginx + php ...

  6. mysql去除重复数据

    select可以取别名,delete不能. 1.使用mysql进行delete from操作时,若子查询的 FROM 字句和更新/删除对象使用同一张表,会出现错误. mysql> DELETE ...

  7. ASP.NET MVC 返回JsonResult序列化内容超出最大限制报错的解决办法

    在使用MVC的时候我们经常会在Controller的Action方法中返回JsonResult对象,但是有时候你如果序列化的对象太大会导致JsonResult从Controller的Action返回后 ...

  8. angularjs 相关资料

    1.angularjs 框架结构 bootstrap process :http://www.oschina.net/translate/angularjs-the-next-big-thing?pr ...

  9. 常用的I/O流类型

    1.I/O流类型基础.(类中方法和子类查看java spring API) 抽象类java.io.InputStream:是所有字节输入流的父类,定义了以字节为基本单位读取数据的基本方法 抽象类jav ...

  10. 网上书城分类Category模块

    2 分类模块 2.1 创建分类模块相关类 在每个模块开始时,都要创建如下基本类:实体类.DAO类.Service类.Servlet类: l cn.itcast.goods.category.domai ...