摘要：本笔记共四篇源码阅读笔记源码阅读笔记源码阅读笔记服务器启动与请求处理源码阅读笔记对象起因前两天终于把自己一直想读的源代码读了一遍。首先放上关键的源代码在上一篇源码阅读笔记服务器启动与请求处理中，我们已经分析了的作用。
起因本笔记共四篇
Koa源码阅读笔记(1) -- co
Koa源码阅读笔记(2) -- compose
Koa源码阅读笔记(3) -- 服务器の启动与请求处理
Koa源码阅读笔记(4) -- ctx对象
前两天终于把自己一直想读的Koa源代码读了一遍。
今天就要来分析Koa的ctx对象，也就是在写中间件和处理请求和响应时的那个this对象。
而这个this对象，也是和Express的重要区别之一。不用再区分req,res（虽然还是得知道），一个this对象就能调用所有方法。
在实际开发中，是非常便利的。
在这儿则需要谈一谈Koa1和Koa2调用this对象的区别。
Koa1在调用时，使用的是this,而Koa2则是ctx。
// Koa1
app.use(function * (next) {
this.body = "hello world"
yield next
})
// Koa2
app.use(async (ctx, next) => {
ctx.body = "hello world"
await next()
})
使用方式，只是把this换成了ctx。
具体为什么出现ctx和next,之前的文章koa-compose的分析有写。
这儿继续以Koa1为例，因为看得懂Koa1源代码的，看Koa2的源码自然也不难。
首先放上关键的源代码：
app.callback = function(){
var fn = co.wrap(compose(this.middleware));
var self = this;
return function(req, res){
res.statusCode = 404;
var ctx = self.createContext(req, res);
onFinished(res, ctx.onerror);
fn.call(ctx).then(function () {
respond.call(ctx);
}).catch(ctx.onerror);
}
};
在上一篇Koa源码阅读笔记(3) -- 服务器の启动与请求处理中，我们已经分析了fn的作用。
而onFinished则会在请求完成时调用，剩下的则是调用中间件去处理响应。
同时var ctx = self.createContext(req, res);这一句，不看createContext这个函数，应该也能猜出它的作用。
之后的fn.call(ctx)则说明了中间件中this的来源。
在这儿不得不感叹一句，JavaScript的this真的是太灵活了，配合闭包，call,apply等，简直拥有无限魔力。
贴出相关的源代码：
var response = require("./response");
var context = require("./context");
var request = require("./request");
/**
* Initialize a new context.
*
* @api private
*/
app.createContext = function(req, res){
var context = Object.create(this.context);
var request = context.request = Object.create(this.request);
var response = context.response = Object.create(this.response);
context.app = request.app = response.app = this;
context.req = request.req = response.req = req;
context.res = request.res = response.res = res;
request.ctx = response.ctx = context;
request.response = response;
response.request = request;
context.onerror = context.onerror.bind(context);
context.originalUrl = request.originalUrl = req.url;
context.cookies = new Cookies(req, res, {
keys: this.keys,
secure: request.secure
});
context.accept = request.accept = accepts(req);
context.state = {};
return context;
};
虽然看上去有点绕，但是仔细看看，还是不难的。
之前说过，Koa的源码简洁，一共就4个文件。
除了主要的Application.js, 剩下就都是与请求和响应相关的了。
这儿，因为每次都要创建并调用ctx对象。为了避免影响原有的context,request,response对象。
这儿采用了Object.create()来克隆对象。
首先就来分析，最开始的context.js。
context的实现很简单，但有意思的地方在于delegate这个地方。
就如下图所示：
我看了delegate这个源代码，功能是把context中相应的方法调用和属性读取，委托至某个对象中。
而不用自己一个一个的写apply,call等。
关于request和response，我这儿就不详细写了。
在这儿放一张图足以。
实际上，request和response是通过getter和setter，来实现存取不同属性的功能。
另外，通过刚才说的delegate方法，则使用ctx对象时，便能自动通过getter和setter获取想要的内容。
这一篇很简单，其实也没啥可以说的。
因为Koa除了中间件部分看起来复杂，其它地方还是很简洁明了的。
学习源代码的过程中，也发现了很多优雅的写法，算是开拓了自己的眼界。
从会写到写好，看来还要挺长一段时间的。
前端路漫漫，且行且歌。
最后附上本人博客地址和原文链接，希望能与各位多多交流。
Lxxyx的前端乐园
原文链接：Koa源码阅读笔记(4) -- ctx对象
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/90861.html
摘要：本笔记共四篇源码阅读笔记源码阅读笔记源码阅读笔记服务器启动与请求处理源码阅读笔记对象起因前两天阅读了的基础，和中间件的基础。的前端乐园原文链接源码阅读笔记服务器启动与请求处理 本笔记共四篇Koa源码阅读笔记(1) -- coKoa源码阅读笔记(2) -- composeKoa源码阅读笔记(3) -- 服务器の启动与请求处理Koa源码阅读笔记(4) -- ctx对象 起因 前两天阅读了K...
摘要：正好自己之前也想看的源代码，所以趁着这个机会，一口气将其读完。源码解读的源代码十分简洁，一共才两百余行。结语的源代码读取来不难，但其处理方式却令人赞叹。而且阅读的源代码，是阅读源码的必经之路。 本笔记共四篇Koa源码阅读笔记(1) -- coKoa源码阅读笔记(2) -- composeKoa源码阅读笔记(3) -- 服务器の启动与请求处理Koa源码阅读笔记(4) -- ctx对象 起...
摘要：引言最近空闲时间读了一下的源码在阅读的源码的过程中，我的感受是代码简洁思路清晰不得不佩服大神的水平。调用的时候就跟有区别使用必须使用来调用除了上面的的构造函数外，还暴露了一些公用的，比如两个常见的，一个是，一个是。 引言 最近空闲时间读了一下Koa2的源码；在阅读Koa2(version 2.2.0)的源码的过程中，我的感受是代码简洁、思路清晰（不得不佩服大神的水平）。下面是我读完之后...
摘要：于是抱着知其然也要知其所以然的想法，开始阅读的源代码。问题读源代码时，自然是带着诸多问题的。源代码如下在被处理完后，每当有新请求，便会调用，去处理请求。接下来会继续写一些阅读笔记，因为看的源代码确实是获益匪浅。 本笔记共四篇Koa源码阅读笔记(1) -- coKoa源码阅读笔记(2) -- composeKoa源码阅读笔记(3) -- 服务器の启动与请求处理Koa源码阅读笔记(4) -...
摘要：接上次挖的坑，对相关的源码进行分析第一篇。和同为一批人进行开发，与相比，显得非常的迷你。在接收到一个请求后，会拿之前提到的与来创建本次请求所使用的上下文。以及如果没有手动指定，会默认指定为。 接上次挖的坑，对koa2.x相关的源码进行分析 第一篇。 不得不说，koa是一个很轻量、很优雅的http框架，尤其是在2.x以后移除了co的引入，使其代码变得更为清晰。 express和ko...
阅读 3214·2021-10-11 10:58
阅读 1788·2019-08-30 15:54
阅读 3487·2019-08-29 13:07
阅读 3019·2019-08-29 12:39
阅读 1669·2019-08-26 12:13
阅读 1401·2019-08-23 18:31
阅读 2062·2019-08-23 18:05
阅读 1728·2019-08-23 18:00
