参照教程：
coderwhy - 深刻Node.js技术栈

浏览器内核是什么？

咱们常常会说：不同的浏览器有不同的内核组成

  • Gecko：晚期被Netscape和Mozilla Firefox浏览器应用；
  • Trident：微软开发，被IE4~IE11浏览器应用，然而Edge浏览器曾经转向Blink；
  • Webkit：苹果基于KHTML开发、开源的，用于Safari，Google Chrome之前也在应用；
  • Blink：是Webkit的一个分支，Google开发，目前利用于Google Chrome、Edge、Opera等；

事实上，咱们常常说的浏览器内核指的是浏览器的排版引擎：

  • 排版引擎（layout engine），也称为浏览器引擎（browser engine）
  • 页面渲染引擎（rendering engine） 或样版引擎

渲染引擎工作的过程

  • 然而在这个执行过程中，HTML解析的时候遇到了JavaScript标签，应该怎么办呢？

    • 会进行解析HTML，而去加载和执行JavaScript代码；

  • 为什么不间接异步去加载执行JavaScript代码，而要在这里进行掉呢？

    • 因为JavaScript代码能够操作咱们的DOM；所以浏览器心愿将HTML解析的DOM和JavaScript操作之后的DOM放到一起来生成最终的DOM树，而不是 频繁的去生成新的DOM树；

  • JavaScript代码由谁来执行呢？

    • JavaScript引擎

JavaScript引擎

为什么须要JavaScript引擎呢？

  • 事实上咱们编写的JavaScript无论你交给浏览器或者Node执行，最初都是须要被CPU执行的；
  • 然而CPU只意识本人的指令集，实际上是机器语言，能力被CPU所执行；

  • 所以咱们须要JavaScript引擎帮忙咱们将JavaScript代码翻译成CPU指令来执行；

    比拟常见的JavaScript引擎有哪些呢？

  • SpiderMonkey：第一款JavaScript引擎，由Brendan Eich开发（也就是JavaScript作者）；
  • Chakra：微软开发，用于IT浏览器；
  • JavaScriptCore：WebKit中的JavaScript引擎，Apple公司开发；
  • V8：Google开发的弱小JavaScript引擎，也帮忙Chrome从泛滥浏览器中怀才不遇；

WebKit内核

WebKit事实上由两局部组成的：

  • WebCore：负责HTML解析、布局、渲染等等相干的工作；
  • JavaScriptCore：解析、执行JavaScript代码；
在小程序中编写的JavaScript代码就是被JSCore执行的；

V8引擎

  • V8是用C ++编写的Google开源高性能JavaScript和WebAssembly引擎，它用于Chrome和Node.js等。
  • 它实现ECMAScript和WebAssembly，并在Windows 7或更高版本，macOS 10.12+和应用x64，IA-32， ARM或MIPS处理器的Linux零碎上运行。
  • V8能够独立运行，也能够嵌入到任何C ++应用程序中。

V8引擎的原理

Parse模块会将JavaScript代码转换成AST（形象语法树），这是因为解释器并不间接意识JavaScript代码；

Ignition是一个解释器，会将AST转换成ByteCode（字节码）

TurboFan是一个编译器，能够将字节码编译为CPU能够间接执行的机器码；

Orinoco模块，负责垃圾回收，将程序中不须要的内存回收；

Node.js是什么

也就是说Node.js基于V8引擎来执行JavaScript的代码，然而不仅仅只有V8引擎：

  • 后面咱们晓得V8能够嵌入到任何C ++应用程序中，无论是Chrome还是Node.js，事实上都是嵌入了V8引擎 来执行JavaScript代码；
  • 然而在Chrome浏览器中，还须要解析、渲染HTML、CSS等相干渲染引擎，另外还须要提供反对浏览器操作 的API、浏览器本人的事件循环等；
  • 另外，在Node.js中咱们也须要进行一些额定的操作，比方文件系统读/写、网络IO、加密、压缩解压文件等 操作；

浏览器和Node.js架构区别

Node.js架构

  • 咱们编写的JavaScript代码会通过V8引擎，再通过Node.js的Bindings，将工作放到Libuv的事件循环中；
  • libuv（Unicorn Velociraptor—独角伶盗龙）是应用C语言编写的库；
  • libuv提供了事件循环、文件系统读写、网络IO、线程池等等内容；

Node.js的利用场景

  • 目前前端开发的库都是以node包的模式进行治理；
  • npm、yarn工具成为前端开发应用最多的工具；
  • 越来越多的公司应用Node.js作为web服务器开发；
  • 大量我的项目须要借助Node.js实现前后端渲染的同构利用；
  • 资深前端工程师须要为我的项目编写脚本工具（前端工程师编写脚本通常会应用JavaScript，而不是Python或者shell）；
  • 很多企业在应用Electron来开发桌面应用程序；

Node的版本工具

  • nvm：Node Version Manager；曾经能够在Windows应用
  • n：Interactively Manage Your Node.js Versions（交互式治理你的Node.js版本）

Node的REPL

REPL是Read-Eval-Print Loop的简称，翻译为“读取-求值-输入”循环；REPL是一个简略的、交互式的编程环境；

事实上，咱们浏览器的console就能够看成一个REPL。Node也给咱们提供了一个REPL环境，咱们能够在其中演练简略的代码。

Node程序传递参数

在某些状况下执行node程序的过程中，咱们可能心愿给node传递一些参数：

node index.js env=development coderwhy

如果咱们这样来应用程序，就意味着咱们须要在程序中获取到传递的参数：获取参数其实是在process的内置对象中的；

argv属性中蕴含了咱们须要的参数

非凡的全局对象

这些全局对象能够在模块中任意应用，然而在命令行交互中是不能够应用的；

  • __dirname：获取以后文件所在的门路
  • __filename：获取以后文件所在的门路和文件名称、

常见的全局对象

process对象：process提供了Node过程中相干的信息：

  • 比方Node的运行环境、参数信息等

console对象：提供了简略的调试控制台，在后面解说输出内容时曾经学习过了。

定时器函数：在Node中应用定时器有好几种形式：

  • setTimeout(callback, delay[, ...args])：callback在delay毫秒后执行一次；
  • setInterval(callback, delay[, ...args])：callback每delay毫秒反复执行一次；
  • setImmediate(callback[, ...args])：callbackI / O事件后的回调的“立刻”执行；
  • process.nextTick(callback[, ...args])：增加到下一次tick队列中；

global是一个全局对象，事实上前端咱们提到的process、console、setTimeout等都有被放到global中

global和window的区别

在浏览器中，全局变量都是在window上的，比方有document、setInterval、setTimeout、alert、console等等

在Node中，咱们也有一个global属性，并且看起来它外面有很多其余对象。

然而在浏览器中执行的JavaScript代码，如果咱们在顶级范畴内通过var定义的一个属性，默认会被增加到window 对象上

然而在node中，咱们通过var定义一个变量，它只是在以后模块中有一个变量，不会放到全局中