JavaScript 関数 新しいページはコチラ
提供: yonewiki
(→呼び出し元取得 caller,constructor) |
|||
10行: | 10行: | ||
サンプル | サンプル | ||
− | < | + | <syntaxhighlight2 lang="javascript" line start="1"> |
<HTML> | <HTML> | ||
<HEAD> | <HEAD> | ||
32行: | 32行: | ||
</BODY> | </BODY> | ||
</HTML> | </HTML> | ||
− | </ | + | </syntaxhighlight2> |
[[Media:JavaScript Function yoobidashi.html|実行結果サンプル]] | [[Media:JavaScript Function yoobidashi.html|実行結果サンプル]] | ||
39行: | 39行: | ||
:上記のようにするとfuncName関数のプログラムソースの文字列を取得できます。ただしIEおよびChromeといったブラウザではまったく動作しません。fireFoxのようなブラウザでは動作するようです。 | :上記のようにするとfuncName関数のプログラムソースの文字列を取得できます。ただしIEおよびChromeといったブラウザではまったく動作しません。fireFoxのようなブラウザでは動作するようです。 | ||
サンプル | サンプル | ||
− | < | + | <syntaxhighlight2 lang="javascript" line start="1"> |
<HTML> | <HTML> | ||
<HEAD> | <HEAD> | ||
62行: | 62行: | ||
</BODY> | </BODY> | ||
</HTML> | </HTML> | ||
− | </ | + | </syntaxhighlight2> |
[[Media:JavaScript Function toSource.html|実行結果サンプル]] | [[Media:JavaScript Function toSource.html|実行結果サンプル]] | ||
73行: | 73行: | ||
サンプル | サンプル | ||
− | < | + | <syntaxhighlight2 lang="javascript" line start="1"> |
<HTML> | <HTML> | ||
<HEAD> | <HEAD> | ||
98行: | 98行: | ||
</BODY> | </BODY> | ||
</HTML> | </HTML> | ||
− | </ | + | </syntaxhighlight2> |
[[Media:JavaScript Function argument.html|実行結果サンプル]] | [[Media:JavaScript Function argument.html|実行結果サンプル]] | ||
116行: | 116行: | ||
サンプル | サンプル | ||
− | < | + | <syntaxhighlight2 lang="javascript" line start="1"> |
<HTML> | <HTML> | ||
<HEAD> | <HEAD> | ||
148行: | 148行: | ||
</BODY> | </BODY> | ||
</HTML> | </HTML> | ||
− | </ | + | </syntaxhighlight2> |
[[Media:JavaScript Function arguments.html|実行結果サンプル]] | [[Media:JavaScript Function arguments.html|実行結果サンプル]] | ||
159行: | 159行: | ||
サンプル | サンプル | ||
− | < | + | <syntaxhighlight2 lang="javascript" line start="1"> |
<HTML> | <HTML> | ||
<HEAD> | <HEAD> | ||
206行: | 206行: | ||
</BODY> | </BODY> | ||
</HTML> | </HTML> | ||
− | </ | + | </syntaxhighlight2> |
[[Media:JavaScript Function return.html|実行結果サンプル]] | [[Media:JavaScript Function return.html|実行結果サンプル]] | ||
224行: | 224行: | ||
サンプル | サンプル | ||
− | < | + | <syntaxhighlight2 lang="javascript" line start="1"> |
<HTML> | <HTML> | ||
<HEAD> | <HEAD> | ||
253行: | 253行: | ||
</BODY> | </BODY> | ||
</HTML> | </HTML> | ||
− | </ | + | </syntaxhighlight2> |
[[Media:JavaScript Function parallel.html|実行結果サンプル]] | [[Media:JavaScript Function parallel.html|実行結果サンプル]] | ||
263行: | 263行: | ||
サンプル | サンプル | ||
− | < | + | <syntaxhighlight2 lang="javascript" line start="1"> |
<HTML> | <HTML> | ||
<HEAD> | <HEAD> | ||
284行: | 284行: | ||
</BODY> | </BODY> | ||
</HTML> | </HTML> | ||
− | </ | + | </syntaxhighlight2> |
[[Media:JavaScript Function objparallel.html|実行結果サンプル]] | [[Media:JavaScript Function objparallel.html|実行結果サンプル]] | ||
297行: | 297行: | ||
サンプル | サンプル | ||
− | < | + | <syntaxhighlight2 lang="javascript" line start="1"> |
+ | <HTML> | ||
+ | <HEAD> | ||
+ | <TITLE>JavaScript 呼び出し元取得 caller,constructor</TITLE> | ||
+ | </HEAD> | ||
+ | <BODY> | ||
+ | JavaScript 呼び出し元取得 caller,constructor<br /> | ||
+ | <SCRIPT Language="JavaScript"> | ||
+ | <!-- | ||
+ | var Num =10000; | ||
+ | function funcName1(){ | ||
+ | with(document){ | ||
+ | write("■直接呼出し用関数funcName1 window.Num 値表示処理<br />"); | ||
+ | write("window.Num = " + window.Num + "<br />"); | ||
+ | } | ||
+ | } | ||
+ | function objNewCreate(){ | ||
+ | with(document){ | ||
+ | write("■自作関数obNewCreate this.Num 初期値<br />"); | ||
+ | write("this.Num = " + this.Num + "<br />"); | ||
+ | } | ||
+ | this.Num = 5000; | ||
+ | with(document){ | ||
+ | write("■自作関数obNewCreate this.Num = 5000 代入後<br />"); | ||
+ | write("this.Num = " + this.Num + "<br />"); | ||
+ | } | ||
+ | } | ||
− | </ | + | function funcName2(nValue1, nValue2, nValue3){ |
+ | with(document){ | ||
+ | write("■引数あり関数funcName2 引数値表示処理<br />"); | ||
+ | write("nValue1 = " + nValue1 + ", nValue2 = " + nValue2 + ", nValue3 = " + nValue3 + "<br />"); | ||
+ | write("引数の総数funcName2.arity = " + funcName2.arity + "<br />"); | ||
+ | write("引数の総数funcName2.arguments.length = " + funcName2.arguments.length + "<br />"); | ||
+ | for(var n in funcName2.arguments){ | ||
+ | write("引数の総数funcName2.arguments[" + n + "] = " + funcName2.arguments[n] + "<br />"); | ||
+ | } | ||
+ | } | ||
+ | return nValue1 * nValue2 * nValue3; | ||
+ | } | ||
+ | function objFuncName1(nValue1,nValue2,nValue3){ | ||
+ | this.arg3 = nValue3; | ||
+ | objFuncName3.apply(this, arguments); | ||
+ | with(document){ | ||
+ | write("■objFuncName1呼び出し<br />"); | ||
+ | write("objFuncName1.constructor = " + objFuncName1.constructor + "<br />");//☆☆☆ | ||
+ | write("objFuncName1.caller = " + objFuncName1.caller + "<br />");//☆☆☆ | ||
+ | } | ||
+ | } | ||
+ | function objFuncName2(nValue1,nValue2,nValue3){ | ||
+ | this.arg3 = nValue3; | ||
+ | objFuncName3.call(this, nValue1, nValue2); | ||
+ | with(document){ | ||
+ | write("■objFuncName2呼び出し<br />"); | ||
+ | write("objFuncName2.constructor = " + objFuncName2.constructor + "<br />");//☆☆☆ | ||
+ | write("objFuncName2.caller = " + objFuncName2.caller + "<br />");//☆☆☆ | ||
+ | } | ||
+ | } | ||
+ | function objFuncName3(nValue1,nValue2){ | ||
+ | this.arg1 = nValue1; | ||
+ | this.arg2 = nValue2; | ||
+ | with(document){ | ||
+ | write("■objFuncName3呼び出し<br />"); | ||
+ | write("objFuncName3.constructor = " + objFuncName3.constructor + "<br />");//☆☆☆ | ||
+ | write("objFuncName3.caller = " + objFuncName3.caller + "<br />");//☆☆☆ | ||
+ | } | ||
+ | } | ||
+ | |||
+ | with(document){ | ||
+ | write("<br />"); | ||
+ | write("◎Create1オブジェクト生成 new<br />"); | ||
+ | } | ||
+ | |||
+ | objNewCreate1 = new objNewCreate(); | ||
+ | |||
+ | with(document){ | ||
+ | |||
+ | write("<br />"); | ||
+ | write("■オブジェクトにぶら下げた変数プロパティの出力<br />"); | ||
+ | write("objNewCreate1.Num = " + objNewCreate1.Num + "<br />"); | ||
+ | |||
+ | write("<br />"); | ||
+ | write("■トップレベルからの関数呼び出し オブジェクト生成無し。<br />"); | ||
+ | write("Num = " + Num + "<br />"); | ||
+ | } | ||
+ | |||
+ | objDirectCreate1 = new function(){ | ||
+ | this.Num = 1048; | ||
+ | this.Num2Power10 = 1024; | ||
+ | with(document){ | ||
+ | write("■同時生成関数定義呼び出し<br />"); | ||
+ | write("this.Num = " + this.Num + ", this.Num2Power10 = " + this.Num2Power10 + "<br />"); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | with(document){ | ||
+ | write("<br />"); | ||
+ | write("■同時生成関数定義呼び出し時生成オブジェクト<br />"); | ||
+ | write("objDirectCreate1.Num = " + objDirectCreate1.Num + "<br />"); | ||
+ | write("objDirectCreate1.Num2Power10 = " + objDirectCreate1.Num2Power10 + "<br />"); | ||
+ | } | ||
+ | |||
+ | |||
+ | var nValue1 = funcName2(1024, 65535, 1024); | ||
+ | with(document){ | ||
+ | write("<br />"); | ||
+ | write("■引数付き関数呼び出し結果<br />"); | ||
+ | write("nValue1 = " + nValue1 + "<br />"); | ||
+ | } | ||
+ | |||
+ | with(document){ | ||
+ | write("<br />"); | ||
+ | write("■apply結果<br />"); | ||
+ | } | ||
+ | var objFunc1 = new objFuncName1(1024, 65535, 1024); | ||
+ | with(document){ | ||
+ | write("<br />"); | ||
+ | write("■生成したオブジェクトのプロパティ値表示<br />"); | ||
+ | write("objFunc1.arg1 = " + objFunc1.arg1 + ", objFunc1.arg2 = " + objFunc1.arg2 + ", objFunc1.arg3 = " + objFunc1.arg3 + "<br />"); | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | with(document){ | ||
+ | write("<br />"); | ||
+ | write("■call結果<br />"); | ||
+ | } | ||
+ | var objFunc2 = new objFuncName2(1024, 65535, 1024); | ||
+ | with(document){ | ||
+ | write("<br />"); | ||
+ | write("■生成したオブジェクトのプロパティ値表示<br />"); | ||
+ | write("objFunc2.arg1 = " + objFunc2.arg1 + ", objFunc2.arg2 = " + objFunc2.arg2 + ", objFunc2.arg3 = " + objFunc2.arg3 + "<br />"); | ||
+ | } | ||
+ | --> | ||
+ | </SCRIPT> | ||
+ | </BODY> | ||
+ | </HTML> | ||
+ | |||
+ | </syntaxhighlight2> | ||
[[Media:JavaScript Function caller.html|実行結果サンプル]] | [[Media:JavaScript Function caller.html|実行結果サンプル]] | ||
== 関数オブジェクトからの関数呼び出し call,aplly == | == 関数オブジェクトからの関数呼び出し call,aplly == | ||
+ | *function objFuncName2(){ … :objFuncName1.call(this, … ); … ;} | ||
+ | *function objFuncName2(){ … :objFuncName1.aplly(this, … ); … ;} | ||
+ | :上記のように関数内で、関数名のメソッド(関数の中の関数のこと)callおよびapllyを呼び出すことで、自分自身の関数オブジェクトであるthisを使って、受け取った引数をそのまま呼び出したい関数にも引数を渡せる仕組みになっています。引数をそのまま横流しできるというのは便利な場合もあります。具体的には以下のサンプルのとおりに利用します。 | ||
+ | |||
− | |||
サンプル | サンプル | ||
− | < | + | <syntaxhighlight2 lang="javascript" line start="1"> |
− | </ | + | <HTML> |
− | [[Media:JavaScript Function | + | <HEAD> |
+ | <TITLE>JavaScript 関数オブジェクトからの関数呼び出し call,aplly </TITLE> | ||
+ | </HEAD> | ||
+ | <BODY> | ||
+ | JavaScript 関数オブジェクトからの関数呼び出し call,aplly <br /> | ||
+ | <SCRIPT Language="JavaScript"> | ||
+ | <!-- | ||
+ | var Num =10000; | ||
+ | function funcName1(){ | ||
+ | with(document){ | ||
+ | write("■直接呼出し用関数funcName1 window.Num 値表示処理<br />"); | ||
+ | write("window.Num = " + window.Num + "<br />"); | ||
+ | } | ||
+ | } | ||
+ | function objNewCreate(){ | ||
+ | with(document){ | ||
+ | write("■自作関数obNewCreate this.Num 初期値<br />"); | ||
+ | write("this.Num = " + this.Num + "<br />"); | ||
+ | } | ||
+ | this.Num = 5000; | ||
+ | with(document){ | ||
+ | write("■自作関数obNewCreate this.Num = 5000 代入後<br />"); | ||
+ | write("this.Num = " + this.Num + "<br />"); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | function funcName2(nValue1, nValue2, nValue3){ | ||
+ | with(document){ | ||
+ | write("■引数あり関数funcName2 引数値表示処理<br />"); | ||
+ | write("nValue1 = " + nValue1 + ", nValue2 = " + nValue2 + ", nValue3 = " + nValue3 + "<br />"); | ||
+ | write("引数の総数funcName2.arity = " + funcName2.arity + "<br />"); | ||
+ | write("引数の総数funcName2.arguments.length = " + funcName2.arguments.length + "<br />"); | ||
+ | for(var n in funcName2.arguments){ | ||
+ | write("引数の総数funcName2.arguments[" + n + "] = " + funcName2.arguments[n] + "<br />"); | ||
+ | } | ||
+ | } | ||
+ | return nValue1 * nValue2 * nValue3; | ||
+ | } | ||
+ | function objFuncName1(nValue1,nValue2,nValue3){ | ||
+ | this.arg3 = nValue3; | ||
+ | objFuncName3.apply(this, arguments);//☆☆☆ | ||
+ | with(document){ | ||
+ | write("■objFuncName1呼び出し<br />"); | ||
+ | write("objFuncName1.constructor = " + objFuncName1.constructor + "<br />"); | ||
+ | write("objFuncName1.caller = " + objFuncName1.caller + "<br />"); | ||
+ | } | ||
+ | } | ||
+ | function objFuncName2(nValue1,nValue2,nValue3){ | ||
+ | this.arg3 = nValue3; | ||
+ | objFuncName3.call(this, nValue1, nValue2);//☆☆☆ | ||
+ | with(document){ | ||
+ | write("■objFuncName2呼び出し<br />"); | ||
+ | write("objFuncName2.constructor = " + objFuncName2.constructor + "<br />"); | ||
+ | write("objFuncName2.caller = " + objFuncName2.caller + "<br />"); | ||
+ | } | ||
+ | } | ||
+ | function objFuncName3(nValue1,nValue2){ | ||
+ | this.arg1 = nValue1; | ||
+ | this.arg2 = nValue2; | ||
+ | with(document){ | ||
+ | write("■objFuncName3呼び出し<br />"); | ||
+ | write("objFuncName3.constructor = " + objFuncName3.constructor + "<br />"); | ||
+ | write("objFuncName3.caller = " + objFuncName3.caller + "<br />"); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | with(document){ | ||
+ | write("<br />"); | ||
+ | write("◎Create1オブジェクト生成 new<br />"); | ||
+ | } | ||
+ | |||
+ | objNewCreate1 = new objNewCreate(); | ||
+ | |||
+ | with(document){ | ||
+ | |||
+ | write("<br />"); | ||
+ | write("■オブジェクトにぶら下げた変数プロパティの出力<br />"); | ||
+ | write("objNewCreate1.Num = " + objNewCreate1.Num + "<br />"); | ||
+ | |||
+ | write("<br />"); | ||
+ | write("■トップレベルからの関数呼び出し オブジェクト生成無し。<br />"); | ||
+ | write("Num = " + Num + "<br />"); | ||
+ | } | ||
+ | |||
+ | objDirectCreate1 = new function(){ | ||
+ | this.Num = 1048; | ||
+ | this.Num2Power10 = 1024; | ||
+ | with(document){ | ||
+ | write("■同時生成関数定義呼び出し<br />"); | ||
+ | write("this.Num = " + this.Num + ", this.Num2Power10 = " + this.Num2Power10 + "<br />"); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | with(document){ | ||
+ | write("<br />"); | ||
+ | write("■同時生成関数定義呼び出し時生成オブジェクト<br />"); | ||
+ | write("objDirectCreate1.Num = " + objDirectCreate1.Num + "<br />"); | ||
+ | write("objDirectCreate1.Num2Power10 = " + objDirectCreate1.Num2Power10 + "<br />"); | ||
+ | } | ||
+ | |||
+ | |||
+ | var nValue1 = funcName2(1024, 65535, 1024); | ||
+ | with(document){ | ||
+ | write("<br />"); | ||
+ | write("■引数付き関数呼び出し結果<br />"); | ||
+ | write("nValue1 = " + nValue1 + "<br />"); | ||
+ | } | ||
+ | |||
+ | with(document){ | ||
+ | write("<br />"); | ||
+ | write("■apply結果<br />"); | ||
+ | } | ||
+ | var objFunc1 = new objFuncName1(1024, 65535, 1024); | ||
+ | with(document){ | ||
+ | write("<br />"); | ||
+ | write("■生成したオブジェクトのプロパティ値表示<br />"); | ||
+ | write("objFunc1.arg1 = " + objFunc1.arg1 + ", objFunc1.arg2 = " + objFunc1.arg2 + ", objFunc1.arg3 = " + objFunc1.arg3 + "<br />"); | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | with(document){ | ||
+ | write("<br />"); | ||
+ | write("■call結果<br />"); | ||
+ | } | ||
+ | var objFunc2 = new objFuncName2(1024, 65535, 1024); | ||
+ | with(document){ | ||
+ | write("<br />"); | ||
+ | write("■生成したオブジェクトのプロパティ値表示<br />"); | ||
+ | write("objFunc2.arg1 = " + objFunc2.arg1 + ", objFunc2.arg2 = " + objFunc2.arg2 + ", objFunc2.arg3 = " + objFunc2.arg3 + "<br />"); | ||
+ | } | ||
+ | --> | ||
+ | </SCRIPT> | ||
+ | </BODY> | ||
+ | </HTML> | ||
+ | |||
+ | </syntaxhighlight2> | ||
+ | [[Media:JavaScript Function call.html|実行結果サンプル]] | ||
[[JAVA Script#リファレンス]]に戻る。 | [[JAVA Script#リファレンス]]に戻る。 |