jjzjj

JavaScript : Calling Recursive Functions With Promises

coder 2024-05-14 原文

语言:JavaScript


递归 - 不是我最喜欢的主题。

Promises - 它们可能会让人感到困惑。

递归 + Promises - 我需要在软垫房间里编程。

我做了这个小 JS Fiddle 拼图,我称之为 The RecursiveFunHouse作为通过将问题简化为愚蠢的事情来保持我理智的喜剧方式。希望你们能从我的痛苦中得到欢笑 :)

问题:

每个递归调用都依赖于前一个调用的结果,但为了获得结果,我必须运行一个异步任务并在其他子任务中使用该结果。

“递归 Playground ”帮助我将问题归结为这一点 - 由于子任务仍在执行,原始递归循环继续使用未定义的值。

The Fun House - 循环收集介于 (-99) 和 99 之间的随机数。一旦最后一个数字和新数字之间的最后一个差值为正,乐趣就结束了

打印“Made it here 1...Made it here 6”应该表明子任务已正确处理,我们有下一个循环的值。

当前它打印 1,2,3,6,4,5 :(

递归FunHouse.js

var recursiveFunHouse = function(num){
    console.log("Made it here 1");
    var newNum = performSideTasks();

    console.log("Made it here 6");
    console.log("newNum");
    console.log(newNum);
    if(newNum-num >0 ){
            recursiveFunHouse(newNum);
    }
    else{
        console.log("The FunHouse Generated These Numbers :")
      for(var i = 0; i <numList.length; i++){
         console.log(numList[i]);
      }
    }

};

var performSideTasks = function(){
    console.log("Made it here 2");
    someAsyncTask().then(function(num){
            anotherTask(num);
      console.log("made it here 5");
      return num;
        });


}

var someAsyncTask = function(){
  return new Promise (function(resolve, reject) {
    console.log("made it here 3");
    var randNum = Math.floor(Math.random()*99) + 1; 
    randNum *= Math.floor(Math.random()*2) == 1 ? 1 : -1;   

    setTimeout(function() { 
      numList.push(randNum)
      resolve(randNum)
    }, 100);
  });
}




var anotherTask = function(num){
  console.log("made it here 4");
    console.log(num);

};

var numList= [];

recursiveFunHouse(20);

注意 - 请原谅我可悲的 return 语句 return num; 它只是显示了我希望我可以告诉我的计算机的内容。

关于递归和 Promises 的问题:

1) 首先,我是否应该担心进入​​下一个递归循环且 promise 尚未解决?

2) 如果不是,保持此函数分解并强制每个递归循环等待最后一次调用的解决的干净方法是什么?


递归和 Promises 有时看起来就像 95 级巫师一样神奇……这就是我要说的。问题完成。

最佳答案

在经典的同步递归中,递归状态存储在从公共(public)执行堆栈中推送和弹出的堆栈帧中。在异步递归中,递归状态可以存储在从公共(public) promise 链的头部推送和弹出的 Promise 对象中。例如:

function asyncThing( asyncParam) { // example operation
  const promiseDelay = (data,msec) => new Promise(res => setTimeout(res,msec,data));
  return promiseDelay( asyncParam, 1000); //resolve with argument in 1 second.
}

function recFun( num) { // example "recursive" asynchronous function

    // do whatever synchronous stuff that recFun does when called
    //      ...
    // and decide what to do with async result: recurse or finish?

    function decide( asyncResult) {
        // process asyncResult here as needed:
        console.log("asyncResult: " + asyncResult); 
        if( asyncResult == 0)
            console.log("ignition");

        // check if further recursion is needed:
        if( asyncResult < 0)
            return "lift off"; // no, all done, return a non-promise result
        return recFun( num-1); // yes, call recFun again which returns a promise
    }

    // Return a promise resolved by doing something async and deciding what to do.
    // to be clear the returned promise is the one returned from the .then call

    return asyncThing(num).then(decide);
}

// call the recursive function
recFun( 5)
.then( function(result) {console.log("done, result = " + result); })
.catch( function(err) {console.log("oops:" + err);});

