PerlにはPerl::Dumperという心強いデバッグの友がいる。
それを真似て、JavaScriptでオブジェクトの中身を見るブックマークレットを作ってみた。
ソース。
alert(
(function(p,n,s,i){
var t = p ? p[n] : eval(n);
for(var j=0; j<i; j++) s += '\t';
s += n + ' : ';
s += ('' + t ).replace(/\n[\t ]*/g, ' ');
if(typeof(t)=='object' || typeof(t)=='function')
for(var k in t)
s += '\n' + arguments.callee(t, k, '', i+1);
return s;
})(null,window.prompt('object name to dump'),'',0));
book marklet
javascript:alert((function(p,n,s,i){var%20t=p?p[n]:eval(n);for(var%20j=0;j<i;j++)s+='\t';s+=n+'%20:%20';s+=(''+t).replace(/\n[\t%20]*/g,'%20');if(typeof(t)=='object'||typeof(t)=='function')for(var%20k%20in%20t)s+='\n'+arguments.callee(t,k,'',i+1);return%20s;})(null,window.prompt('object%20name%20to%20dump'),'',0));
使用例
function classA(){
this.prop1 = 10;
this.prop2 = 20;
}
function classB(){
this.prop1 = 100;
}
classB.prototype = new classA();
こうなってるときに、classBについて調べると、こうなる。(FireFox3.6.24)
(FireFox8および9で試すと、prototypeプロパティが表示されなくて混乱したが、DontEnum属性というのが関係しているのではないかと思われる。)
classB
classB : function classB() { this.prop1 = 100; }
prototype : [object Object]
prop1 : 10
prop2 : 20
objectおよびfunctionのプロパティについては、python風にインデントして、再帰的に全部表示する。
まぁ、タイトルにダンパーと付けた割に、ダンプした内容から元のオブジェクトを復元したりはできないんですが。詐欺してごめんなさい。
個人的に学習およびデバッグ用に使います。