JavaScript中的回调,回调,回调函数

Finally, we have made our way to Module 3 at the Flatiron School! And guess what that means?!? Javascript!! To be frank I am still trying to familiarize myself with Javascript and find my own rhythm and tune to this essential computer language. Javascript definitely reminds me of myself….all over the place!!! Let me summarize it to this clip my coach showed me.

最终,我们进入了Flatiron学校的单元3! 猜猜这是什么意思?! Javascript! 坦率地说,我仍在尝试使自己熟悉Javascript,并找到适合自己的节奏并适应这种基本的计算机语言。 Javascript绝对让我想起了自己……到处都是!!! 让我在教练向我展示的剪辑中总结一下。

Yeah, that is my own visual of what Javascript reminds me of. However, while learning about it I came across callback functions which is what this post is about, so let’s dive right in!

是的,那是我自己对Java脚本想起的印象。 但是,在学习它的过程中,我遇到了回调函数 ,这正是本文的内容,因此让我们深入研究吧!

什么是回调函数? (What exactly is a callback function?)

“A callback function is a function that is passed as an argument to another function but its expected to be called back (or executed ) at a later time.” One of the cool things about JavaScript is that we can pass functions as parameters and call them again inside a function.What does that look like, you say? I’ll be glad to show you.

“回调函数是一个作为参数传递给另一个函数的函数,但希望稍后再调用(或执行)。” 关于JavaScript的一件很酷的事情是,我们可以将函数作为参数传递,然后在函数内部再次调用它们,您说这看起来像什么? 我很乐意告诉你。

Image for post
You can see the callback function passed in as a parameter on line 1 then it is called back or being executed in line 2.
您可以看到回调函数在第1行作为参数传入,然后在第2行被回调或执行。

同步和异步回调函数 (Synchronous & Asynchronous Callback Functions)

So far I have come across two ways to execute a callback function. The first way is synchronous callback, where each function is being executed from top to bottom. A great way to think of it is when you are making a thanksgiving dinner and you have plenty of items on the menu. Common sense will tell you to multitask as much as you can to keep everything in rhythm but that doesn’t work with synchronous callbacks, but imagine baking a turkey and waiting for that to be done (we all know how long that can take) , when that task is completed then it goes to the next item on the menu. Just imagine the temperature of that thanksgiving meal when it is all said and done! That is finna be a wack thanksgiving dinner, I’m sorry.

到目前为止,我已经遇到了两种执行回调函数的方法。 第一种方法是同步回调,其中每个函数都从上到下执行。 想到这一点的一种好方法是当您准备感恩节晚餐时,菜单上有很多东西。 常识将告诉您尽可能多地执行多任务,以使所有内容保持节奏,但这不适用于同步回调,但请想象一下烤火鸡并等待它完成(我们都知道这需要多长时间),当该任务完成时,它将转到菜单上的下一个项目。 想象一下,说完之后,感恩节大餐的温度! 很抱歉,那是芬娜式的感恩节大餐。

Image for post
Synchronous CallBack Funtion
同步回叫功能

So thats pretty much what is happening with synchronous, one- after- the -other, nothing can happen until the initial task is complete. I’m sure someone may have found a benefit for the synchronous callbacks but if you are fetching from a large database, that can take a loooooonnngggg time before the rest of the code can run! Like she said….

因此,这几乎是同步的,一次接一个的发生的事情,直到完成初始任务之前什么也不会发生。 我敢肯定有人会发现同步回调有好处,但是如果您要从大型数据库中获取数据,那么可能需要花费很长的时间才能运行其余的代码! 就像她说的那样。

Our time doesn’t allow for this.
我们的时间不允许这样做。

We really don’t! But that is where the second type comes in! Which is Asynchronous callbacks, where the code doesn’t have to wait and it can continue to run. It allows those cases where the fetch can happen in the background but everything else can still run. Essentially, we don’t have to wait for that turkey to finish baking in the oven before proceeding to the other items on the menu. This is the one of the few times multitasking can work to our favor.

我们真的不! 但这就是第二种类型出现的地方! 这是异步回调 ,代码无需等待,它可以继续运行。 它允许在某些情况下可以在后台进行获取,但其他所有操作仍然可以运行。 从本质上讲,我们无需等待火鸡在烤箱中完成烘烤即可继续进行菜单上的其他项目。 这是多任务处理对我们有利的少数情况之一。

I found this cool image that visualizes asynchronous callbacks for my visual folks.

我发现了这张很酷的图像,它为我的视觉对象可视化了异步回调。

Image for post
Asynchronous Callback Function
异步回调功能

综上所述 (In Summary)

We’ve gotten a basic idea of what callback function are and the types that are available to us. Below I’ve shared some references for those that want to dig a bit deeper and learn more in depth. As you can tell I am still learning more about this and I am open to more resources that will allow me to dive in and be more comfortable using callback functions. So in conclusion:

我们已经了解了什么是回调函数以及我们可以使用的类型。 在下面,我分享了一些参考资料,供那些想深入了解并深入了解的人参考。 如您所知,我仍在学习更多有关此的知识,并且我愿意接受更多资源,这些资源将使我能够深入使用回调函数并感到更自在。 因此,结论是:

  • A callback function is a function that gets passed as an argument to a parent function.

    回调函数是一个作为参数传递给父函数的函数。
  • A callback can be used for synchronous or asynchronous execution.

    回调可用于同步或异步执行。
  • Callback allow us to write clean code and not have us continuing to repeat ourselves. We can easily call that function into another one if we eventually need said function to do something the callback is able to do.

    回调使我们可以编写简洁的代码,而不必继续重复自己的工作。 如果我们最终需要该函数来完成回调能够完成的工作,则可以轻松地将该函数调用到另一个函数中。

资源资源 (Resources)

翻译自: https://medium.com/@kosiazom/callback-callback-callback-functions-in-javascript-ae89ac0e7040

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值