Javascript: Generic getter/setter 用于显示模块模式

Javascript: Generic getter/setter for revealing module pattern

基本上我想做的是编写一个可重复使用的 getter/setter 来使用模块模式公开变量

// the getter/setter
function pub (variable) {
    return function (value) {
        return (arguments.length ? variable = value : variable);
    }
}

var module = (function () {

    var publicVariable = 0;

    function test () {
        return publicVariable;
    }

    return {
        publicVariable: pub(publicVariable),
        test: test
    }
})();

期望的结果如下:

module.publicVariable();      // 0
module.publicVariable(1);     // 1
module.publicVariable();      // 1
module.test();                // 1

但我得到的是:

module.publicVariable();      // 0
module.publicVariable(1);     // 1
module.publicVariable();      // 1
module.test();                // 0

我假设这是因为以下行将 publicVariable 的当前值传递给 pub,因此创建的唯一闭包是 pub 内的闭包并且没有 link 到变量本身。

publicVariable: pub(publicVariable),    // same as "pub(0)"

我知道 javascript 中无法通过引用传递。那么我还能如何完成我想做的事情呢?我不关心 props 是被函数调用还是 属性.

即以下任一项都可以

module.publicVariable = "new value";
module.publicVariable("new value");

我真的厌倦了写作:

function prop1f (value) {  return (arguments.length ? prop1 = value : prop1); }
function prop2f (value) {  return (arguments.length ? prop2 = value : prop2); }
function prop3f (value) {  return (arguments.length ? prop3 = value : prop3); }

return {
    prop1: prop1f,
    prop2: prop2f,
    prop3: prop3f
}

因为在具有大量用户可访问属性的大型项目中,这变得非常快。

问题是这段代码:

function pub (variable) {
    return function (value) {
        return (arguments.length ? variable = value : variable);
    }
}

可以作为 getter 完美工作,但作为 setter:如果您更改参数本身(变量),则不会影响输入参数的项目。但是,如果您更改参数的内部结构,它将传播回来。

您可以使用 javascript getters/setters:

var module = (function () {

    var publicVariable = 0;

    function test () {
        return publicVariable;
    }

    return {
        set publicVariable (value) {
            publicVariable = value;
        },
        get publicVariable () {
            return publicVariable;
        },
        test: test
    }
})();

module.publicVariable = 'New value';
console.log(module.publicVariable);

演示:

var module = (function () {

    var publicVariable = 0;

    function test () {
        return publicVariable;
    }

    return {
     set publicVariable (value) {
            publicVariable = value;
        },
        get publicVariable () {
         return publicVariable;
        },
        test: test
    }
})();

module.publicVariable = 'New Value';
console.log(module.publicVariable);
console.log(module.test());

另一个通用备选方案:

var module = (function () {

    var publicVariable = 0;

    function test () {
        return publicVariable;
    }

    return {
        //This function can access `publicVariable` !
        publicVariable: function(value) {
            return (arguments.length ? publicVariable = value : publicVariable);
        },
        test: test
    }

})();

module.publicVariable('new Value');
console.log(module.publicVariable());

演示:

var module = (function () {

    var publicVariable = 0;
    
    function test () {
        return publicVariable;
    }

    return {
        //This function can access `publicVariable` !
     publicVariable: function(value) {
         return (arguments.length ? publicVariable = value : publicVariable);
        },
        test: test
    }
    
})();

module.publicVariable('new Value');
console.log(module.publicVariable());