认识javascript的引擎之--1

前言:

一:每一款浏览器里面都能执行js脚本,那是因为制造商在浏览器里面加入了js引擎。也就是说js引擎在浏览器里面占有一席之地。

    1.开始的时候js处于沉睡状态,直到运行页面遇到 <script> 这个标签的时候就被浏览器叫醒了:浏览器说,js引擎有个叫<script> 的叫你

    2.然后js引擎就出去招待客人 <script>。到这个时候js引擎就开始工作了。

二:浅谈js引擎的工作

   1.预解析

      js引擎工作的时候回预先往自己的一个仓库里面存数据,然后在进行读代码的工作。

      js引擎会读取  var  function  参数...    在遇见这个声明的时候,js引擎就会把这些存储在自己的仓库里面。

      遇到所有的变量,在正式运行代码之前,都提前赋了一个值:未定义    a =  .....   //undefined   未定义

      所有的函数,在正式运行代码之前,都是整个函数块:fn1 = function fn1(){ alert(2); }

      遇到重名的:只留一个

        1.变量和函数重名了,就只留下函数。  因为变量为未定义( undefine)函数有值,所以保留有值的。
        2.函数与函数,后出现的函数会覆盖前出现的函数。

     2.读代码(逐行读取从上到下)

      当预解析完毕就开始读取代码:读取代码的时候遇到变量的 表达式:= + - * / % ++ -- ! 参数……      表达式可以修改预解析的值!  就会到自己的仓库里面查看是否有这个变量,并修改其仓库里面的变量值。

三点:面试题问答

 1 alert(a);                    // function a (){ alert(4); }
 2 var a = 1;
 3 alert(a);                    // 1
 4 function a (){ alert(2); }
 5 alert(a);                    // 1
 6 var a = 3;
 7 alert(a);                    // 3
 8 function a (){ alert(4); }
 9 alert(a);                    // 3
10
11 js引擎如何执行呢?
12       1.预解析:解析 变量,function 参数等   放入自己的仓库存起来
13           解析到第2行: a =...
14           解析到第4行: a = function(){alert(2)}   这时候遇到同名的只保留一个,保留函数
15           解析到第6行: 仓库里面依旧是   a = function(){alert(2)}
16           解析到第8行: 仓库里面  a = function(){alert(4)}    他会覆盖第5行的a
17           解析完毕:仓库里面剩下  a = function(){alert(4)}
18     2.读取操作(读取的时候逐行读取)
19         读取到第1行:先查看仓库里面有什么,仓库里面只剩下 function(){alert(4)}   输出: function(){alert(4)}
20         读取到第2行:这是一行表达式,表达式会修改仓库里面的值  仓库里面 a = 1
21         读取到第3行:输出  1
22         读取到第4行: 只是一个函数的声明,不是表达式所以仓库里面还是 a = 1
23         读取到第5行:输出1
24         读取到第6行:仓库里面 a=3
25         读取到第7行:输出 3
26         读取到第8行:只是一个函数的声明,不是表达式所以仓库里面还是 a = 3
27         读取到第9行:输出 3
时间: 2024-11-09 07:44:23

认识javascript的引擎之--1的相关文章

JavaScript模板引擎

JavaScript模板引擎实例应用 在之前的一篇名为<移动端基于HTML模板和JSON数据的JavaScript交互>的文章中,我向大家说明了为什么要使用JavaScript模板以及如何使用,文末还提到了laytpl.artTemplate.doT.baiduTemplate.kissyTemplate等模板引擎. 本文将举实例向大家讲解几个常用模板引擎的简单使用. 演示地址:模板引擎示例http://demo.52fhy.com/jstemp/ 准备工作 演示数据:blog.json结构:

推荐13款javascript模板引擎

javaScript 在生成各种页面内容时如果能结合一些模板技术,可以让逻辑和数据之间更加清晰,本文介绍 X 款 JavaScript 的模板引擎.(排名不分先后顺序) 1. Mustache 基于javascript 实现的模板引擎,类似于 Microsoft’s jQuery template plugin,但更简单易用! 2. EasyTemplate 在使用过Freemarker模 板后,感觉它的 语法比较朴实,平易近人,容易上手,于是决定按它的语法风格实现一个前端的 模板引擎,这就有了

