JavaScript + Ajax 実践サンプル集 - クラスに名前空間を付ける

クラスに名前空間を付ける

説明補足説明コード関連書籍コメント投稿

このサンプルは、JavaScriptのPersonクラスに名前空間「JSajax」を追加します。クラスに名前空間を追加することによりクラスの競合を回避することができます。

var JSajax = {}; // 名前空間を定義

// Personクラス作成
JSajax.Person = function(id, name) {
  this.id = id;
  this.name = name;
  this.age = -1;
  this.gender = 'male'; 
}

// print()/log()メソッド定義
JSajax.Person.prototype = {
  print: function() {
    return this.id + ', ' + this.name + ', ' + this.age + ', ' + this.gender;
  },
  log: function() {
    if (typeof console != 'undefined') {
      console.log(this.print());
    } else {
      alert(this.print());
    }        
  }
}

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title>JavaScript- Add namespace</title>
  <script type="text/javascript">
    var JSajax = {};
    
    JSajax.Person = function(id, name) {
      this.id = id;
      this.name = name;
      this.age = -1;
      this.gender = 'male';  // male, female
    }
    JSajax.Person.prototype = {
      print: function() {
        return this.id + ', ' + this.name + ', ' + this.age + ', ' + this.gender;
      },
      log: function() {
        if (typeof console != 'undefined') {
          console.log(this.print());
        } else {
          alert(this.print());
        }        
      }
    }    
   
  </script>
</head>
<body>

var author1 = new JSajax.Person(1, 'Taro');
  var author2 = new JSajax.Person(2, 'Hanako');
  author1.age = 25;
  author2.age = 23;
  author2.gender = 'female';
  
  document.write(author1.print(), '<br />');
  document.write(author2.print(), '<br />');

author1.log();
  author2.log();

</script>

</body>
</html>