脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 网络编程 → JavaScript → javascript技巧 → javascript预编译

JavaScript运行过程中的“预编译阶段”和“执行阶段”

 更新时间：2015年12月16日 15:11:24   投稿：mrr  
这篇文章主要介绍了JavaScript运行过程中的“预编译阶段”和“执行阶段”的相关资料,需要的朋友可以参考下

 javascript相对于其它语言来说是一种弱类型的语言，在其它如java语言中，程序的执行需要有编译的阶段，而在javascript中也有类似的“预编译阶段”（javascript的预编译是以代码块为范围<script></script>，即每遇到一个代码块都会进行  预编译>执行），了解javascript引擎的执行机理，将有助于在写js代码过程中的思路总结

首先科普下javascript中的两种声明方式，var和function，前者声明的是变量，后者声明的是方法

在预编译中，javascript对这两种声明做出了两种处理方案

<script>
　　var a = "1";　　　　//声明变量a
 function b(){　　　　//声明方法b
  　　alert();
　　}
　　var c = function(){ //声明变量c
　　　　alert();
　　}
</script>

以上代码块中，a、c为变量赋值，b为函数声明，当执行以上的代码时，首先会进入预编译阶段，对与变量赋值a、c会在内存中开辟一块内存空间并指向变量名，且赋值为undefined

对于函数声明，则同样会进行开辟内存空间，但赋值的对象会将声明的函数赋值给函数名

预编译阶段：（PS：不管代码中声明变量和声明函数的顺序如何，在预编译阶段会先声明变量，再声明函数）

<script>
　　　　var a = undefined;
　　　　var c = undefined;　　　　 　　　　var b = function(){
　　　　　　alert();
　　　　} </script>

 执行阶段：

<script>
　　　　a = "1";
　　　　c = function(){
　　　　　　alert();
　　　　}
</script>

整体执行步骤：

<script>
　　　　var a = undefined;
　　　　var c = undefined;
　　　　
　　　　var b = function(){
　　　　　　alert();
　　　　}
　　　　a = "1";
　　　　c = function(){
　　　　　　alert();
　　　　}
</script>

题目：

<script>
　　　　var a = "1";
　　　　function b(){
　　　　　　alert(a);
　　　　　　var a = "2";
　　　　}
　　　　b();
</script>

ps：javascript的预编译

　    一、先预定义变量，再预定义函数

　　二、变量的预编译只作声明，不作初始化，初始化在执行时

 　　三、function语句定义的函数，不仅声明了函数名，而且函数体也进行了处理

　　四、匿名函数不会预编译

function f(){      // 声明函数f  
return 1; } alert(f());       // 返回1 
var f = function(){    // 定义匿名函数f  
return 2; } alert(f());       // 返回2

先预定义了变量f,然后同名函数f()覆盖了变量f,所以第一次输出1;变量的预编译

var f = function(){    // 定义匿名函数f  
return 1; } 
alert(f());       // 返回1 
function f(){      // 声明函数f  
return 2; } 
alert(f());      // 返回1

先预定义了变量f,然后同名函数f()覆盖了变量f.

您可能感兴趣的文章:

相关文章

  • Javascript技术难点之apply，call与this之间的衔接

    Javascript技术难点之apply，call与this之间的衔接

    这篇文章主要介绍了Javascript技术难点之apply，call与this之间的衔接的相关资料,需要的朋友可以参考下
    2015-12-12
  • require导入module.exports 或 exports导出的使用方法

    require导入module.exports 或 exports导出的使用方法

    module.exports用于导出整个模块的内容,可以通过赋值给 module.exports 导出一个对象、函数或值,导出的内容可以被其他模块通过require 导入,本文给大家介绍require导入module.exports 或 exports导出的使用,感兴趣的朋友一起看看吧
    2023-11-11
  • Servlet返回的数据js解析2种方法

    Servlet返回的数据js解析2种方法

    这篇文章主要介绍了Servlet返回的数据js解析2种方法,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2019-12-12
  • 详解JavaScript中任意两数加减的解决方案

    详解JavaScript中任意两数加减的解决方案

    JavaScript中一些浮点数相加减会计算错误，本文将为大家具体介绍一下JavaScript中解决任意两数加减会出现错误的方案，需要的可以参考一下
    2022-02-02
  • js获取修改title与jQuery获取修改title的方法

    js获取修改title与jQuery获取修改title的方法

    这篇文章主要介绍了js获取修改title与jQuery获取修改title的方法,本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下
    2023-02-02
  • 使用JS+plupload直接批量上传图片到又拍云

    使用JS+plupload直接批量上传图片到又拍云

    本文详细介绍了通过js+plupload实现了绕过服务器，向又拍云批量上传图片的解决方法，十分的巧妙，也节省了服务器资源，这里推荐给有需要的小伙伴。
    2014-12-12
  • 谈谈我对JavaScript DOM事件的理解

    谈谈我对JavaScript DOM事件的理解

    DOM与事件是JavaScript最核心的组成部分之一，他们赋予了页面无限的想象空间，你根本无法离开他们，否则js将寸步难行。本文给大家分享我对javascript dom事件的了解，对javascript dom事件相关知识感兴趣的朋友一起学习吧
    2015-12-12
  • js 创建对象 经典模式全面了解

    js 创建对象 经典模式全面了解

    下面小编就为大家带来一篇js 创建对象 经典模式全面了解。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
    2016-08-08
  • 去掉gridPanel表头全选框的小例子

    去掉gridPanel表头全选框的小例子

    这篇文章介绍了去掉gridPanel表头全选框的小例子，有需要的朋友可以参考一下
    2013-07-07
  • JS开发自己的类库实例分析

    JS开发自己的类库实例分析

    这篇文章主要介绍了JS开发自己的类库,结合实例形式分析了javascript开发类库的原理、组成及实现方法,需要的朋友可以参考下
    2019-08-08

最新评论