vue源码cached高阶函数解析

1、源代码

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>vue源码cached高阶函数</title>
    </head>
    <body>
        <script type="text/javascript">
            function cached(fn) {
                console.log(fn,'fn')
                const cache = Object.create(null)
                // 返回函数 函数中使用了外部的cache ----闭包
                return (function cachedFn(str) {
                    console.log(str,'str');
                    const hit = cache[str]
                    console.log(hit, 'hit')
                    return hit || (cache[str] = fn(str))
                })
            }
            var capitalize = cached(function(str) {
                return str.charAt(0).toUpperCase() + str.slice(1)
            });
            console.log(capitalize,'capitalize')
            console.log(capitalize('abc'), '第一次')
            console.log(capitalize('abc'), '第二次')
        </script>
    </body>
</html>

2、cached函数，输入参数为函数，返回值为函数。同时使用了闭包。