JS 一些概念
JS 内存机制
基本类型:
String | Boolean | Undefined | Number | Nll | Symbol
数据保存在“栈”——先进后出。
数据类型:
Array | Object | Function | Date | Error ……
数据保存在“堆”——先进先出。
要访问“堆”内存的引用数据类型时,实际上是首先从栈中获取该对象的指针,
然后再从堆内存中取的我们需要的数据。
所以说:基本类型赋值相互不影响,引用类型赋值,会影响原对象。
var arr = [1,2,3];
var arr2 = arr;
arr2[3] = 4;
console.log(arr); // arr | arr2 同指向一个内存地址
Event Loop
事件机制:所有 JS 代码运行都是放入执行栈中执行,遵循进栈和出栈,直到栈被清空。
执行栈
JS 代码在运行前都会创建执行上下文,也可以理解为执行环境,JS 中有三种执行上下文:
1、全局执行上下文,默认的,在浏览器中是 window 对象;
2、函数执行上下文,JS 的函数每当被调用时都会创建一个上下文;
3、Eval 执行上下文,eval 函数会产生自己的上下文。
常用的数据结构
数组(Array) | 栈(Stack) | 队列(Queue) | 堆(Heap) | 链表(Linked List) | 树(Tree) | 图(Graph) | 散列表(Hash)
JS 执行过程
javascript 引擎基本原理可以把JS的源代码转换成高效、优化的代码,这样就可以通过浏览器解析甚至可以被嵌入到应用当中。
javascript 的引擎作用简单来讲就是能够读懂 javascript 代码,并且准确地给出运行结果的程序。
每个 JavaScript 引擎都实现了一个版本的 ECMAScript。
为什么会有那么多引擎,因为他们每个都被设计到不同 web 浏览器或像 Node.js 那样的运行环境中——他们唯一的目标是读取和编译 javascript 代码。
常见的 javascript 引擎如下:
Mozilla 浏览器 ----> 解释引擎为 Spidermonkey(由 C 语言实现)
Chrome 浏览器 ----> 解析引擎为 V8(由 C++ 实现)
Safari 浏览器 ----> 解析引擎为 JavaScriptCode(C/C++)
IE and Edge ----> 解析引擎为 Chakra(C++)
Node.js ----> 解析引擎为 V8
浏览器常驻线程:
JS 引擎线程:负责 JS 的解析和执行;
定时触发器线程:处理定时事件,比如 setTimeout | setInterval;
事件触发线程:处理 DOM 事件;
异步 http 请求线程:处理 http 请求。
浏览器渲染引擎
Chrome | Safari | Opera —— Webkit 引擎;
IE —— Trident 引擎;
FireFox —— Gecko 引擎;
浏览器 JS 引擎
Chrome —— V8
FireFox —— SpiderMonkey
Safari —— JavaScriptCore
IE —— Chakra
预编译
1、预编译首先是全局预编译,函数体未调用时是不进行预编译的;
2、只有 var 和 function 声明会被提升;
3、在所在的作用域会被提升,不会扩展到其他的作用域;
4、预编译后会顺序执行代码;
<script>
{
consol;
console.log("代码段1");
}
{
console.log("代码段2");
}
console.log("上面有语法出错,这里<script>的代码段都不能运行了");
</script>
<script>
console.log("下一个<script>代码段能执行,不受上面影响");
</script>
作用域
ES5 的 var 在 if 和 for 没有块级作用域概,所以很多时候需要借助 function 的作用域来解决应用外面变量问题。
ES6 加入 let, let 有 if 和 for 块级作用域。