运行代码看看效果。

此示例所依赖的核心原则(魔法):

  1. then 监听器函数的注册返回一个挂起的 promise 。如果一个监听器被调用并从执行中返回,则监听器返回值解析挂起的 promise 。如果监听器抛出错误而不是返回,则挂起的 promise 将被抛出的值拒绝。
  2. 不能用 promise 来兑现 promise 。如果一个监听器返回一个 promise ,它被插入到 promise 链剩余部分的头部,在从监听器注册返回的 promise 之前。来自监听器注册的 promise (以前是剩余 promise 链的头部)然后与插入的 promise 同步,在最终结算时采用其状态和值(value)。
  3. promise 链的所有 promise 对象和链接都是在定义链的代码执行时同步创建的。然后定义代码运行完成(这意味着它返回到事件循环而不会被异步回调中断,因为 JavaScript 是单线程的)。

如果和当监听器函数被执行时(因为一个 promise 被履行或被拒绝)它们将异步执行,在它们自己从事件循环中调用,在导致监听器被执行的代码本身运行完成之后。

这意味着在注册 promise 监听器(通过对 promise 调用 then)时生成的所有 日志条目出现在 任何 由在以后异步执行时注册监听器函数。 promise 不涉及时间旅行。

这会阻止您的头部受伤吗?也许不是,但至少这是真的。

