2015-05-24 2 views
0

Я хочу, чтобы не вставлять инструкции console.log() в каждый метод класса JavaScript, но я хочу знать, какие члены вызываются, а какие нет, запустив код и захватив вывод отладки.Как регистрировать каждый вызов функций-членов объекта JavaScript?

Возможно, есть какой-либо крючок или обработчик, или библиотека отладки, поэтому я могу просто изменить класс или экземпляр в одном месте, а затем посмотреть, какие члены вызываются через консоль (или аналогичные) ?

В классе много членов, поэтому для меня это будет полезной экономией времени! Кроме того, вы можете легко легко включать и отключать ведение журнала.

Мои первые Q .. спасибо :)

+0

Отладчик Chrome имеет множество функций, включая [Панель стека вызовов Javascript] (https://developer.chrome.com/devtools/docs/javascript-debugging#call-stack-panel), которые могут вас заинтересовать. Этот способ имеет нулевые служебные данные и не требует изменения кода, который вы пытаетесь наблюдать. – Roberto

ответ

2

Вы можете обернуть все функции на экземпляре. Например, если предположить obj является объект, который вы хотите посмотреть в приведенной выше

function wrapObjectFunctions(obj, before, after) { 
    var key, value; 

    for (key in obj) { 
    value = obj[key]; 
    if (typeof value === "function") { 
     wrapFunction(obj, key, value); 
    } 
    } 

    function wrapFunction(obj, fname, f) { 
    obj[fname] = function() { 
     var rv; 
     if (before) { 
     before(fname, this, arguments); 
     } 
     rv = f.apply(this, arguments); // Calls the original 
     if (after) { 
     after(fname, this, arguments, rv); 
     } 
     console.log(/*...*/); 
     return rv; 
    }; 
    } 
} 

(arguments, если вы не знакомы с ним, это волшебный псевдо-массив обеспечивает JavaScript, который содержит аргументы о том, что функция была вызвана я знаю, это выглядит как псевдо-код, но это не так)

Живой пример:..

function Thing(name) { 
 
    this.name = name; 
 
} 
 
Thing.prototype.sayName = function() { 
 
    snippet.log("My name is " + this.name); 
 
}; 
 

 
var t = new Thing("Fred"); 
 
snippet.log("Before wrapping:"); 
 
t.sayName(); // My name is Fred, with no extra logging 
 

 
snippet.log("----"); 
 

 
wrapObjectFunctions(
 
    t, 
 
    function(fname) { 
 
    snippet.log("LOG: before calling " + fname); 
 
    }, 
 
    function(fname) { 
 
    snippet.log("LOG: after calling " + fname); 
 
    } 
 
); 
 

 
snippet.log("After wrapping:"); 
 
t.sayName(); // My name is Fred, with no extra logging 
 

 
function wrapObjectFunctions(obj, before, after) { 
 
    var key, value; 
 

 
    for (key in obj) { 
 
    value = obj[key]; 
 
    if (typeof value === "function") { 
 
     wrapFunction(obj, key, value); 
 
    } 
 
    } 
 

 
    function wrapFunction(obj, fname, f) { 
 
    obj[fname] = function() { 
 
     var rv; 
 
     if (before) { 
 
     before(fname, this, arguments); 
 
     } 
 
     rv = f.apply(this, arguments); // Calls the original 
 
     if (after) { 
 
     after(fname, this, arguments, rv); 
 
     } 
 
     console.log(/*...*/); 
 
     return rv; 
 
    }; 
 
    } 
 
}
<!-- Script provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 --> 
 
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>

+0

Действительно полезно, спасибо! BTW Я изменил snippet.js на использование «console.log()», а не на изменение самой страницы. – theWebalyst

Смежные вопросы