常用概念
- 闭包、原型
- 类、继承
- MVC、Flux
- 高阶函数
- 前端工程化
JS 引擎
JS 引擎举例
- Chrome 用的是 V8 引擎，C++ 编写
- 网景用的是 SpiderMonkey，后被 Firefox 使用，C++
- Safari 用是的 JavaScriptCore
- IE 用的是 Chakra（JScript9）
- Edge 用的是 Chakra（JavaScript）
- Node.js 用的是 V8 引擎
主要功能
- 编译：把 JS 代码翻译为机器能执行的字节码或机器码
- 优化：改写代码，使其更高效
- 执行：执行上面的字节码或者机器码
- 垃圾回收：把 JS 用完的内存回收，方便之后再次使用
执行 JS 代码
准备工作
- 提供 API：window/document/setTimeout
- 这些功能称为运行环境 runtime env
- 一旦把 JS 放进页面，就开始执行 JS
JS 内存图
图片来源：饥人谷
红色区域
- 作用
- 专门用来存放数据
- 红色区域并不存变量名，变量名在“不知什么区”
- 每种浏览器的分配规则不一样
- Stack 和 Heap
- 红色区域分为 Stack 栈 和 Heap 堆
- Stack区特点：每个数据顺序存放
- Heap区特点：每个数据随机存放
- 规律
- 数据分两种：非对象和对象
- 非对象都存在 Stack
- 对象都存在 Heap
- = 号总是会把右边的东西复制到左边（不存在什么传值和传址）
JS 入门三座大山之原型
浏览器在 JS 执行之前自带
- window
- console
- document
- 对象(object)
var person = {} 等价于 var person = new Object()
- 数组(Array)
var a = [1,2,3] 等价于 var a = new Array(1,2,3)
- 函数(Function)
function f(){} 等价于 var f = new Function()
window 在内存图中
图片来源：饥人谷
- 指针/引用的意思：保存地址
- 查看函数结构：
console.dir(window.Object)
细节
- 关于 window
- window变量 和 window对象 是两个东西
- window变量 是一个容器，存放 window对象的地址
- window对象 是Heap 里的一坨数据
- 同理
- console 和 console对象 不是同一个东西
- Object 和 Object函数对象 不是同一个东西
- 前者是内存地址，后者是一坨内存
JS 原型链
图片来源：饥人谷
注意
- obj 有一个隐藏属性
- 隐藏属性存储了 Object.prototype 对象的地址
- obj.toString() 发现 obj 上没有 toStrong
- 就去隐藏属性对应的对象里面找
- 于是就找到了 Object.prototype.toString
prototype 和 __proto___的区别
- 都存着原型的地址
- prototype 挂在函数上
- __proto__ 挂在每个新生成的对象上
