JavaScript: debug yourself

or why JavaScript is still an awesome language.

Today I had the maybe strange idea to create a function that debugs a function given as a parameter.

debug (callback) {
return (...parameters) => {
// eslint-disable-next-line standard/no-callback-literal
const result = callback(...parameters)
console.log(, parameters, result)
return result

So as you can see debug creates a wrapper function for the given function to wrap each call of the given function. With this you can see in your console what is going on. So if we want to get an idea what the next function is doing

this.toggleLocation(parseFloat(, parseFloat(place.lng))

we surround it with the debug putting the arguments afterwards

this.debug(this.toggleLocation)(parseFloat(, parseFloat(place.lng))

The result in the console gives as an insight into the call.

Another case I have tested was those rules I have to validate input fields like below.

nameRules: [

Surrounding by debug it gaves me details about each call.

nameRules: [

You can push this even further by nesting a whole class or object and all its functions. And in the end you get a fully trace of what is going on. It behaves like a proxy.

See you

Developer since the 80'th …

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store