BLOG ENTRY

previousnext

javascriptで独自オブジェクトを作成する

javascriptクライアントサイドのjavascriptが最近おもしろいです。。


javascriptで独自オブジェクトを作成してみる。


オブジェクトを作成して、プロパティとメソッドを定義する。

  1. <script type="text/javascript">
  2. //<![CDATA[
  3. //インスタンスの作成
  4. obj = new Object();
  5.  
  6. //プロパティ定義
  7. obj.name　= "次長";
  8. obj["name2"] = "課長";
  9.  
  10. //メソッド定義
  11. obj.showName = function() {
  12.     document.write(this.name);
  13.     document.write(this.name2);
  14.     document.write(this["name"]);
  15.     document.write(this["name2"]);
  16. }
  17.  
  18. //メソッド呼び出し
  19. obj.showName();
  20. //]]>
  21. </script>



で、上記コードの内容は、下記の書き方（オブジェクト初期化子）でも書ける。

  1. <script type="text/javascript">
  2. //<![CDATA[
  3. obj = {
  4.     //プロパティ定義
  5.     name  : "次長",
  6.     name2 : "課長",
  7.  
  8. //メソッド定義
  9.     showName : function() {
  10.         document.write(this.name);
  11.         document.write(this.name2);
  12.         document.write(this["name"]);
  13.         document.write(this["name2"]);
  14.     }
  15. };
  16.  
  17. //メソッド呼び出し
  18. obj.showName();
  19. //]]>
  20. </script>



オブジェクトのプロパティを列挙する場合はfor～in文を使う。

  1. <script type="text/javascript">
  2. //<![CDATA[
  3. //プロパティ(メソッド込み）の列挙
  4. for (output in obj) {
  5.     document.write("プロパティ名 = " + output + ", 値 = " + obj[output] + "
  6. ");
  7. }
  8. //]]>
  9. </script>



メソッドを列挙に含めない場合は以下。

  1. <script type="text/javascript">
  2. //<![CDATA[
  3. //プロパティ(メソッド除外）の列挙
  4. for (output in obj) {
  5.     if (typeof obj[prop] != 'function') {
  6.         document.write("プロパティ名 = " + output + ", 値 = " + obj[output] + "
  7. ");
  8.     }
  9. }
  10. //]]>
  11. </script>

終わり。

関連記事

comments(2)
はてなブックマークに追加 del.icio.usに追加 ライブドアクリップに追加 POOKMARK Airlinesに追加 Buzzurl（バザール）に追加 ニフティクリップに追加
DATE2008.08.16
  • name：AJAX(非同期通信)リクエストをPrototypeとjQueryで行う[AJAX][JS] | Web&MUSICブログ　QUALL
  • date：2008/10/25

  • […] javascriptで独自オブジェクトを作成する comments(0) DATE2008.10.25 […]

    • type：Pingback [ ]

  • name：JSでイベントリスナーやらでバリデートの実装いろいろ[DOM][JavaScript] | Web&MUSICブログ　QUALL
  • date：2009/01/01

  • […] javascriptで独自オブジェクトを作成する comments(4) DATE2008.10.24 […]

    • type：Pingback [ ]

    WRITE COMMENT


    （required）


    （required）


    （required）

    MENU