前端工程化
全部武装：通过工程化提升[战斗力]
什么是工程？
工程就是一个项目(例如：一个网站或APP)
一个工程的生命周期
工程立项
需求分析
产品原型
开发实施
测试部署
上线运行
什么是工程化？
工程化就是完成项目过程中，用到的各种工具和技术。
什么是前端工程化？
前端工程化就是通过各种工具和技术，提升前端开发效率的过程。
前端工程化的内容：各种工具和技术
脚手架工具
压缩工具
自动化工具
转换工具
格式化工具
前端工程化的作用
通过使用工具，提升开发效率
总结
学习前端工程化，就是学习使用各种工具，解决前端开发中的各种问题。
前端工程化解决的问题
项目上线前，压缩代码
对ES6+或CSS3新特性进行转换
想要使用Less增强CSS的编程性，但是浏览器不能直接支持Less(没有Less引擎，只有css)
格式化代码（多人协作开发，代码风格无法统一）
Node.js
前端工程化的基础
node.js基础
Node.js的作者是Ryan Dahl(瑞安 达尔)
什么是node.js?
Node.js官网：node.js.org
javaScript运行环境
浏览器就是JavaScript的一个运行环境
node.js是基于Chrome V8引擎的。
如下图所示: node.js是除了浏览器之外，可以运行JavaScript的环境。
javaScript的发展
1995：浏览器（javaScript）
2009: Node.js(javaScript)
浏览器的组成
如下图所示
浏览器内核的组成
浏览器内核的组成(详细)
主流浏览器内核
软件架构
操作系统
运行环境
编程语言
框架
软件架构对应的Web应用
软件架构对应的Web应用 的比喻
总结
node.js既不是一门新的语言，也不是JavaScript框架，而是一个运行环境。
node.js可以做什么
node.js给 JavaScript 插上了全栈编程的翅膀
JavaScript的作用
浏览器（JavaScript），负责前端的功能
Node.js（JavaScript）,负责后端的功能
浏览器端的JavaScript
响应浏览器事件
数据验证
DOM操作
等等....
不能做文件操作
Node端的JavaScript
Node.js适合：用于开发前端方向的各种工具
各种前端工程化工具
Node.js适合：开发服务器端的应用层（BFF）
为网站、APP、小程序等提供数据服务
Node.js可以用来做桌面应用开发
各种跨平台的桌面应用（vscode、typora、insomnia）
Node.js APIs
对比
JavaScript的web组成
JavaScript的node组成
两者之间的交集
大体上看
细分
安装node.js
在官网下载Node.js安装包
双击安装，一路next安装
命令行中验证安装是否成功
打开命令行：win+r之后，输入cmd回车
命令行中输入：node -v
命令行输出版本号，表示安装成功
使用Node.js
通过 Node.js 运行JavaScript代码
Node.js有两种模式运行JavaScript
脚本模式
> node path/filename.js(回车)复制代码
交互模式
进入交互模式 > node(回车)
运行代码 > js代码(回车)
退出交互模式 > .exit 或 按两次ctrl+c
Node.js下运行JavaScript 快捷操作
在命令行中使用code .可以在vscode中打开当前文件夹。
ctrl + ` 打开编辑器的命令行
脚本模式
交互模式(REPL)
使用tab键自动补全
探索JavaScript对象（例如：Math.然后按两次tab键）
点命令（例如：输入.help然后回车）
全局对象
Node.js下的全局对象是 global
浏览器端的js中，全局对象是 window
Node.js下的全局对象是 global
在交互模式下，声明的变量和函数都属于global
在脚本模式下，声明的变量和函数不属于global
在node.js中不能访问window(浏览器的全局对象)
延伸：不仅不能访问window，document\location等也不能访问，其只能访问两者之间的交集部分。
全局函数
Node.js下的全局函数
javaScript语言提供的全局函数，在node.js下依然可用。
parseInt/parseFloat/isNaN/isFinite/eval...
一次性定时器（setTimeout / clearTimeout） -> 定时炸弹
周期性定时器（setInterval / clearInterval） -> 闹钟
Node.js环境也提供了一些全局函数
立即执行定时器（setImmediate / clearImmediate）
进程立即执行定时器（process.nextTick）
同步与异步
主程序（单线程）
事件队列
如图所示(nextTick事件在主程序之后执行，而setImmediate是在事件队列开头执行的)
