这个 javascript 代码是如何工作的？

Question

我知道调用 routes() 并分配给 x 会将一个对象 fun 分配给 it.But 调用 x.getData() 它 returns person.How 它可以 return 路由函数本地的人员对象？我对最后两行特别感兴趣。

var routes=function(){
    var person={
        fname:'Roger',
        lname:'Federer',
        city:'Paris'
    }

    var fun={
        getData:function(){
            return person
        }
    }

    return fun;

}

var x=routes();

console.log(x.getData());

Answer 1

这是关于 JS 闭包和词法作用域的： fun 对象内的函数 getData 可以访问 routes 对象的范围。 "You don't know JS" 书中有详细解释。

https://github.com/getify/You-Dont-Know-JS/blob/master/scope%20&%20closures/ch5.md

Answer 2

仔细看流量：

var routes = function() {
    var person = {
        fname: 'Roger',
        lname: 'Federer',
        city: 'Paris'
    }

    var fun = {
        getData:function() {
            return person
        }
    }

    return fun;
}

var x = routes();
console.log(x.getData());

首先你定义了匿名函数。

调用匿名函数时：

定义对象person（本地在其内部范围内）
定义对象fun（也在它自己的内部范围内）

当它定义 fun 时，它还定义了 getData() 方法 returns person - 在外部作用域中声明（在我们刚才的最外层匿名函数中描述）。
最外层的匿名函数通过 returning fun 结束。

然后你调用匿名函数。（通过routes()。）

调用 routes() returns fun，这意味着您可以执行 routes().getData() 并通过 getData:function() { 声明解析。

正如我们所说，return 是来自最外层匿名函数作用域的 person 对象。 getData() 的定义可以访问它 - 所以它得到解决 OK.

当您调用 var x = routes() 时，您捕获了 routes() 的 return 值 - 即 fun 因为这就是 routes() returns .您刚刚通过更复杂的路线到达 x.getData()。没有错！

简而言之：

x 是由 routes()

编辑的 fun 对象 return

fun 有一个名为 getData() 的方法，它 returns person

person 恰好在匿名函数的范围内定义 - 您在调用 routes() 时执行了该函数（具体来说，您执行了 var x = routes(); - 这触发了 person).

我希望这是有道理的。

这不是 "super obvious"，但是如果您逐行按照执行顺序，代码很容易理解，请记住（或纸上）范围和变量值。

更新： 其他人提供了关于 JavaScript 关闭主题的有价值的阅读链接。阅读那些。它会教你我上面陈述的东西。他们更值得（恕我直言）投赞成票。我的回答只是对您提供的代码执行的解释——而不是对闭包的演练。 :)

这个 javascript 代码是如何工作的？

How does this javascript code works?

javascript

javascript-objects