Javascript 闭包对象属性访问器

Question

我认为我在关闭方面遇到了问题。我对 OOP JavaScript 还很陌生(我从本周开始...)，但我已经多次使用 JavaScript 进行一些 DOM 操作，以及 JQuery 魔法。我正在寻找一个不涉及改变我的标准的问题解决方案，因为我想尝试并最终学习正确的 JavaScript。我的标准是我希望解决方案能够维护我的封装和 Java 风格的公开访问的私有(private)变量。我的标准还需要解决方案能够教我一些有关闭包的知识，而无需重复 [thisPage] 中的示例:How do JavaScript closures work? 。

我在互联网上搜索了我的问题的解决方案，以及我找到的视频、我在学校红色的书籍、我红色的网页以及 S.O.我浏览过的帖子还没有给我一个很好的答案来解释为什么会发生这种情况。或者我真的无法理解闭包或任何这个问题......

我有一堂这样的课:

var Animal = {
    $name: "Blank",
    $age: -1,
    setName: function(n) {this.name=n;},
    setAge: function(a) {this.age=a;}
};

之后我会调用...

Moose.prototype = Object.create(Animal);
Moose.prototype.constructor = Moose;
function Moose(newName, newAge) {
    this.setName(newName);
    this.setAge(newAge);
}

this.setName() 中的 this 执行了我想要的操作，找到 Animal 并为我的驼鹿添加一个名称，而不会导致其 Moose 弟兄也被称为“moosey” moose mDonkeybutt”什么的......

然后，如果您愿意，我可以在控制台中成功创建两个“Meese”或 Moose，并且每个都有自己的单独值。就像...

m1 = new Moose("MooseyMoose", 420);
m2 - new Moose("MooseMcTingles", 69);

检查时 m1 不会与 m2 具有相同的值。这就是我对多年来使用过的其他语言的期望……然而，这就是我感到困惑的地方，或者至少是盯着我的计算机，比如，哇，“这是什么鬼？”

我想添加某种能力来衡量每只动物随时间的移动情况。所以我想，嘿，为什么不花点时间使用对象文字的强大功能和简单性将其存储在我的类中......就像这样......

var Animal = {
    $name: "Blank",
    $age: -1,
    $position: {x:-1,y:-1},
    setName: function(n) {this.name=n;},
    setAge: function(a) {this.age=a;},
    getName: function() { return this.name; }
};

所以我在访问器中添加了一些额外的负载...

var Animal = {
    $name: "Blank",
    $age: -1,
    position: {x:-1,y:-1}, //I have tried $ and without
    setName: function(n) {this.name=n;},
    setAge: function(a) {this.age=a;},
    getName: function() { return this.name; },

    //New Accessor
    setPosition: function(newX, newY) {
        this.position.x = newX;
        this.position.y = newY;
    }
};

我确信经验丰富的程序员在读到这一点时会说……真是个白痴。问题是我还没有阅读、搜索或找到答案来拥有我的啊哈!!接下来的部分。如果你已经猜到我会做错什么，你可能应该回答。 到底为什么这会导致 m1 和 m2 现在在位置上具有相同的共享值？这并不是因为它公开声明我已经尝试过也有一个私有(private)作用域，这只会让 this 更难找到正确的原型(prototype)。

我在这个 block 上尝试了这么多版本的代码，试图弄清楚为什么我似乎无法将我的位置存储为一个易于访问的简单的小对象文字...我需要 Moose() 的所有实例无法使用上面的 setPosition() 函数更改彼此的位置....

还有。我尝试将其全部转换为 function 对象而不是 var 对象，并且我还尝试删除许多我知道没有达到范围的 this 组合我需要，但还没有运气。我还尝试删除 .create() 方法的使用并切换到 new 关键字，但也没有成功。

编辑:回复 ppl...就像我说的，我已经尝试过所有方法，包括向位置变量添加 getter setter 方法。它根本没有帮助，它仍然具有共享值(value)......

Answer 1

让我们一步一步来。

Do you have a member called position defined in Moose constructor?

没有。

Then how the objects of Moose get position?

通过继承。由于 Moose.prototype 设置为 Animal 类型的对象，因此当您说 m1.position 时，JavaScript 会搜索 m1 为 position ，它在继承阶梯中向上移动，在 Moose.prototype 对象中找到它。此搜索对于 m1 和 m2 都很常见。因此，他们都在 Moose.prototype 中找到了相同的 Animal 对象。您可以确认这一点，就像这样

console.log(m1.position === m2.position);
# true

How do we get around this?

简单。不要在Parent对象中定义子对象的成员变量。只需将 position 的定义移至 Moose 构造函数即可。现在，当 JavaScript 搜索 m1.position 和 m2.position 时，它们都将拥有自己的 position 副本:-)