新一代 javascript 模板引擎

artTemplate-3.0 新一代 javascript 模板引擎 <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> </head> <script type="text/javascript" src="js/template.js"></script> <

发布一个开源极致的javascript模板引擎tpl.js

tpl.js(大家直接去https://git.oschina.net/tianqiq/tpl.js这个上面看) 简介 tpl.js是一个比较极致(极小,极快,极简单)的js模板引擎,可以在各种js环境中使用. 特性 1. 使用js作为模板语言,几乎无学习成本 2. 小巧,速度快到极致 3. 极简的语法,模板书写非常流畅 4. mit开源,无限制 语法说明 简述 tpl.js中模板语法中以行为单一,分为js行语句,和输出行语句.顾名思义,js行语句是编译时候会当做js执行的语句, 而输出行语句,

JavaScript模板引擎使用

1. [代码]tmpl.js     // Simple JavaScript Templating// John Resig - http://ejohn.org/ - MIT Licensed(function() {var cache = {}; this.tmpl = function tmpl(str, data) { // Figure out if we're getting a template, or if we need to// load the template - an

famo.us 一个JavaScript游戏引擎初探

好久之前就看到了famo.us的优良特性,尤其是它避开浏览器弊病的跳跃思维,再加上自己使用JQM来开发Web App时的页面切换的白屏bug,又比对了sencha touch,最后还是决定将famo.us作为开发框架,它是基于浏览器的,目标就是使页面呈现性能最大化,而我不会拿它来做游戏,只是做简单的WebApp,要的就是这个界面显示性能. 但悲剧的是国内没有关于famo.us的教程,近些日子Google被天朝打压的挺惨,幸运的是famo.us官网还是可以访问的,所以以下的学习结果都来自官网htt

20 款免费的 JavaScript 游戏引擎

使用 HTML5,CSS3 和 Javascript 可以帮助面向对象开发者开发拥有各种特性的游戏,比如:3D 动画效果,Canvas,数学,颜色,声音,WebGL 等等.最明显的优势在于使用 HTML5 开发的游戏能在任何现代化流行的设备上运行. 某些游戏引擎仅仅是一个抽象的层次,就简单处理一些或者更多的繁杂游戏开发任务:其他只是注重 asset 加载,输入,物理效果,音频,sprite 地图和动画,而且相当多样化.还有一些引擎架构极其简单,只包括一个 2D 水平的编辑器和调试工具. 大部分的

java调用javascript :js引擎rhino

java调用javascript :js引擎rhino JavaJavaScriptEclipse脚本SQL 前段时间,在浏览javaeye论坛,看见有人征集如何在java中运行数学表达式.结果方案五花八门:1.jakarta commons JEXL. 2.Beanshell3.Java Math Expression Parser jep 4.parse combinator jparsec 5.jdk 6.0的 script6.利用SQL 7.自己写语法分析如果自己写语法分析,没有个200

JavaScript模板引擎学习分享

为了将数据库中的一组记录转换成HTML输出到界面上,大家都采用哪些做法呢? 在WebForm时代我们经常使用datagrid.repeater,当MVC问世后我们开始直接在视图上编写C#循环语句,而现在我更喜欢使用JavaScript模板引擎来生成HTML.因为这种做法的最大好处是实现了前后端代码的解耦,前端开发人员也无需了解太多的C#知识. 用法与示例: 第一步,在页面中引入JavaScript模板引擎: function template(str, data) { var strFunc =

如何选择Javascript模板引擎(javascript template engine)?

译者 jjfat 日期:2012-9-17  来源: GBin1.com 随着前端开发的密集度越来越高,Ajax和JSON的使用越来越频繁,大家肯定免不了在前台开发中大量的使用标签,常见到的例子如下: 你的到了一个JSON对象,如下: var data={   email: '[email protected],   gender: 'male'  } 然后你需要将json数据组织成页面内容,如下: var email, gender; email= '<div class="mail&q