前端培训-中级阶段（44）- node 10.x 介绍及使用

前端最基础的就是 HTML+CSS+Javascript。掌握了这三门技术就算入门，但也仅仅是入门，现在前端开发的定义已经远远不止这些。前端小课堂（HTML/CSS/JS），本着提升技术水平，打牢基础知识的中心思想，我们开课啦（每周四）。

Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行时环境。 是一个事件驱动 I/O 服务端 JavaScript 环境，基于 Google 的 V8 引擎，V8 引擎执行 Javascript 的速度非常快，性能非常好。

支持 windows、linux、macOS、Docker 镜像。

Node.js 与浏览器的区别

1. 在浏览器中，大多数时候做的是与 DOM 或其​​他 Web 平台 API（例如 Cookies）进行交互。 当然，那些在 Node.js 中是不存在的。 没有浏览器提供的 document、window、以及所有其他的对象。
2. 在浏览器中，不存在 Node.js 通过其模块提供的 API，例如文件系统访问功能。
3. 在 Node.js 中，可以控制运行环境。 除非构建的是任何人都可以在任何地方部署的开源应用程序，否则你能知道会在哪个版本的 Node.js 上运行该应用程序。 与浏览器环境（你无法选择访客会使用的浏览器）相比起来，这非常方便。
4. Node.js 使用 CommonJS 模块系统，而在浏览器中，则还正在实现 ES 模块标准。
   在实践中，这意味着在 Node.js 中使用 require()，而在浏览器中则使用 import。

当然，如果你不想看上面那些内容，我们可以看下面的表格

特性	Node	浏览器	备注
顶级对象	global	window
AJAX	require('http')	XMLHttpRequest	可以考虑使用 axios 跨平台
文件系统	require('fs')	×	听说 chrome 要加，没仔细研究如何保证安全
模块系统	CommonJS，require()	ES，import	babel 在手，都是小问题
运行环境	服务器	客户端	其实环境的问题还是存在的
HTML、HTML5、css、css3	×	√
事件循环	√，和浏览器的不一致，node 自己也修改过	√，基本上各个厂商的能保持一致
流概念、二进制数据	√，Buffer，Stream	√，Blob，ArrayBuffer

Node 可以做什么？

web 服务器

启动一个 web 服务器

// 依赖 http 模块创建 web 服务器
const http = require('http')

// 设置监听的端口
const hostname = '127.0.0.1'
const port = 3000

// 创建一个 web 服务
const server = http.createServer((req, res) => {
 res.statusCode = 200
 // 注意一下编码问题哟
 res.setHeader('Content-Type', 'text/plain; charset=UTF-8')
 res.end('你好，欢迎访问 https://www.lilnong.top')
})

// 使用上面设置好的端口监听
server.listen(port, hostname, () => {
 console.log(`服务器运行在 http://${hostname}:${port}/`)
})

脚本程序

获取当前目录下面的所有 json 文件，进行处理 node app.js

// app.js 文件
const fs = require("fs");
const path = require('path');
const readDir = (entry, paths = []) => {
    const dirInfo = fs.readdirSync(entry);
    dirInfo.forEach(item=>{
        const location = path.join(entry,item);
        const info = fs.statSync(location);
        if(info.isDirectory()){
            console.log(`dir:${location}`);
            readDir(location, [item]);
        }else{
            if(/.json$/.test(location)){
                // readFile(location, paths)
            }
        }
    })
}
// console.log('__dirname', __dirname)
readDir(__dirname);

交互式使用

上面的代码我们可以直接在 cmd 中使用

微信公众号：前端linong

参考文献

1. 前端培训目录、前端培训规划、前端培训计划