?前言

我們?cè)诖蜷_百度或者知乎等網(wǎng)站查看源代碼時(shí)，在控制臺(tái)往往會(huì)看到如下圖所示的信息：

通過這種方式來幫助公司做招聘，是不是很有創(chuàng)意呢？一方面可以體現(xiàn)出這些公司對(duì)人才的渴望，另一方面也可以讓開發(fā)者們直接接觸招聘信息，更加高效的找到對(duì)公司感興趣的求職者。

接下來就讓來看看這些是如何實(shí)現(xiàn)的吧。

1. 基本的文字編排信息輸出

console.log作為javascript的全局方法之一，也支持輸出帶有格式和樣式的字符，比如我們使用/n進(jìn)行換行，使用css樣式為指定文本編寫樣式，如下：

if (window.console) {
    console.log('想和我們共同打造世界最大中文互動(dòng)問答平臺(tái)嗎？\n想讓自己的成就在億萬用戶面前展現(xiàn)嗎？想讓世界看得你的光芒嗎？\n加入我們，在這里不僅是工作，投入你的時(shí)間和熱情，滴滴汗水終會(huì)匯聚成不平凡的成果。\n期待你的加盟。');
    console.log("公司誠聘前端工程師，%c簡歷投遞地址http://www.badu.toudi.com", "color:blue;font-weight:bold;");
    console.log("請(qǐng)?jiān)卩]件中注明%c來自:console", "color:red;font-weight:bold;");
}

以上%c后面的本將用console.log的第二個(gè)參數(shù)制定的樣式來輸出，效果如下：

我們可以利用這些方式實(shí)現(xiàn)更加有創(chuàng)意的控制臺(tái)信息，包括公司的宣傳畫，招聘貼等。

2. 在控制臺(tái)打印字符畫

正如上文所展示的控制臺(tái)知乎招聘貼，我們也可以為自己的網(wǎng)站定制招聘宣傳貼。關(guān)于字符畫的編寫，我們可以一行行在控制臺(tái)敲，當(dāng)然這種方式不建議采用，我們可以使用網(wǎng)站http://patorjk.com/來生成自己的字符畫，然后在通過代碼包裝輸出到控制臺(tái)。

以上就是該網(wǎng)站的界面，我們只需要輸入想要轉(zhuǎn)化成字符畫的英文字符，就可以生成不同樣式風(fēng)格的字符畫。以下是HIRE的不同風(fēng)格的字符畫：

當(dāng)然這只是網(wǎng)站生成的一部分，該網(wǎng)站一共為HIRE生成了314中不同風(fēng)格的字符畫，是不是很強(qiáng)大呢？當(dāng)然我們單純只復(fù)制這些字符是遠(yuǎn)遠(yuǎn)不夠的，我們還需要用函數(shù)包轉(zhuǎn)一下，才能原樣輸出到控制臺(tái)。具體實(shí)現(xiàn)代碼如下：

<script>
    Function.prototype.makeMulti = function () {
        let l = new String(this)
        l = l.substring(l.indexOf("/*") + 3, l.lastIndexOf("*/"))
        return l
    }

    let string = function () {
      /* 你復(fù)制的字符圖案 */
    }
    console.log(string.makeMulti());
    console.log(/* 其他信息 */);
</script>

我們將上面從網(wǎng)站生成的字符畫復(fù)制到string函數(shù)中，執(zhí)行代碼后效果如下：

當(dāng)然我們可以繼續(xù)擴(kuò)展該函數(shù)，支持輸出彩色字符畫等功能，大家感興趣可以探索一下。