Javascript自动getter / setters（John Resig Book） [英] Javascript automatic getter/setters (John Resig Book)

问题描述

我正在阅读John Resig的 Pro Javascript Techniques ，我对一个例子感到困惑。这是代码：

I'm reading "Pro Javascript Techniques" from John Resig, and I'm confused with an example. This is the code:

// Create a new user object that accepts an object of properties
function User( properties ) {
  // Iterate through the properties of the object, and make sure
  // that it's properly scoped (as discussed previously)
  for ( var i in properties ) { (function(){
  // Create a new getter for the property
  this[ "get" + i ] = function() {
    return properties[i];
  };
  // Create a new setter for the property
  this[ "set" + i ] = function(val) {
    properties[i] = val;
  };
})(); }
}

// Create a new user object instance and pass in an object of
// properties to seed it with
var user = new User({
  name: "Bob",
  age: 44
});

// Just note that the name property does not exist, as it's private
// within the properties object
alert( user.name == null );

// However, we're able to access its value using the new getname()
// method, that was dynamically generated
alert( user.getname() == "Bob" );

// Finally, we can see that it's possible to set and get the age using
// the newly generated functions
user.setage( 22 );
alert( user.getage() == 22 );

现在在Firebug控制台上运行它（在FF3上）会抛出user.getname（）不是函数。我试过这样做：

Now running that on Firebug console (on FF3) throws that user.getname() is not a function. I tried doing this:

var other = User
other()
window.getname() --> this works!

它有效！

任何想法为什么？谢谢大家！

Any idea why? thanks everybody!

PS：我强烈推荐这本书。

PS: I strongly recommend this book.

编辑：

做：

var me = this;

似乎工作得更好，但在执行getname（）时它会返回'44'（第二个属性）...

seems to work a bit better, but when executing "getname()" it returns '44' (the second property)...

我发现奇怪的是它在没有修改的情况下对窗口对象有效...

also I find it strange that it worked on the window object without modification...

和第三个问题，PEZ解决方案和原始解决方案有什么区别？ （他不使用匿名函数）

and a third question, what's the difference between PEZ solution and the original? (he doesn't use an anonymous function)

感谢大家的反馈！ +1

Thanks to everyone for the feedback! +1

推荐答案

我开始这篇文章的唯一目的是为什么会发生这种事情，我终于做到了。所以如果有其他人对这里的为什么感兴趣，那么他们就是：

I started this post with the sole purpose of learning why that things happened, and I finally did. So in case there's someone else interested in the "whys" here they are:

为什么'这个'在匿名函数内发生变化？

一个新函数，即使它是一个匿名函数，在一个对象或另一个函数内声明，总是改变范围，在这种情况下返回全局范围（窗口）

A new function, even if it is an anonymous, declared inside an object or another function ALWAYS CHANGES THE SCOPE, in this case returning to the global scope (window)

解决方案：在帖子中都说明了，我认为更清晰的是用.call执行匿名函数（这个）

Solution: all stated in the post, I think the clearer is executing the anonymous function with .call(this)

为什么getname（）总是返回年龄？

当匿名函数立即执行时，getter / setters在调用时第一次执行。在那一刻， i 的值将始终是最后一个，因为它已经为所有属性迭代了......并且将始终返回属性[i]，这是最后一个值，在这种情况下是年龄。

While the anonymous function gets executed right away, the getters/setters get executed for the first time when they are called. In that moment, the value of i will always be the last because it has already iterated for all the properties... and will always return properties[i] which is the last value, in this case the age.

解决方案：将i值保存在这样的变量中

Solution: save the i value in a variable like this

 for ( i in properties ) { (function(){ 
  var j = i
  //from now on use properties[j]

基本上就是这样，如果我说错了，请说明我，因为我正在努力学习这个......

That's basically it, if I'm wrong in anything I said please correct me, since I'm trying to learn this...

再次感谢。

这篇关于Javascript自动getter / setters（John Resig Book）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！