原创 理解 ES6 --- 數組新方法

英文電子書點此閱讀《understanding es6》 目錄 array in javascript (類)Array.of(), Array.from() find() and findIndex() fill() , copyWi

原创 input的autocomplete效果 ---又是一道騰訊編程題

題目 效果 代碼 html css js 思考 題目 頁面內有一個 input 輸入框,實現在數組 arr 查詢命中詞並和 autocomplete 效果。 效果 忽略圓圈,這是quickTime錄屏的side

原创 原生實現html5的拖拽功能 drag and drop

題目 思路 代碼 效果圖 拖拽庫 HTML5的拖拽API 題目 頁面內有一個正方形元素 A 以及一個待放置區域 B,實現對其拖拽和放下到 B 區域內,並且改變 B 區域背景顏色 (不可用 html5 原生事件)。 這

原创 遷移到webpack4:從webpack.optimize.CommonsChunkPlugin到config.optimization.splitChunk,以及有個搜出來的中文解決辦法是錯的

今天在對着webpack中文指南一點點敲demo,在代碼分離這一節遇到了一個報錯: webpack4 Error: webpack.optimize.CommonsChunkPlugin has been removed, please

原创 zepto 自定義模塊 生成zepto.min.js (自己存個檔,不想每次用的時候再去搜了)

linux 下 在git clone 下來的 zepto文件夾 運行以下命令 MODULES="touch data fx detect" npm run-script dist windows可能要改一下 make 源文件: //mak

原创 express 4+mongo 3+bootstrap 4 從零搭建微博

對着綠皮書《nodejs開發指南》來用express搭建微博,然而技術更新太快,很多老的api都用不成了,各種踩坑。這裏實戰新版本,以饗後來人。 戳這裏clone 整個github 項目源代碼 目錄 版本號 建立工程 全局安裝expr

原创 大數相加 之 javascript版 據傳是個騰訊面試題

前兩天看公衆號,有騰訊的面試題是遠程寫個大數相加。早上自己就練手寫了一個。 大致思路是用字符串代替數字,倒序後進位相加。暫時不考慮負數的情況。(正負數在判斷符號後,可以歸納爲異號相減,同號相加,最後處理符號即可)。 爲了調試方便沒有加函數

原创 理解ES6--第6部分:set 和 map , js中的字典,地圖,弱字典和弱地圖

英文電子書點此閱讀《understanding es6》 目錄 set and map 字典和地圖 ES5中模擬set和map ES6中的set ES6中的地圖 map summary set and map 字典

原创 用node-gyp手動編譯node的c++擴展模塊

又踩坑了,配置永遠比單純的寫代碼要更花費時間。也更令人挫敗。簡單記一筆吧。 最近在弄的一個視頻拼接的npm包,就有C++擴展,npm install 的時候屢屢不成功,後來總算成功了。實際引入的時候又找不到入口。排查了一下就是裏面用到了C

原创 爲了全局設MongoDB的路徑,mac下修改bashrc來配環境變量的心酸歷程

昨天配Mongodb是終端手動打的export PATH=xxxxx,但還是想找一個一勞永逸的方法。過程中頗多糾結,這裏小記一筆吧。 mac下登入終端後直接進入Users/yourUserName 目錄,在這裏直接 ls - al 找.b

原创 利用ES6的generator寫一個時間間隔遞增的定時器

任務是這樣,定時器在0時刻打出1,然後隔1s打出2,隔2s打出3…….如此,時間間隔依次遞增。 考慮用generator的 yield 功能來完成 停頓。 talk is cheap, here’s the code. function

原创 用僞元素做圖片的底部陰影效果

我司的 UI 雖然不是 處女座,但認(挑)真(剔)程度也與之不相上下了。作爲一枚前端,當然也不好意思掉鏈子,所以在 UI 小哥的督促下,會最大可能地完美實現視覺稿。於是乎,一些本來一行實現的東西,爲了效果美觀,會用更多代碼做得更加細緻。

原创 如何用css3畫一根優雅的0.5px細線

利用細線佈局、區分頁面是常用的手段。一般UI爲了美觀都會採用 0.5 px 而不是 1px 的細線。而這就造成了問題:由於屏幕和設計稿的分辨率轉換,如果在border中直接定義爲0.5 px, 會造成有時候細線被抹殺成 0 px,從而看不