认识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.读代码(逐行读取从上到下)
当预解析完毕就开始读取代码:读取代码的时候遇到变量的 表达式:= + - * / % ++ -- ! 参数…… 表达式可以修改预解析的值! 就会到自己的仓库里面查看是否有这个变量,并修改其仓库里面的变量值。
三点:面试题问答
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的更多相关文章
- 推荐13款javascript模板引擎
javaScript 在生成各种页面内容时如果能结合一些模板技术,可以让逻辑和数据之间更加清晰,本文介绍 X 款 JavaScript 的模板引擎.(排名不分先后顺序) 1. Mustache 基于j ...
- 各种JS模板引擎对比数据(高性能JavaScript模板引擎)
最近做了JS模板引擎测试,拿各个JS模板引擎在不同浏览器上去运行同一程序,下面是模板引擎测试数据:通过测试artTemplate.juicer与doT引擎模板整体性能要有绝对优势: js模板引擎 Ja ...
- JavaScript模板引擎artTemplate.js——为什么使用模板引擎?
作为一个工作一年的菜鸟,在公司做了几个外包项目,也接触到了不同形式的web开发.其实也没多少,就是javaweb开发和HTML5移动开发,这两者在页面展示的时候的解决方案还是有所不同的. 1.vo+e ...
- 最简单的JavaScript模板引擎
在小公司待久了感觉自己的知识面很小,最近逛博客园和一些技术网站看大家在说JavaScript模版引擎的事儿,完全没有概念,网上一搜这是08年开始流行起来的...本来以为这是很高深的知识,后来在网上看到 ...
- 简单JavaScript模版引擎优化
在上篇博客最简单的JavaScript模板引擎 说了一下一个最简单的JavaScript模版引擎的原理与实现,作出了一个简陋的版本,今天优化一下,使之能够胜任日常拼接html工作,先把上次写的模版函数 ...
- JavaScript模板引擎实例应用
在之前的一篇名为<移动端基于HTML模板和JSON数据的JavaScript交互>的文章中,我向大家说明了为什么要使用JavaScript模板以及如何使用,文末还提到了laytpl.art ...
- JavaScript 模板引擎实现原理解析
1.入门实例 首先我们来看一个简单模板: <script type="template" id="template"> <h2> < ...
- Javascript模板引擎mustache.js详解
mustache.js是一个简单强大的Javascript模板引擎,使用它可以简化在js代码中的html编写,压缩后只有9KB,非常值得在项目中使用.本文总结它的使用方法和一些使用心得,内容不算很高深 ...
- Popmotion – 小巧,灵活的 JavaScript 运动引擎
Popmotion 是一个只有12KB的 JavaScript 运动引擎,可以用来实现动画,物理效果和输入跟踪.原生的DOM支持:CSS,SVG,SVG路径和DOM属性的支持,开箱即用.Popmoti ...
- 20个免费的 JavaScript 游戏引擎分享给开发者
这篇文章收集了20个免费的 JavaScript 游戏引擎分享给开发者.这些游戏引擎能够帮助游戏开发人员更快速高效的开发出各种好玩的游戏. 使用 HTML5.CSS3 和 Javascript 可以帮 ...
随机推荐
- HDOJ find the safest road 1596【最短路变形】
find the safest road Time Limit: 10000/5000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Ot ...
- RSA in .net and dotnet core
dotnet RSAParameters Struct https://docs.microsoft.com/zh-cn/dotnet/api/system.security.cryptography ...
- 93.快速搭建Web环境 Angularjs + Express3 + Bootstrap3
转自:https://www.cnblogs.com/wawahaha/p/3946023.html 前言 Angularjs越用越顺手,不仅代码量比jQuery少很多,而且实现思路特别清晰,构建大型 ...
- (转载)打开一个本地apk进行安装
1 2 3 4 5 6 Intent intent = new Intent(); intent.setAction(Intent.ACTION_VIEW); File file = new File ...
- 【原创】查询占CPU高的oracle进程
1:首先使用TOP命令传到占用CPU高的SPID号 PID USERNAME THR PRI NICE SIZE RES STATE TIME CPU COMMAND3575 oracle 1 12 ...
- uva 11584 - 字符串 dp
题目链接 一个长度1000的字符串最少划分为几个回文字符串 ---------------------------------------------------------------------- ...
- shell脚本执行的三种方式
(1) bash script_name 或 sh script_name 推荐使用此方法,script_name 不需要执行权限亦可执行. (2) path/script_name 或 ...
- 使用3ds Max制作卡通狗教程
使用软件::3ds Max 软件下载:http://www.xy3dsmax.com/xiazai.html 全教程完,学完记得交作业.如果本教程对您有所帮助,请推荐给你的朋友. 全教程完,学完记得交 ...
- ZBrush中独特功能Projection Master
Projection Master可以理解为投影大师,它是ZBrush®的一个独特功能,该功能可以让用户使用所有的2D和2.5D笔刷工具在3D模型上进行雕刻.纹理绘制和其他的操作. 简单来说,Proj ...
- 用SqlDataReader返回多个结果集
using System; using System.Data; using System.Data.SqlClient; namespace Northwind { class Program { ...