JavaScript_01 运行机制和预解析

JavaScript是解释性语言,运行的时候动态解析执行

JavaScript加载编译的时候,是以<script>遵守document加载html节点树形加载的,先加载的<Script>是会先运行,在<script>标签里面,JavaScript遇到编译错误的代码行的时候就会报错跳出这段<script>,之前没有跳出<script>的时候加载的代码段因为已经加载到document里面,可以运行

代码

【测试一】

<script>

//同一个script内

var a = "test";

alert(a);//a正确定义,所以这里会在浏览器弹出对话框

alert(b);//b事先没有定义,所以这里出现语法错误,这里就会出错跳出

var c= "test";

alert(c)

</script>

【测试二】

<scrirpt type="text/javascript">

alert(test);//没有定义test,所以出错,下面的不能运行

var test = "test";

alert(test);//这里不能运行

</script>

<--!接着下一段JavaScript代码-->

<scrirpt type="text/javascript">

var test = "test";

alert(test);//可以运行,不受上一段JavaScript影响

</script>

预解析

(1)如果JavaScript仅是运行时自上往下逐句解析的,下面的代码能正确运行是可以理解的,因为我们先定义函数,然后才调用它。 

function showMsg() 

alert('This is message'); 

showMsg(); // This is message 

(2)我们也知道函数可以定义在调用代码之后,如下代码也是能正常工作的。看起来调用showMsg()的时候showMsg()还是没有定义的,但能正常工作,则表明JavaScript是“预解析”的。 

showMsg(); // This is message

function showMsg()

{

alert('This is message');

}

(3)运行将会弹出undefined(变量被定义但未被赋值),表明第一句的msg已经是定义了,只是没有初始化,它与var msg; alert(msg);是一样的。如果你把下面第二句注释掉,则会报“msg未定义”错误。这亦表明JavaScript是“预解析”的。 

alert(msg); //undefined 

var msg='This is message'; 

(4)以下代码你将看到两次弹出的对话框都是显示This is message 2,为什么会这样呢?其实下面一前一后定义了两个同名函数,后面的showMsg()覆盖了前面定义的(在JavaScript中,同名变量一样会存在覆盖问题),等于第一个showMsg()报废了。第二次调用的showMsg()不是调用它上面定义的那个message 1函数,这再次证明JavaScript有“预解析”行为。 

showMsg(); // This is message 2 

function showMsg() 

alert('This is message 1'); 

showMsg(); // This is message 2 

function showMsg() 

alert('This is message 2'); 

(5)JavaScript“预解析”是把变量或函数预解析到它们能调用的环境(变量运行时环境)中。如下代码看起来alert(msg)之前有看到msg的定义,但是程序运行还是报“msg未定义”错误,这是因为函数里定义的变量是函数的私有变量,外面不能直接调用,这表明JavaScript“预解析”并不是把所有定义的变量统一解析到一个全局对象中,比如window。 

function showMsg() 

var msg='This is message'; 

alert(msg); // msg未定义 

(6)JavaScript“预解析”是分段进行的,准确说是分<script>块进行的。以下代码出现在同一个页面的两个脚本块中,同时定义了三个同名函数。程序运行结果表明第二个脚本块的showMsg()没有覆盖前面两个showMsg(),而第一个脚本块的第二个showMsg()则覆盖了第一个showMsg()。 

showMsg(); //This is message 2

function showMsg()

{

alert('This is message 1');

}

function showMsg()

{

alert('This is message 2');

}

function showMsg()

{

alert('This is message 3');

}

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • JavaScript是解释型语言是毋庸置疑的,那么它是不是仅在运行时自上往下一句一句地解析的呢? 事实上或某种...
    SandyFrankie阅读 1,235评论 0 0
  • javascript 的预解析:(个人理解)代码在执行之前 会在相应的执行环境中预先把 一些东西解析到内存**一....
    ea203453e188阅读 3,362评论 0 1
  • 工厂模式类似于现实生活中的工厂可以产生大量相似的商品,去做同样的事情,实现同样的效果;这时候需要使用工厂模式。简单...
    舟渔行舟阅读 12,378评论 2 17
  • 第一章: JS简介 从当初简单的语言,变成了现在能够处理复杂计算和交互,拥有闭包、匿名函数, 甚至元编程等...
    LaBaby_阅读 5,610评论 0 6
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 135,347评论 19 139