如何避免在函数中调用函数

How can I avoid calling a function within a function?

本文关键字：函数 调用 何避免      更新时间：2023-09-26
#branchID pool
branch0 = "This is a wall of text. This is another wall of text! This is a third wall of text. This is a fourth wall of text. This is a fifth wall of text. This is a sixth wall of text. #branch1%"  
branch1 = "This is a second wall of text."
branch2 = "This is a third wall of text."
loopcounter = 0
#classes section
  #pulls text from pools above.
branch = (name, branchid)->
  alert('begin loop')
  stringID = String(branchid)
  document.write("<h1 id=''#{stringID}''>#{name}</h1>")
  document.getElementById(stringID).onclick = ->
    for i in [loopcounter...stringID.length]
      if branchid[i]!= "." and branchid[i]!="!" and branchid[i]!="?" and branchid[i]!="#"
        document.write(branchid[i])
      else if branchid[i]=="#"
          j = i+1
          for k in [j...stringID.length]
            if branchid[k] == "%"
              j = k+1
              alert("switchblock")
              switch fcode
                when "branch1" then branch('stuff', branch1)
                when "branch2" then branch('stuff2', branch2)
                else break
              break
            else
              alert("gathering...")
              fcode = ""
              fcode += branchid[k]
      else
        alert('end sentence')
        document.write(branchid[i])
        loopcounter = i+1
        break
#This is where the code is executed.
window.onload = ->  
  branch("Start", branch0)

我上面的代码是选择自己的冒险游戏书的开始。

我的代码通过执行一个函数来工作，该函数一次从长字符串中提取一个句子的文本并将其写入 HTML 文档。

我遇到的问题是，当字符串没有剩余文本时，我需要再次调用相同的函数，但这次使用不同的参数，以便可以在屏幕上显示不同的字符串。鉴于我目前的情况，我不得不在它自己的功能内调用它，但我有一种感觉，这导致了一些问题。当我尝试运行我的代码时，它以一种我真的不理解的方式运行并写入文档而不是执行新函数

欢迎任何一般建议或具体诊断。在这一点上，我只是有点困惑，不知道从这里开始。也许我没有正确考虑这个问题？顺便说一下，我最近从堆栈溢出中获得了很多帮助。非常感谢。你们真是太棒了。

**我扔了一堆警报框，这样我就可以尝试弄清楚循环在做什么。

代码笔发布：http://codepen.io/bryanwillis7/pen/WwMPaw

以下是您要执行的操作的简化。

现场演示：

https://jsfiddle.net/69r0xq9y/

一般来说，我建议将数据组织成对象并以这种方式使用。字符串分析可能会导致一些不必要的不可读代码。

.HTML：

<h1 id="name">
  <!-- Branch name inserted here -->
</h1>
<p id="text">
  <!-- Branch text inserted here -->
</p>
<div id="options">
  <!-- Branch options inserted here -->
</div>

咖啡脚本：

#branchID pool
branches = 
  branch0:
    name: "Start"
    text: "There is a path to a forest and a path to a castle. Where do you want to go?"
    options: 
      branch1: "Forest"
      branch2: "Castle"
  branch1: 
    name: "Forest"
    text: "You are in a forest."
    options:
      branch0: "Go back to start"
  branch2: 
    name: "Castle"
    text: "You are in a castle."
    options:
      branch0: "Go back to start"
#classes section
#pulls text from pools above.
branch = (branchid)->
  document.getElementById('name').innerHTML = branches[branchid].name
  document.getElementById('text').innerHTML = branches[branchid].text
  document.getElementById('options').innerHTML = ''
  for targetBranch,buttonText of branches[branchid].options
    createOption(targetBranch, buttonText)
createOption = (branchid, text) ->
  button = document.createElement('button')
  button.innerHTML = text
  button.onclick = ->
    branch(branchid)
  document.getElementById('options').appendChild(button)
#This is where the code is executed.
window.onload = ->  
  branch("branch0")
哇，

这是一个昏昏欲睡，但我想我已经让它工作了：

#branchID pool
branch0 = "This is a wall of text. This is another wall of text! This is a third wall of text. This is a fourth wall of text. This is a fifth wall of text. This is a sixth wall of text. #branch1%"  
branch1 = "This is a second wall of text."
branch2 = "This is a third wall of text."

#classes section
  #pulls text from pools above.
branch = (name, branchid)->
  loopcounter = 0
  alert('begin loop')
  stringID = String(branchid)
  document.write("<h1 id=''#{stringID}''>#{name}</h1>")
  document.getElementById(stringID).onclick = ->
    for i in [loopcounter...stringID.length]
      if branchid[i]!= "." and branchid[i]!="!" and branchid[i]!="?" and branchid[i]!="#"
        document.write(branchid[i])
      else if branchid[i]=="#"
          j = i+1
          fcode = ""
          for k in [j...stringID.length]
            if branchid[k] == "%"
              j = k+1
              alert("switchblock")
              switch fcode
                when "branch1" then return branch('stuff', branch1)
                when "branch2" then return branch('stuff2', branch2)
                else break
              break
            else
              alert("gathering...")
              fcode += branchid[k]
      else
        alert('end sentence')
        document.write(branchid[i])
        loopcounter = i+1
        break
#This is where the code is executed.
window.onload = ->  
  branch("Start", branch0)

好吧，所以我只需要改变几件事。我把fcode移出switch块，把它放在k循环之前。另外，我在branch函数作用域中定义了loopcounter，否则它不会重置，并且您会遇到index out of bounds问题，这将导致它打印undefined大约一百万次。最后，我在递归调用之前添加了return。这会使父函数停止执行。

不过，老实说，我认为您应该认真考虑将其重构为更小的部分。所有这些嵌套循环使得很难跟踪正在发生的事情。尝试创建一个函数来检查这是否是句子的结尾，另一个函数用于检查您是否正在开始一个新分支，另一个用于收集字符串。

在较小的块中制作代码也将使以后更容易测试和更改。

希望有帮助。

相关文章：