前端培训-中级阶段(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 中是不存在的。 没有浏览器提供的 documentwindow、以及所有其他的对象。


  1. 在浏览器中,不存在 Node.js 通过其模块提供的 API,例如文件系统访问功能。


  1. 在 Node.js 中,可以控制运行环境。 除非构建的是任何人都可以在任何地方部署的开源应用程序,否则你能知道会在哪个版本的 Node.js 上运行该应用程序。 与浏览器环境(你无法选择访客会使用的浏览器)相比起来,这非常方便。


  1. 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 中使用


bVbO8o6.webp.jpg



相关文章
|
2月前
|
JavaScript 前端开发 程序员
前端学习笔记——node.js
前端学习笔记——node.js
45 0
|
2月前
|
前端开发 JavaScript 程序员
【从前端入门到全栈】Node.js 之核心概念
【从前端入门到全栈】Node.js 之核心概念
|
2月前
|
Web App开发 JavaScript 前端开发
前端Node.js面试题
前端Node.js面试题
|
2月前
|
Web App开发 JavaScript 前端开发
对于 前端 解释下 node.js的必要性
对于 前端 解释下 node.js的必要性
37 0
|
3月前
|
JSON 前端开发 JavaScript
socket.io即时通信前端配合Node案例
本文介绍了如何使用socket.io库在Node.js环境下实现一个简单的即时通信前端配合案例,包括了服务端和客户端的代码实现,以及如何通过socket.io进行事件的发送和监听来实现实时通信。
45 2
|
3月前
|
存储 JSON 前端开发
node使用token来实现前端验证码和登录功能详细流程[供参考]=‘很值得‘
本文介绍了在Node.js中使用token实现前端验证码和登录功能的详细流程,包括生成验证码、账号密码验证以及token验证和过期处理。
56 0
node使用token来实现前端验证码和登录功能详细流程[供参考]=‘很值得‘
|
3月前
|
前端开发 JavaScript
node接收前端上传的图片,单文件、多文件同name、多文件不同name
本文介绍了在Node.js中使用multer模块接收前端上传的图片,包括单文件上传、多文件上传(同name和不同name)以及任意类型文件上传的方法。
84 0
|
4月前
|
JavaScript 前端开发 关系型数据库
前端node学习路线
【8月更文挑战第21天】前端node学习路线
57 8
|
4月前
|
JSON JavaScript 前端开发
JS的无限可能: 前端 精妙DOM技巧至Node.js的服务端
JS的无限可能: 前端 精妙DOM技巧至Node.js的服务端
|
4月前
|
数据采集 资源调度 JavaScript
Node.js 适合做高并发、I/O密集型项目、轻量级实时应用、前端构建工具、命令行工具以及网络爬虫和数据处理等项目
【8月更文挑战第4天】Node.js 适合做高并发、I/O密集型项目、轻量级实时应用、前端构建工具、命令行工具以及网络爬虫和数据处理等项目
62 5