jingks

美化 console.log

console.log 可以添加显示样式 eg:

console.log('%cfuck', 'font-size:20px')

我们用 IIFE 封装下:

(function() {
    var _log = console.log;
    console.log = function() {
        if (typeof(arguments[0]) != 'object' && typeof(arguments[0]) != 'function' && arguments.length == 1) {
            _log.call(console, '%c' + arguments[0], "text-shadow: 0 1px 0 #ccc,0 2px 0 #c9c9c9,0 3px 0 #bbb,0 4px 0 #b9b9b9,0 5px 0 #aaa,0 6px 1px rgba(0,0,0,.1),0 0 5px rgba(0,0,0,.1),0 1px 3px rgba(0,0,0,.3),0 3px 5px rgba(0,0,0,.2),0 5px 10px rgba(0,0,0,.25),0 10px 10px rgba(0,0,0,.2),0 20px 20px rgba(0,0,0,.15);font-size:5em")
        } else {
            _log.call(console, ...arguments)
        }
    }
})()

代码的意思是如果 console 只有一个参数,并且不是函数或者对象就用我们定义的样式,否则用 console 的默认输入。然后用油猴之类的插件在页面加载时就加载这个函数,就可以告别原来无聊的调试了,当然你也可以写一个样式库,写一个随机函数,这样每次 console 都会有惊喜了。