JavaScript getter 和 setter答案

【问题标题】：JavaScript getter and setterJavaScript getter 和 setter
【发布时间】：2013-10-09 15:40:52
【问题描述】：

这是一个非常基本的问题，我确定它是重复的，所以我提前道歉，但这是我编写对象的方式，我会这样说：

myApplication.myFirstMethod(x);
x = myApplication.myFirstMethod();

代码如下：

myApplication = {};
(function() {
    myApplication.myFirstMethod = function() {
        var local = {};
        if (arguments.length) {
            local.result = arguments[0];
        }
        return local.result;
    }
    myApplication.mySecondMethod = function() {
        var local = {};
        if (arguments.length) {
            local.result = arguments[0];
        }
        return local.result;
    }
})();

【问题讨论】：

在此示例中包含您的第二种方法的目的是什么？此外，local 在函数执行后失去作用域。
mySecond 方法的目的是表明 local 仅在 myFirstMethod 范围内。
我正在尝试编写一个使用闭包的 jQuery 风格的 getter 和 setter 函数。
或许更适合code review？
什么是“jQuery 风格的 getter 和 setter”？你是说你想重载一个函数，这样当你传递一个参数时它会设置一个值，当你不传递一个时，它会得到这个值？

标签： javascript getter-setter

【解决方案1】：

jsFiddle Demo

更面向对象的方法是使用实例化和原型。

设置

var Application = function(){
 this.local = {};  
};
Application.prototype.Value = function(){
 if (arguments.length) {
    this.local.result = arguments[0];
 }else{
    return this.local.result;
 } 
};

二手

var app = new Application();
app.Value(6);
alert(app.Value());//6

从 jQuery 的角度来看，他们会首先筛选是否有参数，这段代码直接来自他们的源代码，用于 val 函数：

val: function( value ) {
    if ( !arguments.length ) {
        var elem = this[0];
...

然后它继续使用元素的原生 API 和其他一些指标来获取元素的值（通常，唯一会从 val 返回值的元素类型将是诸如 @ 之类的元素987654330@、select 等 - 基本上是表单元素）。

在if 块的末尾，它会尝试根据是否找到附加到元素（或元素集）的值来返回各种结果。这保证了“设置”子句在遇到“获取”时永远不会执行。如果情况是使用了“set”，它会通过一组稍微复杂的代码来正确地为元素设置一个值。

代码显示val: function() 的原因是因为它是一个对象的一部分，该对象用于使用jQuery 的extend 功能“扩展”jQuery 原型。

This is the exact code in a jsfiddle of jQuery's val function

【讨论】：

真的是这样吗？我只是问，因为我对原型关键字有点害怕。我要去看看 jQuery，看看 Resig 是怎么做的。
@Phillip - jQuery 确实使用了prototype。在 jQuery 中，prototype 存储在 .fn 位置。这是 jQuery 的 all 扩展挂钩的地方。 stackoverflow.com/a/16026484/1026459
@Phillip - 有关 jQuery 实现类似功能（val 函数）的更多详细信息，请参阅我的编辑。
谢谢特拉维斯！现在，this.local.result 呢？如果我有第二种方法，那么 this.local.result 也将在其范围内。我试图将 arguments[0] 的值仅保留在每个方法中。
@Phillip - 使用this.local 会将local 附加到Application 对象（从而使其作用于应用程序）。如果您希望将其仅用于函数，则不应将其与this. 一起使用，而应与var 一起使用。原因是，当使用new 时，它会从函数中创建一个函数对象。那时，this 将引用该对象的实例，而不是在没有父作用域时引用 window。附加到this 本质上附加到对象。总之，如果您希望变量本地化，请在扩展函数中使用 var。

【解决方案2】：

创建这样的对象有很多模式，每个人都有自己的最爱。 Addy Osmani 出色地总结了他的 Javascript 设计模式“书”中最流行的模式。具体来说，这部分：

http://addyosmani.com/resources/essentialjsdesignpatterns/book/#designpatternsjavascript

我每半年重读一次，只是为了确保我的箭袋中的所有模式都保持不变。

【讨论】：

这是一个非常棒的资源。我可能应该买那本书。
This looks fun and interesting.