javascript耐人寻味
在思考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耐人寻味的更多相关文章
- JavaScript –类型之我晕
每次写博我觉得取上恬当的题目比整篇行文都难,词量有限的情况下突然想到JavaScript拾遗应该会是一个非常文艺而夺目的博文题目,但我并没有急着使用,经验告诉我应该先去搜一下看有没有被用过.果不其然, ...
- JavaScript之引用类型讲解
Object类型 Object类型是JavaScript中使用最多的一种类型.虽然Object的实例不具备多少功能,但对于在应用程序中存储和传输数据而言,它确实是非常理想的选择. 创建Object实例 ...
- JavaScript –type
JavaScript –类型之我晕 每次写博我觉得取上恬当的题目比整篇行文都难,词量有限的情况下突然想到JavaScript拾遗应该会是一个非常文艺而夺目的博文题目,但我并没有急着使用,经验告诉我应该 ...
- 《JavaScript高级程序设计》读书笔记 ---Function 类型
说起来ECMAScript 中什么最有意思,我想那莫过于函数了——而有意思的根源,则在于函数实际上是对象.每个函数都是Function 类型的实例,而且都与其他引用类型一样具有属性和方法.由于函数是对 ...
- JavaScript高级程序设计学习(四)之引用类型(续)
一.Date类型 其实引用类型和相关的操作方法,远远不止昨天的所说的那些,还有一部分今天继续补充. 在java中日期Date,它所属的包有sql包,也有util包.我个人比较喜欢用util包的.理由, ...
- 《Javascript高级程序设计》阅读记录(四):第五章 下
这个系列,我会把阅读<Javascript高级程序设计>之后,感觉讲的比较深入,而且实际使用价值较大的内容记录下来,并且注释上我的一些想法.做这个一方面是提升了我的阅读效果以及方便我以后阅 ...
- [转]JavaScript之引用类型
Object类型 Object类型是JavaScript中使用最多的一种类型.虽然Object的实例不具备多少功能,但对于在应用程序中存储和传输数据而言,它确实是非常理想的选择. 创建Object实例 ...
- JavaScript 原型 原型链
一. 普通对象与函数对象 JavaScript 中,万物皆对象!但对象也是有区别的.分为普通对象和函数对象,Object .Function 是 JS 自带的函数对象.下面举例说明 var o1 = ...
- JavaScript原型和闭包学习笔记
在这里先和大家推荐一个博客,这博客的<深入理解javascript原型和闭包(完结)>系列,看了比较多的视频和书本,这个博客讲得很耐人寻味. 深入理解javascript原型和闭包(完结) ...
随机推荐
- paper 4:支持向量机系列一: Maximum Margin Classifier —— 支持向量机简介。
支持向量机即 Support Vector Machine,简称 SVM .我最开始听说这头机器的名号的时候,一种神秘感就油然而生,似乎把 Support 这么一个具体的动作和 Vector 这么一个 ...
- requireJs和r.js压缩工具
上面release是执行命令 node r.js -o build.js 生成的,需要切换到目录require/tools下面,也就是 有r.js和build.js的目录,才能执行命令 代码目录如上: ...
- 夺命雷公狗---DEDECMS----14dedecms首页导航条的完成
我们的首页完成了,那么下一步就开始创建一个模型了, 添加好电影模型后我们来给他添加一些字段,这些字段主要还是要看我们的项目需求来添加的,因为我们的项目里有: 我们在项目中要用得上这些字段,所以要对他们 ...
- 搞不定linux下的无线网卡驱动的权宜之计
毕竟windows用了这么些年了,对windows下的一些东西也比较熟悉,还有就是windows的软件方式比较傻瓜. 在linux下搞不定无线网卡啊,幸亏有甲骨文的virtualbox,咱虚拟一个xp ...
- 非 动态规划---LIS
题目:一个序列有N个数:A[1],A[2],…,A[N],求出最长非降子序列的长度.(见动态规划---LIS) /* 题目:一个序列有N个数:A[1],A[2],…,A[N],求出最长非降子序列的长度 ...
- (一)MapReduce篇之InputFormat,InputSplit,RecordReader(转)
平时我们写MapReduce程序的时候,在设置输入格式的时候,总会调用形如job.setInputFormatClass(KeyValueTextInputFormat.class);来保证输入文件按 ...
- hadoop自带例子wordcount的具体运行步骤
1.在hadoop所在目录“usr/local”下创建一个文件夹input root@ubuntu:/usr/local# mkdir input 2.在文件夹input中创建两个文本文件file1. ...
- libevent使用<一> libevent导入项目
最近做mysql代理层读写分离,发现在C,C++领域libevent很厉害的样子. 1. 安装libevent linux下源码安装或者直接yum安装. libevent只是一套对一些底层技术的封装, ...
- 【python cookbook】【数据结构与算法】2 从任意长度的可迭代对象中分解元素
从某个可迭代对象中分解出N个元素,但是可迭代对象的长度可能超过N,会出现“分解值过多”的异常: 使用“*表达式”来解决该问题: Python 3.4.3 (v3.4.3:9b73f1c3e601, F ...
- uboot启动参数
bootcmd=nand read.jffs2 0x30007FC0 kernel; bootm 0x30007FC0bootdelay=2baudrate=115200ethaddr=08:00:3 ...