吊装 分析 软件_我如何理解js中的吊装

吊装 分析 软件

Take a look at the code below:

看下面的代码：

function bigDoll() {  function littleDoll() {
    return 'i am little'
  }  return littleDoll()  function littleDoll() {
    return 'no I am little!'
  }}bigDoll()

What do you think will be the return value?

您认为返回值是多少？

This took me some time to understand, so I’ll try my best to explain what’s going on here.

这花了我一些时间来理解，因此我将尽力解释这里发生的情况。

First, we can say that the function bigDoll() is written in the global execution context which is also viewed as the first stack in the call stack. Both littleDoll() functions are written inside of bigDoll() so we can say that the littleDoll() functions are written in the function execution context. When the JS engine runs the bigDoll(), it sees a return value of littleDoll(). But at this point, we don’t know what littleDoll() is.

首先，我们可以说函数bigDoll()是在全局执行上下文中编写的，该上下文也被视为调用堆栈中的第一个堆栈。 这两个littleDoll()函数都是在bigDoll()内部编写的，因此可以说，littleDoll()函数是在函数执行上下文中编写的。 当JS引擎运行bigDoll()时，它看到的返回值为littleDoll()。 但是目前，我们还不知道littleDoll()是什么。

Let’s visualize this:

让我们将其可视化：

function bigDoll() {  function littleDoll() {
    return 'i am little'
  }  littleDoll()   function littleDoll() {
    return 'no I am little!'
  }}bigDoll()

Okay, so what is the value of littleDoll() ? Well, inside of first littleDoll() the function’s return value is ‘i am little’. Ok great.But hang on.We’re still not done executing bigDoll().There’s a second littleDoll() and now, this tells the JS engine to REWRITE the value in littleDoll() that’s stored in memory to equal this new value: ‘no I am little!’. Which is why…

好的，那么littleDoll()的值是什么？ 好吧，在第一个littleDoll()内部，函数的返回值是“我很小”。 好的，但是等等，我们仍然没有完成bigDoll()的执行，还有第二个littleDoll()，现在，这告诉JS引擎重新写入存储在内存中的littleDoll()中的值等于这个新值： “不，我很小！”。 这就是为什么…

…the return value of bigDoll() is…

…bigDoll()的返回值为…

…

…

‘no I am little!’

“不，我很小！”

Hope you got that right and I hope I explained this well. If not, let me know! I’d be happy to make revisions!

希望你做对了，我希望我能解释得很好。 如果没有，请告诉我！ 我很乐意进行修改！

Code example courtesy of ZeroToMastery.

代码示例由ZeroToMastery提供。

❤ Happy coding ❤

❤快乐编码❤

翻译自: https://medium.com/swlh/how-i-understand-hoisting-in-js-d1b7379f1d52

吊装 分析 软件