toString() 自動的に呼び出されるメソッド_javascript スキル-jsチュートリアル-php.cn

toString() 自動的に呼び出されるメソッド_javascript スキル

WBOY

リリース： 2016-05-16 18:34:49

オリジナル

1451 人が閲覧しました

この機能は明らかに怠け者に役立ちますが、もちろん、特定の関数を実装するのにも役立ちます。この機能を説明するために、実際の開発ケースから始めましょう。

WEB プロジェクトでは、次のような HTML のリストを出力する必要がある場所がたくさんあります:

コードをコピーコードは次のとおりです。

 
JavaScript イベント バブリング アプリケーション インスタンス

 return HTML フラグメント
 の JavaScript スクリプト

明らかに、これは毎回このような構造の HTML を出力したいかもしれません。これらの LI タグを自分で入力する必要がありますか?メソッドを呼び出すたびに LI の途中にテキストコンテンツを入力するだけで、最終的に完全な UL HTML 構造を取得できますか?もちろん、プログラムを実装するには N 通りの方法があります。次の方法を見てください。この方法は明らかに単純で科学的です。

コードをコピーしますコードは次のとおりです:

function ulBuilder() 
{ 
var lis = ''; 
this.addLi = function(liText) 
 { 
lis = '' liText '
' 
}; 

this.toString = function() 
{ 
return '< ul>' lis ' '; 
} 
var ulHtml = new ulHtml.addLi('JavaScript イベント バブリング アプリケーション インスタンス') ; 
 ulHtml.addLi('AJAX を実行して HTML フラグメント内の JavaScript スクリプトを返す'); 
alert(ulHtml); 


 というクラスを定義しました。 ulBuilder には、addLi と toString の 2 つのパブリック メソッドがあります。addLi メソッドはコンテンツを含む LI タグを追加し、toString メソッドは最終的に必要な UL HTML を生成します。このクラスの実際の使用では、toString メソッドが呼び出されていることはまったくわかりませんが、alert(ulHtml) は HTML の完全な UL 構造を表示します。 

実際、alert() が実行されると、スクリプト パーサーはアラート変数またはオブジェクトの toString メソッドを自動的にチェックし、それを呼び出します。上記の例では、toString メソッドをオーバーライドしました。このメソッドはプログラムによって自動的に呼び出され、実行されます。 

トピックの展開:
1. C# や JAVA などの一部のオブジェクト指向開発言語では、このコンストラクターは明らかにクラスのメンバーメソッドです。このメソッド内で定義されたコードは、クラスがインスタンス化されるときに自動的に実行されます。このメソッドを手動で呼び出す必要はありません。もちろん、システムがいくつかの特定のメソッドを自動的に実行するために、プログラムアーキテクチャでは、たとえば、コンストラクターメソッドの名前がクラス名と同じである必要があるなど、これらのメソッドの命名規則が規定されています。上の例のように、 this.toString を this.toUL に変更した場合、正しい結果を得る唯一の方法は、次のようにalert(ulHtml. toUL()) を呼び出すことです。

2. toString メソッドはオーバーライドできるため、場合によっては特に便利です。以下の例を見て、書き換えなしの出力と書き換え後の出力の違いを試してください。この例は明らかに非常に堅牢ではありません。たとえば、配列のネストを処理できません。これは、これができることを知らせるだけです。

コードをコピー

コードは次のとおりです。 Array.prototype.toString = function() {

return '['' this.join('','') '']'

}; 
var Companies = ['Adobe','Apple','Google'; ,'Intel ','Microsoft','Oracle','IBM','SUN']; 
alert(companys); 

 
これは、上の例。通常の状況では、alert(JSON) を実行すると、JSON の実際の構造は表示されず、[object Object] のみが表示されます。次の実装を試してみてください。これが希望する結果になるかもしれません。もちろん、この方法も非常に不完全です。本当にそのような関数を使用したい場合は、JSON 公式 Web サイトにアクセスして関連する JS ライブラリをダウンロードしてください: 

Copy code

コードは次のとおりです: var userInfo = {

"name": "Mike",

"age": 23、
"phone": "020-87654321", 
"toString": function() 
{ 
var objStr = '' 
for (この中の var キー) 
{ 
if (typeof( this[key]) == 'string') 
objStr = '"' key '":"' this[key] '",' 
} 
 return '{' objStr.replace(/ ,$/, '') '}' 
} 
} 
alert(userInfo); 


作成者: WebFlash