js apply與閉包的用法

時間 2019-11-24

原文原文鏈接

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="./jquery.js"></script>
    <script>
        // call/apply

        /**
         *  this, fun,documnt; 主要用於封裝一些函數/或是對原有函數的封裝處理
         *
         *
         *
         */
        document.getElementById = (function(func){
            return function () {
                return func.apply(document,arguments);
            }
        })(document.getElementById);

        var getId = document.getElementById;



        /**
         *  若是想要鏈式的調用,關鍵是對當前函數 this的保留引用.
         *  在函數第一次返回的時候,保留了對當前所在函數的引用,
         *
         *
         * @param obj
         * @returns {Function}
         */
        Function.prototype.bind = function(obj){
            var _self = this;
            return function(){
                return _self.apply(obj,arguments);
            }
        };


        Function.prototype.before = function(beforefn){
            var _self = this;
            return function(){
                beforefn.apply(this,arguments);
                return _self.apply(this,arguments);
            }
        }


        Function.prototype.after = function(afterfn)
        {
            var _self = this;
            return function(){
                var ret = _self.apply(this,arguments);
                afterfn.apply(this,arguments);
                return ret;
            }
        }


        var fun =function()
        {
            console.log(2);
        };

        fun = fun.before(function(){
            console.log(1);
        }).after(function(){
            console.log(3);
        });

        fun();


        var func = function()
        {
            console.log(this.name);
        };

        var object = {
            name:'demo'
        };


        func = func.bind(object);
        func();


    </script>
</head>
<body>
    <div id="div">demo</div>
</body>
</html>
<script>
    console.log(getId('div'));
</script>