JavaScript OOP: Log Implementation

Question

I wrote the following code to implement logging in a separate js logger.js file using OOP.

var console; function Logger() { init(); } var init = function() { if(!window.console){ console = { log: function(message){}, info: function(message){}, warn: function(message){}, error: function(message){} }; } else { console = window.console; } }; Logger.prototype.log = function(message) { console.log(message); } Logger.prototype.logInfo = function(message) { console.info(message); } Logger.prototype.logWarn = function(message) { console.warn(message); } Logger.prototype.logError = function(message) { console.error(message); } 

I use it from another js file, site.js, like:

 var logger = new Logger(); //global variable var getComponentById = function(id) { var component = null; if(id) { try { component = AdfPage.PAGE.findComponentByAbsoluteId(id); }catch(e){ logger.logError(e); } } return component; } 

It was interesting to me

• If I implemented the Logger class correctly, supporting OOP JavaScript.
• Will it handle a scenario in which the browser does not have a console?
• How can I make the init() method inaccessible from another js file or method? I mean, how can I make this private ?

Any pointer would be very helpful to me.

Update

From another SO thread, I found information about a private method, and I changed my approach:

 function Logger() { init(); } Logger.prototype = (function() { var console; var init = function() { if(!window.console){ this.console = { log: function(message){}, info: function(message){}, warn: function(message){}, error: function(message){} }; } else { this.console = window.console; } }; return { constructor: Logger, log: function(message) { this.console.log(message); }, logInfo: function(message) { this.console.info(message); }, logWarn: function(message) { this.console.warn(message); }, logError: function(message) { this.console.error(message); } }; })(); 

But in this case, I get an error that init not defined.

Answer 1

To answer your questions:

• Your class implementation is a bit odd. You access the console variable with closure, since this property in Logger makes more sense.
• If the browser does not have a console, you will not get an error (but the log will not do anything)
• To make the init function unique, you can transfer it to IIFE (immediately called function expression)

I took your code and modified it a bit to come up with the following:

 // Create the Logger function with an IIFE, this keeps all of the private // variables out of the global scope, the only thing in the global scope // is the function returned by the IIFE. var Logger = (function (w) { var Logger, DummyConsole; DummyConsole = function () { this.log = function (message) { alert(message); }; this.info = function (message) { // Implement however you want. }; this.warn = function (message) { // ... }; this.error= function (message) { // ... }; }; Logger = function () { if (!w.console) { this.console = new DummyConsole(); } else { this.console = w.console; } }; Logger.prototype.log = function(message) { this.console.log(message); }; Logger.prototype.logInfo = function(message) { this.console.info(message); }; Logger.prototype.logWarn = function(message) { this.console.warn(message); }; Logger.prototype.logError = function(message) { this.console.error(message); }; return Logger; }(window)); // create a logger instance to check that the Logger class logs to the console. var a = new Logger(); a.log("hello"); // Remove the console. window.console = null; // Create a new logger checking that it falls back to the dummy console implementation. var b = new Logger(); // An (annoying) alert is shown. b.log("Hi"); 

The code is available as JSFiddle here: http://jsfiddle.net/mtufW/