1.JavaScript 模块化规范
-
浏览器环境
- AMD
- Asynchronous Module Definition
- RequireJS
- CMD
- Common Module Definition
- SeaJS
- AMD
-
Node 环境
- CommonJS
- Node.js
- CommonJS 是一个社区,该社区为 JavaScript 没有触及到的领域指定了很多的规范(社区制定的)
- JavaScript 模块化、IO操作、网络编程、二进制操作
- CommonJS
-
ECMAScript(任何环境都可以)
- ECMAScript 6、ECMAScript 2015
- ECMAScript Module 定义规范
export
关键字用于导出接口import
关键字用于加载模块接口- 在最新版的 Node 中,对 ES6 中模块系统还没有支持,但是可以通过
babel
等相关工具转换使用
-
UMD
- Universal Module Definition 通用模块定义规范
- UMD 不是任何模块规范,也不是模块加载器
- 一个模块既兼容 AMD 、CMD、CommonJS、 ECMAScript 6 那这个模块就是一个 UMD 模块
- 目的是为了在任何模块加载器中都可以直接加载
- 一般是做一些前后端模块共用的,不涉及具体环境依赖的API,例如
underscore
、moment
就是一个典型的例子
2.Node.js 介绍
以下简称 Node。
划时代意义的 Node ,开启了大前端时代 node 让前端进入了工业自动化时代 node 还让原来的小前端可以有机会踏入后端开发领域,使用 JavaScript 语言进行服务器编程 总而言之:学习了 Node ,就开启了前端工程师的 全栈开发 之旅
2.1 客户端和服务器
2.2 几个问题
-
什么是 JavaScript
- 一种运行在浏览器端的脚本语言。
- JavaScript + DOM + BOM
- ECMAScript + W3C
- ECMAScript + BOM + DOM
- BOM和DOM等都是浏览器环境提供的接口API,供 JavaScript 语言来调用。
-
JavaScript 和 ECMAScript 是什么关系
- ECMAScript 是 JavaScript 语言的标准规范
- var、if-else、for、Object、Array、String。。。
- JavaScript 是 ECMAScript 标准规范的一个实现
- ECMAScript 是 JavaScript 语言的标准规范
-
浏览器和 JavaScript 是什么关系
- JavaScript 是运行在浏览器环境中的
- 寄宿关系
- 浏览器就是 JavaScript 的一个执行环境
-
浏览器中的 JavaScript 可以做什么
- DOM操作、表单验证、动画、ajax 请求
-
从功能角度 浏览器中的 JavaScript 和其它语言有什么差别
- 弱类型
- 浏览器中的 JavaScript 专注于处理 GUI 编程(图形界面)
- 文件操作
- HTML5中有一个 FileReader(只能读取用户通过file类型的input标签选择的文件)
- 浏览器中的 JavaScript 没有主动操作文件的权限
- 网络IO
- 接收网络中传输过来的数据,处理网络中传输过来的数据,发对方发送响应
-
ECMAScript 只可以运行在浏览器中吗
- JavaScript 不仅仅可以运行在浏览器环境中
- 也可以运行在别的环境、平台
2.3 什么是Node
-
Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine.
- NodeJS 是一个构建与 Chrome V8 JavaScript 解析引擎之上的一个运行时环境
- Chrome V8 开源的
- Chrome V8 引擎在所有浏览器的 JavaScript 解析引擎中是最快的
- 维基百科 - JavaScript引擎
-
Node.js uses an event-driven, non-blocking I/O model that makes it lightweight and efficient.
- event-driven:事件驱动
- non-blocking I/O model:非阻塞IO模型
- lightweight and efficient:轻量和高效
- Node 本身知识提供了一些系统级别操作API
-
Node.js' package ecosystem, npm, is the largest ecosystem of open source libraries in the world.
- package ecosystem, npm:包管理系统 npm
- largest ecosystem of open source libraries in the world.
- 目前世界上最大的开源库生态系统
- 50W + 就好比 Sublime编辑器一样,本身只提供很简单的功能
- 大部分都需要依靠社区中的插件、包来开发咱们的应用程序
- 如果英语好,占优势
- npm 两层含义:
- 第一是一用来托管基于Node开发的包的
- 第二是一个命令行工具,可以用来下载npm网站上托管的Node包
- 有了 npm,就会成为完全傻瓜式的开发
- 直接拿来解决你的问题就可以了,能让你更加专注于业务的处理
-
Node 是基于 Chrome V8 解析引擎之上构建的一个 JavaScript 运行时环境,或者说平台
- 在 Node 中,可以使用 JavaScript 语言进行编程吧
- Node 能解析和执行 JavaScript(ECMAScript) 代码
- Node 是一个平台,让 JavaScript 可以脱离浏览器环境运行
- Node 自身使用 c++ 语言写出了很多系统级别相关的 API,暴露了一些 JavaScript 环境 API
- 例如文件操作
- 网络操作
- 。。。
- 使用 Node 可以轻松的进行文件系统访问、HTTP 服务器开发等功能
- 免费开源
2.4 使用 Node 可以做什么
- 高性能的网站服务器
- 实时多人游戏后台服务器
- 简单易用的命名行应用程序
- gulp、less、bower、fis、http-server
- ant、ruby、.net nuget
- 高大上的桌面应用程序
- 使用 Web 技术 作为解决方案
- electron Linus + Max + Windows
- 底层的物联网开发
- 树莓派
- 移动开发
- Ionic 安卓 IOS
- 使用 Web 技术作为解决方案
2.5 Node 的特点
- Single Thread:单线程
- event-driven:事件驱动
- non-blocking I/O model:非阻塞IO模型
- 文件IO、网络IO 基本上都是异步的
- 所以在 Node 中会看到各种各样的花式回调
- Node 采用的是 事件驱动和非阻塞IO模型 使它本身非常的轻量级和高效。
- 开源免费、跨平台
2.6 为什么要学习 Node
- Node 打破了过去 JavaScript 只能在浏览器中运行的局面
- 前后端编程环境统一,大大降低了前后端语言切换的代价
- 全栈开发工程师
- 后端开发工程师
- 前端开发工程师
- 移动端开发工程师
- 前端 + 后端
2.7 总结
Node 是基于 Chrome V8
引擎,一个 JavaScript 运行时环境。 Node 可以解析和执行 JavaScript(ECMAScript) 脚本代码, 而且提供了很多系统级别的API(文件读写、进程管理、网络通信)。
Node 不是一个新的语言,而且一个运行时环境,类似于浏览器环境或者说平台, 可以用来解析和执行 JavaScript 语言代码。
JavaScript 长久以来一直被限制在浏览器的沙箱中运行, 它的能力取决于浏览器中间层提供的支持多少。 Node 将高性能的 V8 带到了服务器端,使 JavaScript 也可以开发出实时高性能的服务器。 在 Node 中,不再与CSS样式表,DOM树打交道, 可以随意的访问本地文件,搭建 WebSocket 服务器,连接数据库等系统级底层操作。 Node 不处理 UI,只关心数据
,无论是本地数据还是网络数据。 前后端编程统一,大大降低了前后端编程切换的代码。
对于前端工程师而言,自己熟悉的 JavaScript 如今竟然可以在另一个地方大放异彩, 不谈其他原因,仅仅因为好奇,也值得去关注和探究它。
JavaScript 全栈开发工程师,JavaScript 语言的责任已经越来越重了。
2.8 Node 学习资源推荐
- 深入浅出Node.js
- Node.js实战(第一季)
- Node与Express开发
- 菜鸟教程 - Node.js
- 七天学会NodeJS
- Node中文社区
- Node V4.2.1中文文档
- Node.js 包教不包会
3.安装与配置 Node 开发环境
3.1 普通方式安装
- 下载地址:
https://nodejs.org/en/download/
- 下一步下一步即可
3.2 使用 nvm
安装和管理多个 node 版本
- nvm node version management
- nvm 是一个命令行程序,可以非常方便的安装和管理多个 Node 版本
- 下载地址:
https://github.com/coreybutler/nvm-windows
3.3 如何验证是否有Node环境
打开终端,输入 node -v
:
$ node -v
$ vx.x.x
如果能看到输出一个版本号,例如 v6.8.1
的文本,说明当前计算机有 Node环境。
4.快速体验
4.1 Hello World
使用 node
命令执行一个 JavaScript
脚本文件:
- 打开任意终端
- 使用
cd
命令切换到要执行的 js 脚本文件所属的目录 - 使用
node 文件名
去执行对应的 js 脚本文件 - node 会解析和执行该文件中的代码,然后将执行结果输出到终端
当你在终端中输入 node example.js, 实际上就是使用安装目录中的 node.exe 可执行程序, node.exe 程序会自动读取该文件中的内容, 读取到该文件内容之后,node 环境开始解析和执行, 如果有 console.log 这样的代码,node 会将该输出打印到控制台中。
-
注意1:文件名不要使用
node
命名 -
注意2:文件名和路径最好不要使用中文,路径中也最好不要有空格
4.2 文件IO:读写文件
var fs = require('fs')
// 读取文件
// fs.readFile('./README', function(err, data) {
// if (err) {
// // return console.log('读取文件失败了')
// throw err
// }
// console.log(data.toString())
// })
// 写入文件
fs.writeFile('./a.txt', 'hello aaa', function (err) {
if (err) {
throw err
}
console.log('文件写入成功')
})
4.3 网络IO:HTTP服务器
var http = require('http')
// 1. 创建 HTTP 服务器,得到一个 服务器实例对象
var server = http.createServer()
var money = 0
// 2. 给 Server 对象添加 request 事件处理函数
// 回调函数需要接收两个参数:
// 第一个参数:Request,用来获取当前客户端的请求信息
// Request 对象可以获取客户端请求中的 url 请求地址、查询字符串、post 请求提交的数据等
// 第二个参数:Response 也是一个对象,一般用来给本次请求发送响应数据
server.on('request', function(request, response) {
money++
// 告诉客户端,本次响应的数据是文本类型,utf-8 编码
response.writeHead(200, {
'Content-Type': 'text/plain; charset=utf-8'
})
response.write('回家过年了,今年赚了:' + money + ' RMB')
response.end()
})
// 3. 通过 Server 对象的 listen 函数,设置一个监听的端口号,启动服务器
server.listen(3000, function() {
// 当服务器开启监听成功之后,会触发该回调处理函数
console.log('server is running at port 3000.')
})
5.Node 基础
5.1 Node 中的 JavaScript
-
REPL运行环境
- R:read
- E:Eval
- P:Print
- L:Loop
-
ECMAScript
- Node 对最新的 ECMAScript 语言标准支持的非常好
- 对最新的 ES6 支持了将近 96% 的语法
- Node 除了官方的 ECMAScript 语言规范
- 同时将 console 对象、定时器等函数也移植到 Node 中
-
全局对象
- global
- 相对于浏览器中的的全局对象 window
- 全局作用域和模块作用域的概念
- Console
- log
- info
- warn
- error
- process
- 进程对象
- Buffer
- global
-
全局函数
- setInterval 和 clearInterval
- setTimeout 和 clearTimeout
- setImmediate 和 clearImmediate
-
模块内成员
- dirname 和 filename
- require
- exports
- module
5.2 Node 中的模块系统
- Node 根据
CommonJS
规范实现了自己的一套模块系统 - 一个单独的文件就是一个模块
- 如何定义模块:
- Node 天生就已经实现了一个模块系统解决方案
- 默认在Node中运行的 JavaScript 脚本文件,就是一个模块,而且是私有作用域
- 每一个模块都是一个单独的作用域
- 没有浏览器中 window 全局作用域的概念了
- 每个文件对外接口是
module.exports
对象 require
方法用于加载模块- 执行被加载模块中的 JavaScript 代码
- 得到模块的
module.exports
接口对象
- 核心模块和文件模块
6.调试 Node
一个优秀的开发人员调试能力很重要 任何一个平台的开发都离不开调试,调试不仅仅是工具,更多的是套路
6.1 关于 Debug
所谓的 Debug ,也就是找到并去除缺陷的过程,这些过程呢,其实也是由套路规则可循的,以下是我总结的一些调试经验:
- 系统化注释掉或禁用代码块:排除法
- 分析网络数据流,确定问题是客户端还是服务器
- 使用之前能用的输入,并一点一定地修改输入,直到问题呈现
- 用版本控制逐次回退,直到问题消失
6.2 Node 中的 Debug
- console.log
- node-inspector
- 这个一个可以在浏览器中调试 Node 的一个工具
- visual studio code
- 这也是一个编辑器,内部类似于 Webstorm,也集成了一个调试Node代码的功能
- Webstorm