ホームページ > ウェブフロントエンド > jsチュートリアル > JavaScript で関数を動的に呼び出す方法 (2 つの方法)_JavaScript スキル

JavaScript で関数を動的に呼び出す方法 (2 つの方法)_JavaScript スキル

WBOY
リリース: 2016-05-16 17:34:43
オリジナル
1299 人が閲覧しました

最近では、ユーザーは UI インターフェースのインタラクションをますます重視しており、脇役にすぎなかった JavaScript (以下、JS) が徐々に主役となり、使用の大部分を占めています。 。

たとえば、最近人気の ASP.NET MVC には JQuery を直接組み込むことができます。

しばらく MVC を使用した後、Xiaolong は、MVC のコントローラーが JS によって制御されているとさえ感じました。また、UI をどのように独立して動作させ、アーティストに渡すかが大きな疑問であると感じました。
後ろのアーティストは、画像を描画したりプルしたりすることしかできないようです。人気があるためには、JS、Flash、その他のフロントエンド制御言語を知っている必要があります。

ここでは、小さなドラゴンが JavaScript を使用して関数を動的に呼び出す方法を紹介します。このとき、読者が次のテクノロジーをどこに適用できるかを理解できるように、最初に前提を紹介する必要があります。
通常、動的呼び出しが使用されます。基本的に、バックエンドが動的に JS コードを生成し、それがフロントエンド JS フレームワークによって呼び出されます。

これの目的は、UI のフィールド、スタイル、データなどを動的に設定することです。もう 1 つの可能性は、後続の開発者が追加のコードを記述して拡張できるようにすることです。各プログラムの特性に基づいて、独自の JS フレームワークの機能を実現します。

Xiaolong が知っている限り、関数を動的に呼び出すには次の 2 つの方法があるはずです

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

function myAlert(value) {
document.write("myAlert - " value "
}
$( function () {
eval("myAlert")("test");
window["myAlert"]("test");
}

一般に、関数が存在するかどうかを問い合わせるには window オブジェクトを使用する方が形式的です。eval を使用するのは柔軟性が高すぎるため危険です。

上記のように直接実装すると、次のようになります。関数が存在しないと画面全体がおかしくなってしまうため、この観点からは eval を使用することはできません。関数オブジェクトを生成し、ウィンドウはオブジェクトが存在するかどうかを問い合わせるだけなので、関数が存在しない場合、 eval は直接エラーを報告するため、読者は違いをよりよく理解できるはずです 🎜>
コードは次のとおりです。

function myAlert(value) { document.write("myAlert - " value "
"); } $(function () { var fnName = "myAlert"; var fn = window[fnName];
if (typeof fn == "function") {
fn.apply(window, ["window - test "]);
}
}


最後に、次のような別の方法を自分で思いつきました




コードをコピー

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

function myAlert(value) { document.write("myAlert - " value "< br>"); } $(function () { if (typeof (myAlert) == 'function') { myAlert("typeof - test"); }
}


このメソッドはある程度の柔軟性を犠牲にしますが、逆に、このメソッドを使用して、フレームワークの Init() Load など、後続の開発者の名前付け原則を制限することができます。こうすることで利用方法を固定することができ、拡散を防ぐことができ、その後のメンテナンスコストも抑えやすくなります。
関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート