模仿console自寫函數打印js的對象

本以為寫個遞歸函數就可以將js的對象打印出來。

當然第一個想到的估計是JSON.stringify() 這個函數。但這個函數打印到瀏覽器 顯示效果不友好。最友好的顯示肯定是 控制台打印咯。

結果嘗試打印window的時候，直接掛逼。原因就是對象循環引用。

經過幾次修改，還是禁止了window里的某幾個屬性。

 

function parseObjToString(obj){
    var filter = ['top', 'window', 'document', 'localStorage', 'sessionStorage', 'cookie'], //不會解析該屬性。
     x         = null, //沒用的臨時變量
     n         = '\n<br/>', //換行
     Parse     = {
        parse_obj : function(obj, blank, parse_obj_times){//解析對象和數組
            !parse_obj_times && (parse_obj_times = 0);
            if (parse_obj_times > 20) {return '';}
            switch(typeof obj){
                case 'object':
                    var temp   = '{',
                        isobj  = true;
                        temp  += n;
                        blank  = blank || 1;
                    ''+{}.toString.call(obj) === "[object Array]" && (isobj = false);
                    isobj ? temp = '{'+ n : temp = '['+ n;
                    for (x in obj) {
                        if (typeof obj[x] == 'object') {
                            if(filter.indexOf(x) !== -1 ) continue;
                            parse_obj_times ++;
                            temp += this.get_blank(blank)+ x+ ' : '+ this.parse_obj(obj[x], blank+1, parse_obj_times)+ ',' + n;
                        }else{
                            temp += this.get_blank(blank)+ x+ ' : '+ this.parse_sign(obj[x]) +',' + n;
                        }
                    }
                    temp = temp.substr(0, temp.length - (',' + n).length)+ n;
                    return temp + this.get_blank(blank - 1) + (isobj ? '}' : ']') ;
                default : 
                  return obj;
            }
        },
        parse_sign: function(str){//解析特殊符號
            return (''+str).replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/\n|\n\r/g, '<br>')
                           .replace(/\t/g, '&nbsp;&nbsp;').replace(/\s\s/g, '&nbsp;');
        },
        get_blank : function(num){//返回相應num的空白
            for (var i = 0, blank=''; i < num; i++) {
                blank += '&nbsp;&nbsp;&nbsp;&nbsp;';
            }
            return blank;
        }
    };
    return Parse.parse_obj(obj);
}

 

測試數據:

var obj = {
        test : {
            a : 'hello',
            b : 'world',
            c : {
                d : {
                    e: {
                        f: {
                            g: {
                                h : {
                                    i : {
                                        shit : 'yes shit'
                                    }
                                }
                            }
                        }
                    }
                }
            }
        },
        arr : [
            'what',
            'a',
            'abc',
            '<aaa><bbb>',
            'a<asdfsafd>'
        ],
        func : function(e){
            console.log('aaaa');
        },
        func2: function(e){
            console.log('bbbb');
        },
        func3: function(e){
            console.log('asdfs');
        }
    };

var str = parseObjToString(obj);;
document.write(str);

測試結果: