模块化思路|学习笔记

简介: 快速学习模块化思路

开发者学堂课程【Node.js 入门与实战模块化思路】学习笔记,与课程紧密联系,让用户快速学习知识

课程地址https://developer.aliyun.com/learning/course/588/detail/8301


模块化思路


目录:

一、模块化思路

二、示例

三、代码模块化

 

一、模块化思路

让代码模范化:便于代码的使用开发和后期代码的维护

多人协作的条件:代码最好分开几个文件放置,最好每个功能一个文件,每个人负责一个功能修改哪个文件即可。

 

二、示例

// 1.读取 data.json 文件的数据

readNewsData(function(list) {

// 2.

// 在把新闻添加到 list 之前,为新闻增加一个id属性url0bj.query.id = list.length;

//向数组对象 list 中 push 一条新闻

list.push(url0bj.query);

// 3.写入 data.json 文件

writeNewsData(JS0N.stringify(list),function() {

//重定向

res.statusCode = 302;

res.statusMessage . 'Found';

res.setHeader('Location''/');

res.end();

});

});

} else if (reg.url *** '/add' && req.method ***'post') { 

// 1. 读取 data.json

readNwsData(function(list) {

// 2.读取用户 post 提交的数据

postBodyData(req,function(postData) {

// 3.为用户提交的新闻增加一个 id 属性,并且把新闻对象 push 到list中postData.id = list.length;

list.push(postData);


三、代码模块化

1、代码模块一

//1.加载 http 模块

//模块改造的核心思想就是把项目中按照功能模块,不同代码提取到不同JS文件中

//index.js 只负责启动服务,定义为模块一

var http = require('http');

var fs = require('fs');

var path = require('path');

var mime = require('mime');

var url = require('url');

var querystring =require('querystring');

var_ = require('underscore');

// 2.代码模块二

2.创建服务

//模块二对 res 和 req 进行扩展服务,为 req 和 res 增加以下更方便好用的 API

http.createServer(function(req,res) {

//要在这里写大量的代码

//为 res 对象添加一个 render() 函数,方便后续使用

//因为现在要渲染的 index.html 中需要用到模板数据,所以给render函数增加了第二个参数

//第二个参数的作用就是用来传递 html 页面中要使用的模板数据

res.render = function(filename,tpLData)//增加一个render函数就是为了后期使用方便,并且渲染时和特定业务无关,其他业务涉及渲染时也可以使用 render 函数.

{

fs.readFile(fllename, function(err,data) {

if (err) {

res.writeHead(404,'Not Found',{'Content-Type':'text/html;charset=utf-8' });

res.end('4B4,not found.');

return;

}

//如果用户传递了模板数据,那么就使用 underscore 的 template 方法进行替换“

//如果用户没有传递模板数据,那么就不进行替换

1f (tplData) {

//如果用户传递了模板数据,表示要进行模板

var fn = template(data.toString('utf8'));

data = fn(tp1Data);

}

res.setHeader('Content-Type',mime.getType(filename));

res.end(data);});

3.代码模块三

模块三路由判断

将用户请求的 url 和 method 转换为小写字母 req.url = req.url.toLowerCase();

req.method = req.method.toLowerCase();

通过 url 模块,调用 url.parse() 方法解析用户请求的 url (req.url)

var url0bj = url.parse(req.url,true)

//先根据用户请求的路径(路由),将对应的HTML页面显示出来

if  (req.url ·***·/’·req.url·***./index’·&&·req.method·***·get){

4. 代码模块四

模块四处理具体路由的业务的代码

//1.读取 data.json 文件中的数据,并将读取到的数据转换为list数组

readNewsData(function(list)){

//2.在服务器使用模板引擎,将 list 中的数据和 index.html 文件中的内容结合渲染给客户端

res.render(path.join(_ _dirname,views,index.html),{list:list});

});

} else if(req.url *** /submit&& req.method *** get){

//读取 submit.html 并返回

res.render(path.join(_ _dirname,views,submit.html));

}

else if (url0bj.pathname === /item&& req.method === get){

//1.获取当前用户请求的新闻的 id

//url0bj.query.id

//2.读取 data.json 文件中的数据,根据 id 找到对应新闻

}

}

相关文章
|
1月前
|
算法 测试技术
模块化设计具体应该怎么做呢
【10月更文挑战第22天】模块化设计具体应该怎么做呢
|
5月前
|
存储 前端开发 容器
前端开发的设计思路【精炼】(含数据结构设计、组件设计)
前端开发的设计思路【精炼】(含数据结构设计、组件设计)
55 0
|
前端开发
前端学习案例2-模块化2
前端学习案例2-模块化2
57 0
前端学习案例2-模块化2
|
前端开发
前端学习案例1-模块化1
前端学习案例1-模块化1
64 0
前端学习案例1-模块化1
|
JSON 前端开发 API
前端组件模块化设计思路-何飞
在整个前端代码的开发中,经常会不停的造轮子,写重复的代码,导致整体的研发成本过多,开发效率变慢,而在如今低代码盛行的时代,如何降低研发成本,提升开发效率成了很多大厂探索的目标,目前市面上大多数的组件库(Ant Design、ElementUI 等)都是能给开发带来便利,但是不具备业务属性,还是需要通过组件库的能力进行上层的搭建,无法满足业务需求的变化,从而导致研发成本的增加。
|
SQL Cloud Native 数据可视化
模块化思想在实践中的应用
各种编程语言中的函数,数据仓库的标签体系,甚至于数据中台的核心理念,都是把模块化的思想发挥到了极致,避免了我们重复造轮子,消除了数据烟囱,用最小的投入获得了最大的产出。
模块化思想在实践中的应用
|
前端开发 JavaScript
🍉前端模块化
🍉前端模块化
65 5
|
Java
LanguageTool精简的两个思路
LanguageTool精简的两个思路
78 0
|
前端开发 JavaScript 开发者
前端技术-模块化概念说明 | 学习笔记
快速学习 前端技术-模块化概念说明
101 0
|
设计模式 安全 测试技术
经验总结 | 重构让你的代码更优美和简洁
最近,笔者有幸对高德打车订单Push项目进行了重构,与大家分享一下代码重构相关的工作经验,希望对大家有所启发。
239 1
经验总结 | 重构让你的代码更优美和简洁