node.js
一、浏览器
1、浏览器的组成
- 人机交互部分 - UI
- 网络请求部分 - socket
- JavaScript引擎部分 - 解析执行js
- 渲染引擎部分 - 渲染 HTML、CSS等
- 数据存储部分 - cookie、HTML5中的本地存储LocalStorage、SessionStorage
2、主流渲染引擎
1、介绍
- 渲染引擎,又叫排版引擎 或 浏览器内核
2、主流的渲染引擎
- Chrome浏览器:Blink引擎(Webkit的一个分支)
- Safari浏览器:Webkit引擎windows版本2008年3月18推出正式版,但苹果已于2012年7月25停止开发Windows版的Safari
- FireFox浏览器:Gecko引擎
- Opera浏览器:Blink引擎(早期使用Presto引擎)
- Internet Explorer浏览器:Trident引擎
- Microsoft Edge浏览器:EdgeHTML引擎(Trident的一个分支)
3、工作原理
-
解析HTML构建DOM树(Document Object Model,文档对象模型),DOM是W3C组织推荐的处理可扩展置标语言的标准编程接口
-
构建渲染树并不等同于DOM树,因为像
head标签 或 display:none
这样的元素就没有必要放到渲染树中,但是它们在DOM树中。 -
对渲染树进行布局,定位坐标和大小、确定是否换行、确定position、overflow、z-index等等,这个过程叫
"layout" 或"reflow"
-
绘制渲染树,调用操作系统底层的API进行绘图操作
二、web开发的本质
1、三点
- 请求,客户端发起请求
- 发出,服务器处理请求
- 相应,服务器将处理结果发送给客户端
三、node.js介绍
1、node.js是什么?
-
node.js是一个开发平台,就像java开发平台、.Net开发平台、PHP开发平台、Apple开发平台一样。
- 何为开发平台?有对应的编程语言、有语言运行时、有能实现特定功能的API(SDK:Software Development Kit)
-
该平台使用的编程语言是 JavaScript 语言
-
node.js 平台基于 Chrome V8 JavaScript 引擎构造
-
基于 node.js 可以开发控制台程序(命令行程序、CLI程序)、桌面应用程序(GUI)(借助 node-webkit、electron等框架实现)、Web应用程序(网站)
PHP 开发技术栈:LAMP - Linux Apache Mysql PHP
node.js 全栈开发技术栈:MEAN - MongoDB Express Angular Node.js
2、特点
- 事件驱动(当事件被触发时,执行传递过去的回调函数)
- 非阻塞 I/O 模型(当执行 I/O 操作时,不会阻塞线程)
- 单线程
- 拥有世界最大的开源库生态系统 - npm
3、网站
4、下载
四、编写程序
1、REPL介绍
1、全称
Read-Eval-Print-Loop(交互式解释器)
- R(读取):读取用户输入,解析输入了JavaScript 数据结构并存储在内存中
- E(执行):执行输入的数据结构
- P(打印):输出结果
- L(循环):循环操作以上步骤直到用户两次按下ctrl-C按钮退出
2、编写程序
-
控制台
-
在REPL中编写程序(类似于浏览器开发人员工具中的控制台功能),直接在控制台输入
node
命令进入REPL环境 -
按两次Control + C 退出REPL界面 或者 输入
.exit
退出REPL界面
-
-
JavaScript
- 分全局模块 和 部分模块。可从文档Globe查看全局模块
-
官方文档中:Stability 。0:过时,1:正在开发测试,2:稳定。
五、第一个程序
// hello-world-01.js
var m = 100;
var n = 100;
function add(x,y){
return x + y;
}
var result = add(m,n);
console.log(‘返回的结果是:‘+result);
# 执行hello-world-01.js
node hello-world-01.js
六、fs模块(文件操作)
1、读取操作
var fs = require(‘fs‘);
fs.readFile(
‘./hello.txt‘,
function(err,data){
if(err){
throw err;
}
// 把Buffer转String,调用toString。toString()参数默认 utf8
console.log(data);
console.log(data.toString(‘utf8‘));
}
);
// 文件路径
// __dirname:当前执行的js文件的完整目录路径
// __filename:当前执行的js文件的完整文件路径
// __ 是两个下划线
2、读取操作
// 执行文件操作
// --- 实现文件写入操作 ---
// 1、加载文件操作模块 fs模块
var fs = require(‘fs‘);
// 2、实现文件写入操作
var msg = ‘Hello World,你好世界!‘;
// 调用fs.writhFile() 进行文件写入
// 异步执行
fs.writeFile(
‘./hello.txt‘,
msg,
‘utf8‘,
function(err){
if(err === null){
console.log(‘文件写入成功!‘);
}else {
console.log(‘文件写入失败!具体错误:‘ + err);
}
}
);
七、HTTP模块
1、http服务简单搭建
// 创建一个简单的http服务器程序
// 1、加载http模块
var http = require(‘http‘);
// 2、创建一个http服务对象
var server = http.createServer();
// 3、监听用户的请求事件(request事件)
// request对象包含用户请求报文中的所有内容,通过request对象可以获取所有用户提交过来的数据
// response对象用来向用户响应一些数据,当服务器要向客户端响应数据时,必须使用reponse对象
// 有了request对象和reponse对象,就既可以获取用户提交的数据,也可以向用户响应数据了
server.on(‘request‘,function(req,res){
// 乱码解决思路:
// 在res.write(‘中文‘)时,响应在客户端的内容如果编码不一致,会导致乱码
// 服务器通过设置http响应报文头,指定客户端采用响应编码解析网页
/** 响应报文头还可设置其他信息。参考地址:开源中国 -- 在线工具 -- HTTP Mime-type **/
/** 第三方模块:mime,来判断不同类型 **/
res.setHeader(‘Content-Type‘,‘text/plain;charset=utf-8‘);
res.write(‘Hello World‘);
// 对于每一个请求,服务器必须结束响应,否则客户端(浏览器)会一直等待服务器的响应
res.end();
})
// 4、启动服务 -- 命令 node hello.js
server.listen(3000,function(){
console.log(‘服务已启动,,,‘);
});
2、不同请求,不同响应内容
// 根据用户不同请求,服务器做出不同响应
// 响应内容为文本
var http = require(‘http‘);
http.createServer(function(req,res){
// 获取用户请求路径 req.url
if(req.url === ‘/‘ || req.url === ‘/index‘){
res.end(‘index‘);
}else if(req.url === ‘/a‘){
res.end(‘a‘);
}else{
res.end(‘404 Not Found‘);
}
}).listen(3000,function(){
console.log(‘服务已启动,,,‘);
});
// 根据用户不同请求,服务器做出不同响应
// 响应内容为页面
var http = require(‘http‘);
var fs = require(‘fs‘); // 文件
var path = require(‘path‘); // 拼接路径
http.createServer(function(req,res){
// 获取用户请求路径 req.url
if(req.url === ‘/‘ || req.url === ‘/index‘){
// path.join():拼接路径
// __dirname:当前执行的js文件的完整目录路径
fs.readFile(path.join(__dirname,‘htmls‘,‘index.html‘),function(err,data){
if(err){
throw err;
}
// 把读取到的页面中的内容直接发送给服务器
res.end(data);
});
}else if(req.url === ‘/a‘){
fs.readFile(path.join(__dirname,‘htmls‘,‘a.html‘),function(err,data){
if(err){
throw err;
}
res.end(data);
});
}else{
fs.readFile(path.join(__dirname,‘htmls‘,‘notFound.html‘),function(err,data){
if(err){
throw err;
}
res.end(data);
});
}
}).listen(3000,function(){
console.log(‘服务已启动,,,‘);
});
3、request
-
http.IncomingMessage
-
服务器解析用户提交的http请求报文,将结果解析到
request
对象中。 -
凡是要获取和用户请求相关的数据都可以通过
request
对象获取。
4、reponse
-
http.ServerResponse
-
在服务器端用来向用户做出响应的对象。
-
凡是需要向用户(客户端)响应的操作,都需要通过
response
对象进行
八、try-catch
- 同步操作异常
- 可以捕获
- 异步操作异常
- 无法捕获
- 只能通过判断错误号(err.code)操作