JavaScript イベントの転送コントロール、アンチコントロール、関数型プログラミング

記事ディレクトリ


レンダリング

機能的プログラミング


html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>函数式编程</title>
    <link rel="stylesheet" href="./index.css">
</head>

<body class="h_100vh d_f jc_c ai_c">
    <div class="w_386 d_f jc_sb ai_c">
        <button class="w_150 h_86 lh_86 fs_50 ta_c" onclick="clickF(1)">取消</button>
        <button class="w_150 h_86 lh_86 fs_50 ta_c color_1296db" onclick="clickF(2)">确认</button>
    </div>

    <script src="./index.js"></script>
</body>

</html>

JavaScript

function clickF(val) {
    
    
    controlConversion(function (cancel, confirm) {
    
    
        val === 1 ? cancel() : confirm();
    });
}

function controlConversion(res) {
    
    
    res(function cancel() {
    
    
        alert("用户点击了 '取消'");
    },
        function confirm() {
    
    
            alert("用户点击了 '确认'");
        }
    );
}

分析する

これにより、プログラマの条件判断が簡略化され、対応する機能が関数で実現され、その判断がそのままカプセル化関数に反映されます。
この関数は、フレームワーク内でコンポーネントのパラメーターを渡すのに適しています。
条件付きプログラミングから関数型プログラミングへ。
関数が実行されるとき、渡されるパラメータは関数であり、関数は 2 つのパラメータを受け取ります。実行された関数は関数タイプのパラメータを受け取ります。パラメータが呼び出されるとき、2 つの関数が呼び出し操作の元の関数に渡されます。

おすすめ

転載: blog.csdn.net/weixin_51157081/article/details/132067209