ホームページ > ウェブフロントエンド > jsチュートリアル > JavaScriptの関数ハイジャック例を詳しく解説

JavaScriptの関数ハイジャック例を詳しく解説

小云云
リリース: 2018-03-16 17:34:17
オリジナル
1868 人が閲覧しました


関数ハイジャックは、名前が示すように、実行前に関数をハイジャックし、必要な機能を追加します。この関数を実際に実行すると、元の関数ではなくなり、追加した機能が追加されます。これは、共通フック関数の原則の 1 つでもあります。
一見すると、これは関数の書き換えのように見えます。関数の書き換えも関数ハイジャックの一種と理解できますが、この手法はあまりにも気持ち悪すぎます。ハイジャッカーとしては、誘拐によって利益を得た後、職業倫理を遵守し、人を無傷で返す必要があるため、適切な場所で関数の元の関数をコールバックする必要があります。
その延長で、実際には「乗っ取り」という概念によく遭遇します。たとえば、Webサイトが運営者によって乗っ取られた場合、Webサイトを閲覧すると運営者の広告が表示されます。

それでは、alert() 関数をハイジャックして、それに少しの機能を追加する簡単な例を見てみましょう:

let warn = alertwindow.alert = (t) => {    if (confirm('How are you?')) warn(t)
}

alert('Help me...!!!')
ログイン後にコピー

開発者ツールを開いてこの例を試してみると、確認しているのは自分だけであることがわかります。 [OK] をクリックすると、[Help me...!!!] が表示されます。
次に、コンテンツのこの部分を一般的な関数にカプセル化します:

const hijack = (obj, method, fun) => {
  let orig = obj[method]
  obj[method] = fun(orig)
}
ログイン後にコピー

まず、最初に元の関数を保存し、次にカスタム関数を実行するハイジャック関数を定義します。元の関数はカスタム関数内で呼び出しを行います。関数。
次に、confirm() 関数をハイジャックしましょう:

hijack(window, 'confirm', (orig) => {  return (text) => {
    alert('HELP ME PLZ!!!')    if (orig.call(this, text)) {
      alert('YOU SEEMS FINE AND I AM LEAVING, GOOD BYE!')
    } else {
      alert('HOLD ON! I AM COMING!!')
    }
  }
})
ログイン後にコピー

この関数の機能は非常に簡単なので、詳細は説明しませんが、confirm() を呼び出すだけでわかります。

ハイジャック防止

新しいページを作成し、開発を開きます。 ツール コンソールに移動して、alert と入力すると、次のような出力が表示されます:

function alert() { [native code] }
ログイン後にコピー

次に、この記事の冒頭にあるコードを使用して、alert() をハイジャックし、コンソールで再度「alert」と入力します。次のような出力が表示されます:

function (t) => {    if (confirm('How are you?')) warn(t)
}
ログイン後にコピー

上の例から、関数がハイジャックされているかどうかを確認するには、それを直接出力するだけでよいことがわかります。システム ネイティブ関数の場合、[ネイティブ コード] は、純粋で汚染がないことを意味します。

関連する推奨事項:

JavaScript 関数のハイジャックに関する簡単な説明 [xfocus から再投稿]_JavaScript スキル

以上がJavaScriptの関数ハイジャック例を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート