継承のサンプル

  継承対象の種類



メソッドやプロパティがグループ化して存在する可能性がある対象は、3種類あります。

1) ユーザが作成した関数オブジェクトのインスタンス内
2) ユーザが設定した prototype の内容
3) ユーザが作成した連想配列内

以下に示すサンプルはその継承方法を示したものです。




  サンプルコード



  
<HTML>
<HEAD>
<META http-equiv="Content-Type" content="text/html; charset=Shift_JIS">

<SCRIPT language="javascript" type="text/javascript">
// *********************************************************
// 全ての JavaScript オブジェクトにプロパティを追加
// 全ての JavaScript オブジェクトに継承させる為のサンプルです
// *********************************************************
Object.prototype.lbox_version = "lightbox version : 1.1";

// *********************************************************
// 文字列オブジェクトに対する追加メソッドの定義
// String オブジェクトに継承させる為のサンプルです
// *********************************************************
String.prototype.Trim = function _lbox_trim( ) {
	// 以下[]内の空白に見えるのはshift_jisの漢字スペース
	var regL = /^[ \s]+/;
	var regR = /[ \s]+$/;
	var str = this;

	str = str.replace(regL,"");
	str = str.replace(regR,"");
	return str;
}
String.prototype.AllReplace = function _AllReplace(pattern,repl) {
	// 全て置換(大文字小文字を区別する)
	var re = new RegExp(pattern,"g");
	var str = this.replace(re,repl);
	return str;
}
String.prototype.AllReplacei = function _AllReplacei(pattern,repl) {
	// 全て置換(大文字小文字を区別しない)
	var re = new RegExp(pattern,"gi");
	var str = this.replace(re,repl);
	return str;
}
String.prototype.IdSet = function _IdSet(id) {
	// 文字列を指定したidで参照されるオブジェクトの
	// innerHTML にセット
	document.getElementById(id).innerHTML = this;
}



// *********************************************************
// ユーザが作成した関数オブジェクトのインスタンス内
// 関数オブジェクトとして、インスタンス(動的)定義
// ※ lbox_message1 はグローバルに存在しない
// *********************************************************
function myCore1() {
	this["version"] = "myCore1 : 1.1";
	this["message1"] = function lbox_message1(str) {
			return( str+":message1:myCore1(関数)で定義された動的メソッド");
	};
}
// *********************************************************
// ユーザが設定した prototype の内容
// 関数オブジェクトとして、静的な定義
// ※ lbox_message2 はグローバルに存在する
// ※ myCore1 は、オブジェクト(関数)名
// *********************************************************
myCore1.prototype.message2 = function lbox_message2(str) {
	return(str+":message2:myCore1(関数)で定義された静的メソッド");
}

// *********************************************************
// ユーザが作成した連想配列内
// 変数として、静的な定義
// ※ lbox_message3 はグローバルに存在する
// ※ myCore2 は、インスタンス名
// *********************************************************
var myCore2 = {
	message3 : function lbox_message3(str) {
		return(str+":message3:myCore2(変数)で定義された静的メソッド");
	}
}

// *********************************************************
// 第一段階の多重継承
// *********************************************************
function myObj1() {
	// --------------------------------------
	// 動的プロパティ・メソッドの継承
	// myCore1 内で定義されている、
	// インスタンス変数を全て継承
	// --------------------------------------
	this.myCore1 = new myCore1();
	for( key in this.myCore1 ) {
		this[key] = this.myCore1[key];
	}
	// --------------------------------------
	// 静的(関数)プロパティ・メソッドの継承
	// myCore1 に定義された、prototype の継承、
	// --------------------------------------
	for( key in myCore1.prototype ) {
		this[key] = myCore1.prototype[key];
	}
	// --------------------------------------
	// 静的(変数)プロパティ・メソッドの継承
	// myCore2 に定義されている配列の継承、
	// --------------------------------------
	for( key in myCore2 ) {
		this[key] = myCore2[key];
	}
}

// *********************************************************
// 第ニ段階の継承
// *********************************************************
function myObj2() {
	// --------------------------------------
	// 動的プロパティ・メソッドの継承
	// --------------------------------------
	this.myObj2 = new myObj1();
	for( key in this.myObj2 ) {
		this[key] = this.myObj2[key];
	}
}

function test() {

	var str = "<HR>";

	str += str.lbox_version + "<HR>";

	// --------------------------------------
	// プロパティ・メソッドの一覧
	// --------------------------------------
	var obj = new myObj2();
	for( key in obj ) {
		str += "【一覧表示】<br>《"+key+"》<br>"+obj[key].toString() + "<HR>";
	}

	str += obj.message1("1") + "<HR>";
	str += obj.message2("2") + "<HR>";
	str += obj.message3("3") + "<HR>";

	var wrk = "  |aa|   ".Trim();
	str += wrk + ":" + wrk.length + "<HR>";
	str += "abcdefg_abCdefg_abcdefg".AllReplace("cd","XX") + "<HR>";
	str += "abcdefg_abCdefg_abcdefg".AllReplacei("cd","XX") + "<HR>";

	str.IdSet("disp");

}


</SCRIPT>
</HEAD>
<BODY>

<INPUT type="button" value="実行" onClick="test()">
<DIV id="disp"></DIV>

</BODY>
</HTML>
  



  実行











  infoboard   管理者用   
このエントリーをはてなブックマークに追加





フリーフォントWEBサービス
SQLの窓WEBサービス

SQLの窓フリーソフト

素材

一般WEBツールリンク

SQLの窓

フリーソフト

JSライブラリ