js Maximum call stack size exceeded

时间 2019-11-24
标签 maximum stack size exceeded 栏目 JavaScript 繁體版
原文原文链接
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
	<meta charset="utf-8" />
    <script src="../jquery.js"></script>
    <script>
        $(function () {

            // 测试 null的指向

            var func = function () {
                // 说明当call 的第一个参数为null是, 指向是window ,
                //console.log(arguments);
                //console.log(this);
                //console.log(this == window);
                //Array.prototype.join.apply(null, arguments);
                //console.log(arguments);
            }

            //func.call(null, 1, 2, 3);
            var funs = function (args) {
                //console.log(args);
            };

            func.apply(funs, [1, 2, 3]);

            // 解决方案
            document.getElementById = (function(func) {
                return function () {
                    return func.apply(document, arguments);
                }
            })(document.getElementById);
               
            var getId = document.getElementById;
            console.log(getId('demo'));
            
            //document.getElementById.apply(document, 'demo');    //会栈溢出,



            /* 
            该实例输出的结果是   Maximum call stack size exceeded
            document.getElementById = (function () {
                return function(){
                    return document.getElementById.apply(document, arguments);
                }
            })();
                
                //var getIdss = document.getElementById;
                //console.log(getIdss('demo'));
            */


            /* 简化模型  输出结果为 Maximum call stack size exceeded */
            /*
            (function a() {
                a();
            })();

            */

            /*
                问题说明:
                1   栈溢出的错误缘由是 : 重复的调用了匿名函数, 
                    79L : 函数在调用后, document.getElementById 函数被改写,
                    76L : 函数调用的再也不是 原来的document.getElementById,

                    简化后的函数体

                    document.getElementById= function(){
                        return document.getElementById.apply(document,argument);
                    }
                    在执行 document.getElementById() 后, 函数开始本身调用本身了, 


                    // 简化模式, 若是这么调用也会出现 栈溢出的问题,
                     var a = function () {
                            return a.apply(window, arguments);
                        }
                        a();


                    解决问题的思路 :   参考结局方案.
                    在运行时  func 为一个函数  getElementById(){};
                  
            */

                /*
                document.getElementById = (function () {
                    return  function() {
                        return document.getElementById.apply(window, arguments);
                    }
                })();

                var getId = document.getElementById;
                console.log(getId('demo'));
                */

        });

    </script>
</head>
<body>
    <div id="demo">demo</div>
</body>
</html>