前端工程化(一)(精品、面试必备基础)(春招、秋招)

Node.js 开发

Node.js 是什么?

Node.js是一个基于V8 JavaScript引擎的JavaScript 运行时环境
也就是说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: 是使用C语言编写的库
libuv提供了事件循环、文件读写系统、网络IO…

Node 的应用场景

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

Node 安装和管理

Node.js是在2009年诞生的

• LTS版本：（Long-term support, 长期支持）相对稳定一些，推荐线上环境使用该版本；
• Current版本：最新的Node版本，包含很多新特性；
  如何选择?
• 如果你是学习使用，可以选择current版本；
• 如果你是公司开发，建议选择LTS版本（面向工作，选择LTS版本）；
  安装
• window选择.msi安装包，Mac选择.pkg安装包，Linux会在后续部署中讲解；
• 安装过程中会配置环境变量（让我们可以在命令行使用）；
• 并且会安装npm（Node Package Manager）工具；

Node 的版本工具

如果你希望通过可以快速更新或切换多个版本时，可以借助于一些工具：

• nvm：Node Version Manager；
• n：Interactively Manage Your Node.js Versions（交互式管理你的Node.js版本）

注意: 上面两个都不支持 window 系统
解决方法:

• 针对nvm，在GitHub上有提供对应的window版本：https://github.com/coreybutler/nvm-windows
• 通过 nvm install latest 安装最新的node版本
• 通过 nvm list 展示目前安装的所有版本
• 通过 nvm use 切换版本
  

JavaScript 代码执行

如果我们希望把js文件交给node执行：
首先电脑上需要安装Node.js环境，安装过程中会自动配置环境变量；
可以通过终端命令node js文件的方式来载入和执行对应的js文件；

node 文件名.js

Node 的输入和输出

输入

正常情况下执行一个node程序，直接跟上我们对应的文件即可：

node index.js

但是，在某些情况下执行node程序的过程中，我们可能希望给node传递一些参数：

node index.js env=development coderwhy

输出

console.log() // 输出
console.clear() // 清空
console.trace() // 调用栈

更多可以点击官方文档

Node程序传递参数

例子:

console.log("process 是 进程的意思")
console.log("argv: argument vector 的缩写")
console.log(process.argv)

运行结果

我们可以发现argv是一个数组包含有node路径以及js路径, 后面存储传入的参数
下面通过 forEach() 进行打印

console.log("process 是 进程的意思")
console.log("argv: argument vector 的缩写")
console.log(process.argv)
process.argv.forEach(element => {
    console.log(element)
});

Node 的 REPL

REPL是Read-Eval-Print Loop的简称，翻译为“读取-求值-输出”循环；
REPL是一个简单的、交互式的编程环境；
事实上，我们浏览器的console就可以看成一个REPL。

在命令行中, 直接输入 node 即可进入
如果想退出,按两次 Ctrl + C

Node 的全局对象

模块中变量(全局变量)

__dirname, __filename, export, module.require()

举例

console.log(__dirname )
console.log(__filename)

运行结果

常见的全局变量
process对象：process提供了Node进程中相关的信息：
比如Node的运行环境、参数信息等
后面在项目中，我也会讲解，如何将一些环境变量读取到 process 的 env 中；
console对象：提供了简单的调试控制台，在前面讲解输入内容时已经学习过了。
更加详细的查看官网文档：https://nodejs.org/api/console.html
定时器函数：在Node中使用定时器有好几种方式：
setTimeout(callback, delay[, …args])：callback在delay毫秒后执行一次；
setInterval(callback, delay[, …args])：callback每delay毫秒重复执行一次；
setImmediate(callback[, …args])：callbackI / O事件后的回调的“立即”执行；
process.nextTick(callback[, …args])：添加到下一次tick队列中；

global 和 window 的区别

在浏览器中，全局变量都是在window上的，比如有document、setInterval、setTimeout、alert、console等等
在Node中，我们也有一个global属性，并且看起来它里面有很多其他对象。
在node中, var 定义的变量, 不会放在全局(和 浏览器有所区别)

var name = '爱敲代码的小黑'
console.log(globalThis.name)
console.log(global.name)
console.log(globalThis == global)

运行结果

这些全局对象，我们并不需要从一开始全部一个个学习；
某些重要的全局对象, 我将会在模块化篇章总结归纳,喜欢的话,记得关注订阅!!!Thanks♪(･ω･)ﾉ