4

JavaScript オブジェクトをより広範囲に使用する方法を学び始め、初期化時にいくつかのコンストラクター引数を設定できるようにする JavaScript でオブジェクトを作成しようとしました。

私が言わなければならないのは、JavaScript にはかなりの数の異なる「デザイン パターン」があり、おそらく構文やその他のことで少し混乱しているということです。私の調査を通じて、次のようなさまざまな StackOverflow 記事を見つけました。

  1. JavaScript オブジェクト リテラル表記を使用する JavaScript コンストラクター
  2. JavaScript オブジェクトのコンストラクター

オブジェクトでやりたいことは、以下のように初期化の時点でいくつかの内部/プライベート変数を設定します:

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

現在、オブジェクトの構築方法は、Test初期化後にアクセスしようとすると未定義を返します。

<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です。かなり長い投稿と私の JavaScript オブジェクトの無知をお詫びします!

4

3 に答える 3

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は、クロージャーのために、関数に対してローカルな変数にまだアクセスできます。したがって、このように変数をプライベートにすることができます。

于 2013-09-24T10:46:59.937 に答える
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 を参照してください。

于 2013-09-24T10:40:53.897 に答える