js遅延関数の考え方の紹介

遅延関数は、js 関数型プログラミングのもう 1 つの応用です。遅延関数とは、関数が初めて呼び出されたときにのみ関数実行の分岐が実行されることを意味します。この記事では、js 遅延関数のアイデアを皆さんに紹介します。 . 皆様のお役に立てれば幸いです。

vue、react、その他のフレームワークが広く使用される前は、dom を操作してコードを記述するために jQuery またはネイティブ js を使用する必要がありました。イベントバインディングにネイティブ js を使用する場合、DOM2 レベルのバインディングイベントメソッドを適用できます。 :Element.addEventListener() ですが、互換性のために、

Element.attachEvent() とも呼ばれます。したがって、それをメソッドにカプセル化する必要があります:

function emit(element, type, func) {
    if (element.addEventListener) {
        element.addEventListener(type, func, false);
    } else if (element.attachEvent) {
        element.attachEvent('on' + type, func);
    } else { //如果不支持DOM2级事件
        element['on' + type] = func;
    }
}

この時点で、要素が 1 つの動作を通じて複数のクリック イベントを追加する必要がある場合、たとえば:

emit(div, 'click', fn1);
emit(div, 'click', fn2);

初めて fn1 イベントを div にバインドするとき、ブラウザはどのバインディングメソッドが実行されるかをすでに知っていますか? バインディング fn2 を実行するとき、再度判断する必要はなく、コードを変更できます:

function emit(element, type, func) {
    if (element.addEventListener) {
        emit = function (element, type, func) {
            element.addEventListener(type, func, false);
        };
    } else if (element.attachEvent) {
        emit = function (element, type, func) {
            element.attachEvent('on' + type, func);
        };
    } else {
        emit = function (element, type, func) {
            element['on' + type] = func;
        };
    }
    emit(element, type, func);
}

つまり、最初の判断を行った後、関数を再定義します。そのため、後でバインドするときに判断を行う必要がなくなります。クロージャは作成されますが、将来同じ判断を複数回行うよりも優れています。

これは関数の怠惰なアイデアです。同じ判断を行うには、一度だけ行う必要があります。

この記事は js チュートリアル コラムからのものです。学習へようこそ!

以上がjs遅延関数の考え方の紹介の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。