认识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 可以帮 ...
随机推荐
- hive 运行sqlclient异常
FAILED: Execution Error, return code 1 from org.apache.hadoop.hive.ql.exec.DDLTask. java.lang.Runtim ...
- ThinkPHP5.0框架开发实现简单的页面跳转
ThinkPHP5.0框架开发实现简单的页面跳转 一.效果 登录界面 登录成功界面 登录失败界面 二.目录结构 三.代码 控制器中的Login.php <?php // 声明命名空间 names ...
- ES task管理
Task Management API The Task Management API is new and should still be considered a beta feature. Th ...
- VC下加载多种格式图片的方法总结IPicture, CxImage, CImage(AtlImage), CPictureEx
尽管VC有提供相应的API和类来操作bmp位图.图标和(增强)元文件,但却不支持jpg.gif和png等格式的图片,而这几种格式却是常常要用到的.这里我给大家介绍两种办法来操作这些格式的图片. 1.用 ...
- httputil用http获取请求的工具类
package com.xiaocan.demo.util; import java.io.IOException; import java.io.InputStream; import java.u ...
- Codeforces 988E. Divisibility by 25
解题思路: 只有尾数为25,50,75,00的数才可能是25的倍数. 对字符串做4次处理,以25为例. a. 将字符串中的最后一个5移到最后一位.计算交换次数.(如果没有找到5,则不可能凑出25,考虑 ...
- 命令行神器 cmder
下载地址:http://cmder.net/ 修改命令提示符λ为$ 进入解压后的 cmder 的目录,进入 vendor,打开 clink.lua 文件. 修改 local cmder_prompt ...
- mybastis_20190323
1 数据表 items.user.orders.orderdetail user id,username,birthday,sex,address; 使用原生态的jdbc的问题总结? 1 数据库链接问 ...
- csv 模块的基本使用
csv 模块专门用于读取和写入 csv 文件内容 以下主要讲在 python2 中的使用,在python3中有不同的地方,我会单独指出来 一般的excel表格可以保存为csv格式,然后就可以使用 cs ...
- iOS基础UI控件介绍-Swift版
iOS基础UI控件总结 iOS基础控件包括以下几类: 1.继承自NSObject:(暂列为控件) UIColor //颜色 UIImage //图像 2.继承自UIView: 只能相应手势UIGest ...