本文档是基于express 3.4.6 的

在我们的代码中,渲染模板大致是这样写的

exports.index = function(req, res){
res.render('index', { title: 'Express' });
};

这个req,res 函数其实是经过了中间件middleware.js 处理后的,我们在前面提到过。

req,res的原型分别为 app.request 和app.response

req.__proto__ = app.request;
res.__proto__ = app.response;

而 app.request 和app.response,本身也是具有app的属性的。

//设置app 的request对象的原型为req,本身的属性为connect对象
app.request = { __proto__: req, app: app };
//设置app的response对象原型为res ,本身的属性为connect对象
app.response = { __proto__: res, app: app };

注意这里的这个app属性

打开response.js 文件,我们看看res.render方法

res.render = function(view, options, fn){
var self = this
, options = options || {}
, req = this.req
, app = req.app; // support callback function as second arg
if ('function' == typeof options) {
fn = options, options = {};
} // merge res.locals
options._locals = self.locals; // default callback to respond
fn = fn || function(err, str){
if (err) return req.next(err);
self.send(str);
}; // render
app.render(view, options, fn);
};

可以看到:

, req = this.req
, app = req.app;

这里的 req = this.req,其实是中间件 里面的  res.req = req;

第二句直接将app带进来了,最后我们执行了app.render方法,它调用了application.js 中得这个方法:

app.render = function(name, options, fn){
var opts = {}
, cache = this.cache
, engines = this.engines
, view; // support callback function as second arg
if ('function' == typeof options) {
fn = options, options = {};
} // merge app.locals
utils.merge(opts, this.locals); // merge options._locals
if (options._locals) utils.merge(opts, options._locals); // merge options
utils.merge(opts, options); // set .cache unless explicitly provided
opts.cache = null == opts.cache
? this.enabled('view cache')
: opts.cache; // primed cache
if (opts.cache) view = cache[name]; // view
if (!view) {
view = new (this.get('view'))(name, {
defaultEngine: this.get('view engine'),
root: this.get('views'),
engines: engines
}); if (!view.path) {
var err = new Error('Failed to lookup view "' + name + '"');
err.view = view;
return fn(err);
} // prime the cache
if (opts.cache) cache[name] = view;
} // render
try {
view.render(opts, fn);
} catch (err) {
fn(err);
}
};

可以看到它调用了视图类:

 view = new (this.get('view'))(name, {
defaultEngine: this.get('view engine'),
root: this.get('views'),
engines: engines
});

最后调用了视图的render方法。 view.render(opts, fn);

视图的这个方法是:

View.prototype.render = function(options, fn){
this.engine(this.path, options, fn);
};
function View(name, options) {
options = options || {};
this.name = name;
this.root = options.root;
var engines = options.engines;
this.defaultEngine = options.defaultEngine;
var ext = this.ext = extname(name);
if (!ext && !this.defaultEngine) throw new Error('No default engine was specified and no extension was provided.');
if (!ext) name += (ext = this.ext = ('.' != this.defaultEngine[0] ? '.' : '') + this.defaultEngine);
this.engine = engines[ext] || (engines[ext] = require(ext.slice(1)).__express);
this.path = this.lookup(name);
}

引擎require了一个方法

this.engine = engines[ext] || (engines[ext] = require(ext.slice(1)).__express);

后面就去调用具体的模板引擎了。

