Blackbing Playground

logger.js for switching production and development

發表於 |

在開發時常常會需要用console來除錯或是檢查流程，但推到production上必須要將這些log清除，雖然console很好用，但適當的log可以輔助除錯，如果推到production就強制將console.log都從code裡頭移除也不一定是好事，因此常常會看到會有一個管理log的global function，例如：

1
2
3
4
5
var log = function(s) {
    if (typeof console !== 'undefined' && console !== null) {
          return console.log(s);
    }
};

不過這樣簡單的function就不夠彈性，結合大家的想法，希望這個logger至少能夠handle幾種情況

  • 可以直接呼叫Logger(‘foo’)
  • 也可以擁有console api 的功能，例如warn, info, group等等特殊功能
  • 快速切換production or dev環境
  • 就算有人不小心寫了console.log，只要我切換到production環境，就不會印任何東西
  • 萬惡的IE也要能運作正常，而不是強制關掉log(例如開啟開發人員工具還是可以看到log)

於是，Logger.js 就誕生了，由於現在都用http://coffeescript.org/ 寫js（用了就回不去了），因此js是coffee產生出來的。也順便做了http://requirejs.org/的require版本，若在專案有用到 require.js 可以直接require。
雖然只是很簡單的 code，不過對我來說很實用，跟大家分享。

###Get the sourcecode(Github): http://github.com/blackbing/logger.js/

實作上遇到幾個問題，原本構想是希望像jQuery一樣，可以直接呼叫，也可以呼叫function處理，例如：

1
2
3
$('#main')
  $.ajax()
  $.bind()

原本我以為要用覆寫prototype的方式來處理，繞了一大圈纔知道根本不用（真是暈了我），javascript原本就是「物件」導向，所有變數都可以是物件，因此function其實也是物件。犛清了這個觀念之後，實作就很容易了，首先宣告為function，接著再一一指派，大功告成。有興趣的就再研究 http://github.com/blackbing/logger.js/吧。乾杯。

###http://github.com/blackbing/logger.js/