带有Objects的JavaScript构造函数

时间:2013-09-24 10:22:29

标签: javascript object-literal

我已经开始尝试学习如何更广泛地使用JavaScript对象,并且我一直在尝试用JavaScript编写一个Object,它允许我在初始化时设置一些Constructor参数。

我必须说,JavaScript中有很多不同的“design patterns”,我可能会对语法和诸如此类的东西感到困惑。通过我的研究,我发现了各种StackOverflow文章,例如:

  1. JavaScript constructors using JavaScript object literal notation
  2. Constructors in JavaScript objects
  3. 我想用我的对象设置一些内部/私有变量,如下所示初始化:

    <script>
       var TestObj = new Dispatch( 100 );
       console.log( TestObj.getConstructorValue() );
       //Would Return 100.
    </script>
    

    虽然当前,对象的构建方式当前Test在初始化后尝试访问时返回undefined:

    <script>    
        $(document).on('ready', function(){     
            var TestObj = new Dispatch( 100 );
    
            //Set post-initialised variables & set to '5'
            TestObj.setOrderNumber( 5 ); 
    
            //Retrieves 5
            console.log( "Accessing Property: " + TestObj.OrderNumber ); 
    
            //Method for getting orderNumber Property, Returns 5
            console.log( "Method for Order Number: " + TestObj.getOrderNumber() );
    
            //Method for getting would-be constructor value
            console.log( TestObj.getTest() ); //Returns Undefined
            console.log( TestObj.Test ); //Returns Undefined
    
        });
    </script>
    

    的JavaScript

    <script>
        /**
         *   
        **/
        var Dispatch = function( Arg1 ) {
    
            var OrderNumber;
            var Test;
    
            var setOrderNumber = function( orderNum ) {
                this.OrderNumber = orderNum;
            };
    
    
            this.constructor = function( str ) {
                this.Test = str;
            };
    
            this.constructor( Arg1 );
    
            return {
    
                /**
                 *  Getter for OrderNumber
                    **/
                getOrderNumber : function(){
                    return this.OrderNumber;
                },
    
                /**
                 *  Setter for OrderNumber
                **/
                setOrderNumber : setOrderNumber,
    
                /**
                 *  Getter for Test
                **/
                getTest : function() {
                    return this.Test;   
                }
            };
    
        };  
    </script>
    

    我尝试过的事情(1)

    我试图直接设置它:

    <script>
    var Dispatch = function( s ) {
    
        /**
         * Assign constructor
         * to Test
        **/
        var Test = s;
    
        return {
           getTest : function() {
               return this.Test;    
           }
        }
    };
    
    TestObj.getTest(); //Returns undefined
    </script>
    

    我尝试过的事情(2)

    我还尝试通过稍微混合函数返回来访问变量:

    <script>
    var Dispatch = function( s ) {
    
        var Test;
    
        var getTestVar = function() {
            return this.Test;   
        }
    
        this.constructor = function( str ) {
            this.Test = str;
        };
    
        /**
         *
        **/
        this.constructor( s );   
    
        return {
            getTest : getTestVar
        };
    };
    
    TestObj.getTest(); //Returns undefined
    </script>
    

    我玩弄了其他方法,但是,对于为什么我的错误使我的构造函数工作,我会很高兴获得书面理解。

    这是一个显示所有这一切的jsFiddle。道歉相当长的帖子&amp;我的JavaScript对象无知!

3 个答案:

答案 0 :(得分:2)

你真的很困惑很多概念 这就是你要找的东西:

var Dispatch = function( s ) {
   /**
    * Assign constructor
    * to Test
   **/
   this.Test = s;
   this.getTest = function() {
      return this.Test;    
   }
};

因此:

TestObj = new Dispatch(7);

将导致对象:

Dispatch {Test: 7, getTest: function}

和:

TestObj.getTest();

将返回7.

您可以在此处查看有关构造函数的更多正确信息:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/constructor

答案 1 :(得分:2)

您可以使用此模式

function myObject (param1) {
    var myPrivateMemberValue1 = param1;

    return {
        getPrivateMemberValue1: function() {
            return myPrivateMemberValue1;
        }
    };
}
console.log(new myObject("thefourtheye"));
console.log(new myObject("thefourtheye").getPrivateMemberValue1());

<强>输出

{ getPrivateMemberValue1: [Function] }
thefourtheye

<强>解释

我们在这里使用关闭。当参数传递给构造函数时,它存储在局部变量中。然后我们返回一个带有getPrivateMemberValue1函数的对象,由于闭包,它仍然可以访问该函数的本地变量。所以你可以像这样私有变量。

答案 2 :(得分:1)

    function Dispatch(s) {
        var test = s;
        this.returnTest = function () {
            return test;
        }
    }

    var no = new Dispatch(5);
    no.returnTest(); // 5

无法直接访问测试变量,因为它不是新创建的对象的成员,但您可以在闭包中访问它。