摸鱼时，发现的一些有意思的代码

在看简书的时候，打开控制台页面，可以看到如下的输出： 进入source下找到如下代码

var i = "#1475b2"
    , c = "#42c02e"
    , u = function (e) {
        var t = e.title
            , r = e.content
            , n = e.backgroundColor
            , a = ["%c ".concat(t, " %c ").concat(r, " "), "padding: 1px; border-radius: 3px 0 0 3px; color: #fff; background: ".concat("#606060", ";"), "padding: 1px; border-radius: 0 3px 3px 0; color: #fff; background: ".concat(n, ";")];
        return function () {
            var e;
            window.console && "function" === typeof window.console.log && (e = console).log.apply(e, arguments)
        }.apply(void 0, a)
    };

(function (e) {
    var t = e.title
        , r = e.content;
    u({
        title: t,
        content: r,
        backgroundColor: c
    })
})({
    title: "Environment",
    content: "production"
})

改造改造

var customizeConsole = function (e) {
        var t = e.title
            , r = e.content
            , n = e.backgroundColor
            , a = [`%c ${e.title} %c  ${e.content} `, `padding: 1px; border-radius: 3px 0 0 3px; color: #fff; background: #606060 ;`, `padding: 1px; border-radius: 0 3px 3px 0; color: #fff; background: ${e.backgroundColor} ;`];
        return function () {
            var e;
            window.console && "function" === typeof window.console.log && (e = console).log.apply(e, arguments)
        }.apply(void 0, a)
    };


    customizeConsole({
        title: "Environment",
        content: "production",
        backgroundColor: "#42c02e"
    })

示例如下： 然后我们就可以愉快的在项目中使用这些并没有什么卵用但有意思的代码了
关于console.log %c 语法可用的属性如下：

• background 与其全写版本。
• border 与其全写版本。
• border-radius
• box-decoration-break
• box-shadow
• clear 和 float
• color
• cursor
• display
• font 与其全写版本。
• line-height
• margin
• outline 与其全写版本。
• padding
• text-transform 这类 text-* 属性
• white-space
• word-spacing 和 word-break
• writing-mode
  参考资料：MDN