前言:

一:每一款浏览器里面都能执行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.读代码(逐行读取从上到下)

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

三点:面试题问答

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

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

  1. 推荐13款javascript模板引擎

    javaScript 在生成各种页面内容时如果能结合一些模板技术,可以让逻辑和数据之间更加清晰,本文介绍 X 款 JavaScript 的模板引擎.(排名不分先后顺序) 1. Mustache 基于j ...

  2. 各种JS模板引擎对比数据(高性能JavaScript模板引擎)

    最近做了JS模板引擎测试,拿各个JS模板引擎在不同浏览器上去运行同一程序,下面是模板引擎测试数据:通过测试artTemplate.juicer与doT引擎模板整体性能要有绝对优势: js模板引擎 Ja ...

  3. JavaScript模板引擎artTemplate.js——为什么使用模板引擎?

    作为一个工作一年的菜鸟,在公司做了几个外包项目,也接触到了不同形式的web开发.其实也没多少,就是javaweb开发和HTML5移动开发,这两者在页面展示的时候的解决方案还是有所不同的. 1.vo+e ...

  4. 最简单的JavaScript模板引擎

    在小公司待久了感觉自己的知识面很小,最近逛博客园和一些技术网站看大家在说JavaScript模版引擎的事儿,完全没有概念,网上一搜这是08年开始流行起来的...本来以为这是很高深的知识,后来在网上看到 ...

  5. 简单JavaScript模版引擎优化

    在上篇博客最简单的JavaScript模板引擎 说了一下一个最简单的JavaScript模版引擎的原理与实现,作出了一个简陋的版本,今天优化一下,使之能够胜任日常拼接html工作,先把上次写的模版函数 ...

  6. JavaScript模板引擎实例应用

    在之前的一篇名为<移动端基于HTML模板和JSON数据的JavaScript交互>的文章中,我向大家说明了为什么要使用JavaScript模板以及如何使用,文末还提到了laytpl.art ...

  7. JavaScript 模板引擎实现原理解析

    1.入门实例 首先我们来看一个简单模板: <script type="template" id="template"> <h2> < ...

  8. Javascript模板引擎mustache.js详解

    mustache.js是一个简单强大的Javascript模板引擎,使用它可以简化在js代码中的html编写,压缩后只有9KB,非常值得在项目中使用.本文总结它的使用方法和一些使用心得,内容不算很高深 ...

  9. Popmotion – 小巧,灵活的 JavaScript 运动引擎

    Popmotion 是一个只有12KB的 JavaScript 运动引擎,可以用来实现动画,物理效果和输入跟踪.原生的DOM支持:CSS,SVG,SVG路径和DOM属性的支持,开箱即用.Popmoti ...

  10. 20个免费的 JavaScript 游戏引擎分享给开发者

    这篇文章收集了20个免费的 JavaScript 游戏引擎分享给开发者.这些游戏引擎能够帮助游戏开发人员更快速高效的开发出各种好玩的游戏. 使用 HTML5.CSS3 和 Javascript 可以帮 ...

随机推荐

  1. Android圆形图片--自己定义控件

    Android圆形图片控件效果图例如以下: 代码例如以下: RoundImageView.java package com.dxd.roundimageview; import android.con ...

  2. iOS-UITextField 全面解析

    iOS中UITextField 使用全面解析 建议收藏,用到的时候来这里一查就都明白了 //初始化textfield并设置位置及大小 UITextField *text = [[UITextField ...

  3. http_build_query 字符串拼接

    http_build_query 字符串拼接 产生一个urlencode之后的请求字符串. 1.将数组转化成url问号(?)后的字符串 <?php $date=array( 'name'=> ...

  4. 优动漫PAINT-草地教程

    非常实用的草地教程,是场景控们绝对要学会的绘画技巧~更有配套草地笔刷~让场景绘画更简易~ 教程是简单,呃.... 没有优动漫PAINT软件肿么办? 别着急,╭(╯^╰)╮ 小编给你送来了 齐全的哟? ...

  5. 利用SignalR来同步更新Winfrom

    之前写了个用Socket来更新多个Winfrom的试例,这两天看了下SignalR,也用这个来试一下 SignalR 地址:https://www.asp.net/signalr 我这个也是基于 ht ...

  6. FCC高级编程篇之Validate US Telephone Numbers

    Validate US Telephone Numbers Return true if the passed string is a valid US phone number. The user ...

  7. Django REST framework 自定义字段

    自定义字段 继承 Field 类 覆盖父类中的方法 to_representation() 调用该方法将初始数据类型转换为基本的可序列化数据类型 to_internal_value() 调用该方法将原 ...

  8. git 常用操作命令行

    mkdir files : 创建一个名字为files的文件夹 cd files : 切换目录到files pwd ; 显示当前所在目录 ls -ah : 查看本地隐藏不可见的文件夹 git init ...

  9. 永远不要在MySQL中使用“utf8”

    最近我遇到了一个 bug,我试着通过 Rails 在以“utf8”编码的 MariaDB 中保存一个 UTF-8 字符串,然后出现了一个离奇的错误: Incorrect string value: ‘ ...

  10. 【BZOJ 1257】[CQOI2007]余数之和

    [链接] 我是链接,点我呀:) [题意] 在这里输入题意 [题解] k%i=k-(k/i)i 则∑k%i = nk-∑(k/i)*i 因为k/i是整除运算. 所以会有某一段连续的i,它们的k/i的值都 ...