`

关于JavaScript : Calling Recursive Functions With Promises,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34711403/

有关JavaScript : Calling Recursive Functions With Promises的更多相关文章

  1. ruby-on-rails - 使用 javascript 更改数据方法不会更改 ajax 调用用户的什么方法? - 2

    我遇到了一个非常奇怪的问题,我很难解决。在我看来,我有一个与data-remote="true"和data-method="delete"的链接。当我单击该链接时,我可以看到对我的Rails服务器的DELETE请求。返回的JS代码会更改此链接的属性,其中包括href和data-method。再次单击此链接后,我的服务器收到了对新href的请求,但使用的是旧的data-method,即使我已将其从DELETE到POST(它仍然发送一个DELETE请求)。但是,如果我刷新页面,HTML与"new"HTML相同(随返回的JS发生变化),但它实际上发送了正确的请求类型。这就是这个问题令我困惑的

  2. ruby - 在 Mechanize 中使用 JavaScript 单击链接 - 2

    我有这个:AccountSummary我想单击该链接,但在使用link_to时出现错误。我试过:bot.click(page.link_with(:href=>/menu_home/))bot.click(page.link_with(:class=>'top_level_active'))bot.click(page.link_with(:href=>/AccountSummary/))我得到的错误是:NoMethodError:nil:NilClass的未定义方法“[]” 最佳答案 那是一个javascript链接。Mechan

  3. javascript - jQuery 的 jquery-1.10.2.min.map 正在触发 404(未找到) - 2

    我看到有关未找到文件min.map的错误消息:GETjQuery'sjquery-1.10.2.min.mapistriggeringa404(NotFound)截图这是从哪里来的? 最佳答案 如果ChromeDevTools报告.map文件的404(可能是jquery-1.10.2.min.map、jquery.min.map或jquery-2.0.3.min.map,但任何事情都可能发生)首先要知道的是,这仅在使用DevTools时才会请求。您的用户不会遇到此404。现在您可以修复此问题或禁用sourcemap功能。修复:获取文

  4. ruby-on-rails - 我将 Rails3 与 tinymce 一起使用。如何呈现用户关闭浏览器javascript然后输入xss? - 2

    我有一个用Rails3编写的站点。我的帖子模型有一个名为“内容”的文本列。在帖子面板中,html表单使用tinymce将“content”列设置为textarea字段。在首页,因为使用了tinymce,post.html.erb的代码需要用这样的原始方法来实现。.好的,现在如果我关闭浏览器javascript,这个文本区域可以在没有tinymce的情况下输入,也许用户会输入任何xss,比如alert('xss');.我的前台会显示那个警告框。我尝试sanitize(@post.content)在posts_controller中,但sanitize方法将相互过滤tinymce样式。例如

  5. ruby - 使用 Selenium WebDriver 启用/禁用 javascript - 2

    出于某种原因,我必须为Firefox禁用javascript(手动,我们按照提到的步骤执行http://support.mozilla.org/en-US/kb/javascript-settings-for-interactive-web-pages#w_enabling-and-disabling-javascript)。使用Ruby的SeleniumWebDriver如何实现这一点? 最佳答案 是的,这是可能的。而是另一种方式。您首先需要查看链接Selenium::WebDriver::Firefox::Profile#[]=

  6. ruby - Watir-Webdriver 是否支持点击目标为 javascript 的链接? - 2

    我是Ruby和Watir-Webdriver的新手。我有一套用VBScript编写的站点自动化程序,我想将其转换为Ruby/Watir,因为我现在必须支持Firefox。我发现我真的很喜欢Ruby,而且我正在研究Watir,但我已经花了一周时间试图让Webdriver显示我的登录屏幕。该站点以带有“我同意”区域的“警告屏幕”开头。用户点击我同意并显示登录屏幕。我需要单击该区域以显示登录屏幕(这是同一页面,实际上是一个表单,只是隐藏了)。我整天都在用VBScript这样做:objExplorer.Document.GetElementsByTagName("area")(0).click

  7. 网页设计期末作业,基于HTML+CSS+JavaScript超酷超炫的汽车类企业网站(6页) - 2

    🎉精彩专栏推荐💭文末获取联系✍️作者简介:一个热爱把逻辑思维转变为代码的技术博主💂作者主页:【主页——🚀获取更多优质源码】🎓web前端期末大作业:【📚毕设项目精品实战案例(1000套)】🧡程序员有趣的告白方式:【💌HTML七夕情人节表白网页制作(110套)】🌎超炫酷的Echarts大屏可视化源码:【🔰Echarts大屏展示大数据平台可视化(150套)】🔖HTML+CSS+JS实例代码:【🗂️5000套HTML+CSS+JS实例代码(炫酷代码)继续更新中…】🎁免费且实用的WEB前端学习指南:【📂web前端零基础到高级学习视频教程120G干货分享】🥇关于作者:💬历任研发工程师,技术组长,教学总监;

  8. ruby-on-rails - 在页面的最底部包含 javascript 文件 - 2

    我有一个Rails应用程序。还有一个javascript(javascript1.js)文件必须包含在每个View的最底部。我把它放在/assets/javascripts文件夹中。Application.js包含以下代码//=requirejquery//=requirejquery_ujs//=someotherfiles//=require_directory.即使Application.js中不包含javascript1.js,它也会自动包含,不是吗?那么我怎样才能做我想做的事呢? 最佳答案 单独定义、包含和执行您的java

  9. ruby-on-rails - 为 rails 中的 javascript 生成完整的 url(类似于 javascript_path,但是是 url) - 2

    如何生成指向javascript文件的绝对链接。我想应该有类似下面的东西(不幸的是它似乎不可用):javascript_url'main'#->'http://localhost:3000/javascripts/main.js'代替:javascript_path'main'#->'/javascripts/main.js'我需要绝对URL,因为该javascript文件将用于书签。另外我需要相同的css文件。谢谢,德米特里。 最佳答案 javascript和css文件的绝对URL现在在Rails4中可用ActionView::H

  10. ruby - 处理在 keyup 事件上发生的 javascript 弹出窗口 - 2

    我在HTML页面上有一个文本字段,用于检查您是否输入了1到365之间的值。如果用户输入了无效值,如非数字字符或不在范围内的值,它显示一个弹出窗口。我在watirwiki上看到有一个select_no_wait方法,用于在您从列表中选择无效值时关闭弹出窗口。处理键盘事件时出现的弹出窗口的好方法是什么?我是否需要按照select_no_wait方法的实现方式进行操作,或者我们是否可以启动一个不同的进程来消除调用set方法时可能出现的弹出窗口。带有Javascript验证函数的HTML文件示例如下:varnum=0functionvalidate(e){varcharPressed=Stri

随机推荐