nodejs express 框架解密5-视图的更多相关文章

  1. nodejs express 框架解密1-总体结构

    本文是基于express3.4.6的. 1.express 代码结构为: bin/express 是在命令行下的生成express 框架目录文件用的 lib/express 是框架的入口文件 lib/ ...

  2. nodejs express 框架解密3-中间件模块

    本文档是基于express 3.4.6 的 在上篇中我们提到了中间件,这篇主要解释这个模块,middleware.js 为: var utils = require('./utils'); /** * ...

  3. nodejs express 框架解密4-路由

    本文档是基于express3.4.6 express 的路由是自己去实现的,没有使用connect中的路由中间件模块. 1.在如何创建一个app那篇中,我们提到了路由, //router //路由 t ...

  4. nodejs express 框架解密2-如何创建一个app

    本文是基于express 3.4.6 的 1.在我们的app.js 文件里面有这么几行 http.createServer(app).listen(app.get('port'), function( ...

  5. React第一篇: 搭建React + nodejs + express框架

    前提: 需要安装Node.js (>6)版本 1.cmd进到本地某个目录, 逐行输入以下指令(以下括号为注释) npm install -g create-react-app   (全局安装cr ...

  6. nodeJS express框架 中文乱码解决办法

    最近在研究javascript 的服务端应用 node,之所以想要研究node,是因为前几个月一直在前端挣扎,从javascript入门到在项目中实际使用javascript,确实感悟颇深.javas ...

  7. NodeJS express框架的使用

    首先,可以通过npm或者淘宝镜像cnpm全局安装epress框架,这里不具体说了 npm install -g expressnpm install -g express-generator 新建一个 ...

  8. nodejs express 框架 上传文件

    web 项目应用express4.0框架 html 表单post 文件上传失败,后端无法获取提交文件 express不支持文件上传. 方式一 若是图片,可以将图片转码为BASE64上传 前端框架ang ...

  9. 安装nodejs express框架时express命令行无效

    我也是看了这篇才明白.http://jingyan.baidu.com/article/922554468a3466851648f419.html 最近在看一本书,nodejs开发指南.至于出现这个问 ...

随机推荐

  1. xtrabackup工具安装

    1.首先从官网上http://www.percona.com/下载较新版本的xtrabackup percona-xtrabackup-2.2.7-5050-Linux-x86_64.tar.gz 2 ...

  2. 【12_206】Reverse Linked List

    本来没想出来,刚才突然想到,可以用“头插法”来反转 Reverse Linked List My Submissions Question Total Accepted: 66556 Total Su ...

  3. 4.2.1 网络请求之HTTP

    HTTP请求&响应:(常用的只有Post与Get,还有Head/put/delete/connect/options/trace) Get&Post(建议用post规范参数传递方式,并 ...

  4. wamp链接mysql数据库

    一:链接到自带的数据库 1.打开mysql命令行 密码为空即回车2.输入use mysql 3.执行 update user set password=PASSWORD('123456') where ...

  5. Linux下使用RecordMyDesktop进行屏幕录像

    近期我们在评估给用户提供视频教程的可能性,以此来展示某些用视频才能更好表达的教程.在挖掘这个问题的时候,我们发现极丰富的可用于屏幕录像的工具.这些程序大体上特性的区别有:视频质量,性能,兼容性.这在此 ...

  6. Linux 下zip包的压缩与解压

    linux zip 命令详解 功能说明:压缩文件. 语 法:zip [-AcdDfFghjJKlLmoqrSTuvVwXyz$][-b <工作目录>][-ll][-n <字尾字符串& ...

  7. C#函数式编程之由函数构建函数

    在面向对象的编程中,如果我们需要复用其他的类,我们可以通过继承来实现.而在函数式编程中我们也可以采取不同的方式来复用这些函数.今天的教程将会讲述两种方式,其中一个就是组合,将多个函数组合成为一个函数, ...

  8. 【Leetcode】【Hard】Merge Intervals

    Given a collection of intervals, merge all overlapping intervals. For example,Given [1,3],[2,6],[8,1 ...

  9. 解析ASP.NET Mvc开发之查询数据实例

    目录: 1)从明源动力到创新工场这一路走来 2)解析ASP.NET WebForm和Mvc开发的区别 ------------------------------------------------- ...

  10. AlwaysON同步性能监控的三板斧

    延迟是AlwaysOn最大的敌人之一 延迟是AlwaysON的最大敌人之一.对AlwaysON而言,其首要目标就尽量减少(无法避免)主副本.辅助副本的数据延迟,实现主副本.辅助副本的“数据同步”.只有 ...