找不到koa.js车间解决方案的解释,练习第一

时间:2016-04-12 11:01:38

标签: javascript generator koa co

它必须相当简单,但我无法理解the beginning exercise from koa workshop的解决方案。

测试:

<div class="container">
    <form class="well form-horizontal" action=" " method="post" id="contact_form">
        <fieldset>
            <!-- Form Name -->
            <legend style="font-weight: bold;">Neem contact op</legend>
            <div class="container" style="margin-bottom: 15px">
                <h4 style="font-weight: bold; "> Gegevens</h4>
                <span style="font-weight: bold;">Naam:</span> test<br>
                <span style="font-weight: bold;">Woonplaats:</span> test <br>
                <span style="font-weight: bold;">Adres:</span> test <br>
                <span style="font-weight: bold;">Postcode:</span> test <br>
                <span style="font-weight: bold;">Telefoon:</span> test <br>
            </div>
            <div class="clearfix">
                <div class="col-xs-12">
                    <!-- Text input-->
                    <div class="form-group">
                        <label class="control-label">Voornaam</label>
                        <div class="inputGroupContainer">
                            <div class="input-group">
                                <span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
                                <input name="first_name" placeholder="First Name" class="form-control" type="text">
                            </div>
                        </div>
                    </div>
                    <!-- Text input-->
                    <div class="form-group">
                        <label class="control-label">Achternaam</label>
                        <div class="inputGroupContainer">
                            <div class="input-group">
                                <span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
                                <input name="last_name" placeholder="Last Name" class="form-control" type="text">
                            </div>
                        </div>
                    </div>
                    <!-- Text input-->
                    <div class="form-group">
                        <label class="control-label">E-Mail</label>
                        <div class="inputGroupContainer">
                            <div class="input-group">
                                <span class="input-group-addon"><i class="glyphicon glyphicon-envelope"></i></span>
                                <input name="email" placeholder="E-Mail Address" class="form-control" type="text">
                            </div>
                        </div>
                    </div>
                    <!-- Text input-->
                    <div class="form-group">
                        <label class="control-label">Telefoon</label>
                        <div class="inputGroupContainer">
                            <div class="input-group">
                                <span class="input-group-addon"><i class="glyphicon glyphicon-earphone"></i></span>
                                <input name="phone" placeholder="06-12345678" class="form-control" type="text">
                            </div>
                        </div>
                    </div>
                    <!-- Text area -->
                    <div class="form-group">
                        <label class="control-label">Bericht</label>
                        <div class="inputGroupContainer">
                            <div class="input-group">
                                <span class="input-group-addon"><i class="glyphicon glyphicon-pencil"></i></span>
                                <textarea class="form-control" name="comment" placeholder="Project Description"></textarea>
                            </div>
                        </div>
                    </div>
                    <!-- Button -->
                    <div class="form-group">
                        <button type="submit" class="btn btn-warning">Verstuur <span class="glyphicon glyphicon-send"></span></button>
                    </div>
                </div>
            </div>
        </fieldset>
    </form>
</div>
</div>
<!-- /.container -->

解决方案和任务:

var co = require('co');
var assert = require('assert');
var fs = require('./index.js');

describe('.stats()', function () {
  it('should stat this file', co(function* () {
    var stats = yield fs.stat(__filename);
    assert.ok(stats.size);
  }));
});

我想到这个测试的方式是:var fs = require('fs'); /** * Create a yieldable version of `fs.stat()`: * * app.use(function* () { * var stats = yield exports.stat(__filename); * }) * * Hint: you can return a yieldable. */ exports.stat = function (filename) { return function (done) { fs.stat(filename, done); } }; 库为我们运行生成器函数,co调用,返回

fs.stat(__filename)

然后,我所有的问题都是:为什么匿名函数会在同一个地方返回function (done) { fs.stat(filename, done); } 以及fs.stat()回调的位置?我已经记录了这个回调,它是带有done对象的生成器next()方法作为传递参数,但我找不到stats中有关回调注入的任何信息。这是如何运作的?提前谢谢。

1 个答案:

答案 0 :(得分:0)

我无法在主README.md上找到此信息,但看起来co会自动回复 thunks 。因此,在上面的示例中,co提供了done回调并调用:

function (done) {
    fs.stat(filename, done);
}

如果有错误,这个回调期望main函数返回错误(done(err);),如果一切正常:done(null, result);。之后,结果将传递给生成器。这是done回调代码:

function () {
  if (called) return;
  called = true;
  next.apply(ctx, arguments);
}

好吧,让我们回到解决方案。 co的git README.md说:

  

Thunk支持仅用于向后兼容,可能会在co的未来版本中删除。

所以让我们用promises将其重写为现代视图:

exports.stat = function(filename) {
  return new Promise((resolve, reject) => {
    fs.stat(filename, (err, stats) => {
      if (err) {reject(err);}
      resolve(stats);
    });
  });
};

我们使用匿名函数包装promise,该函数获取filename值,并将其封装为返回的promise对象,这是co中支持的 yieldables 之一。此承诺通过回调启动fs.stat。如果一切正常,这个回调resolve是承诺,否则rejectresolve d结果返回到生成器。