javascript学习指南之回调问题

getDirectories(function(dirs) {  getFiles(dirs[0], function(files) {    getContent(files[0], function(file, content) {      console.log('filename:', file);      console.log(content);    });  });}); function getDirectories(callback) { setTimeout(function() {  callback(['/home/ben']); }, 1000);} function getFiles(dir, callback) {  setTimeout(function() {    callback([dir + '/test1.txt', dir + '/test2.txt']);  }, 1000)} function getContent(file, callback) {  setTimeout(function() {    callback(file, 'content');  }, 1000)}

ES6 Promise

Promise 是一种异步编程的解决方案，是解决回调地狱问题的利器。

Promise 在 JavaScript 生态圈被主流接受是在 2007 年 Dojo 框架增加了 dojo.Deferred 的功能。随着 dojo.Deferred 的流行，在 2009 年 Kris Zyp 提出了 CommonJS Promises/A 规范。随后生态圈中出现了大量 Promise 实现包括 Q.js、FuturesJS 等。当然 Promise 之所有这么流行很大程度上是由于 jQuery 的存在，只是 jQuery 并不完全遵守 CommonJS Promises/A 规范。随后正如大家看到的，ES 6 规范包含了 Promise。
MDN 中对 Promise 是这样描述的：

Promise 对象是一个返回值的代理，这个返回值在promise对象创建时未必已知。它允许你为异步操作的成功或失败指定处理方法。 这使得异步方法可以像同步方法那样返回值：异步方法会返回一个包含了原返回值的
以下的代码是「回调地狱」一节中的示例通过 Promise 实现，看上去代码也不是很简洁，但是比起传统的层级回调有明显改善，代码可维护性和可读性更强。

getDirectories().then(function(dirs) {  return getFiles(dirs[0]);}).then(function(files) {  return getContent(files[0]);}).then(function(val) {  console.log('filename:', val.file);  console.log(val.content);}); function getDirectories() {  return new Promise(function (resolve, reject) {    setTimeout(function() {    resolve(['/home/ben']);   }, 1000);  });} function getFiles(dir) {  return new Promise(function (resolve, reject) {    setTimeout(function() {      resolve([dir + '/test1.txt', dir + '/test2.txt']);    }, 1000);  });} function getContent(file) {  return new Promise(function (resolve, reject) {    setTimeout(function() {      resolve({file: file, content: 'content'});    }, 1000);  });}

co(function* (){  var dirs = yield getDirectories();  var files = yield getFiles(dirs[0]);  var contentVal = yield getContent(files[0]);  console.log('filename:', contentVal.file);  console.log(contentVal.content);});

runGenerator(); function* run(){  var dirs = yield getDirectories();  var files = yield getFiles(dirs[0]);  var contentVal = yield getContent(files[0]);  console.log('filename:', contentVal.file);  console.log(contentVal.content);} function runGenerator(){  var gen = run();   function go(result){    if(result.done) return;    result.value.then(function(r){      go(gen.next(r));    });  }   go(gen.next());}

run();async function run() {  var dirs = await getDirectories();  var files = await getFiles(dirs[0]);  var contentVal = await getContent(files[0]);  console.log('filename:', contentVal.file);  console.log(contentVal.content);}