在裝逼成本愈來愈高的JS圈，是時候充值一下了 ———— 題記php
§ 開發
Macbook Pro是標配，美其名曰「提升開發體驗」
什麼？你還在用Spotlight？趕忙給我換Alfred！ html
編輯器，Sublime / Atom / VS Code 三選一
雖然很想用IDE，但必定要忍住，而且與人解釋道：
「啓動速度慢，消耗資源多，不適合我這種完美主義者
若是不是爲了美觀，我寧願使用 Vim / Emacs」 前端
命令行iTerm2 + Oh-my-zsh
二逼青年用bash，普通青年用zsh
咱們也只是想作一名普通人罷了 java
查資料雖然都是百度
但必定要稱都是用Google
且要說英文而不是中文的「谷歌」
使用美式發音，當本身是灣區老司機 node
儘管四級飄過，六級沒過
在Stack Overflow上點數也低
但也要說天天都與各國程序員談笑風生jquery
§ 語言
這年頭若是還不用Babel + ES6
都很差意思說本身是JSer
固然還有 TypeScript / CoffeeScript / Dart ...
沒學過不要緊
對外人說本身「略懂」便可
反正最後都是編譯爲ES5，你懂的 git
爲了不對方深刻問
此時你應該繼續發表高見：
「JS是基於原型的函數式弱類語言
引入類與強類真的是不三不四」
說到此，頓一下，表現出百感交集
隨後繼續徐徐道：
「可大勢所趨，吾等小輩唯隨波逐流」
說罷，便可揮揮衣袖轉身離去程序員
在這裏不得不提一下，雖然使用Bable轉碼能夠盡情裝逼
但其對某些新特性的轉換至關二逼（詳情請看這篇文章）
一句話：Babel雖好，但別貪杯哦（推薦Babel在線實時編譯）github
§ 代碼風格
摒棄JSLint / JSHint / JSCS，擁抱ESLint
儘管平時只是個搬磚的
但時刻以世界頂級企業的規範約束本身
因而eslint-config-airbnb成了咱們的標配
通常新手是這樣寫的：
/* Low */ if (a) { return b; } else { return c; }
逼格稍微高一點的這樣寫：
/* Bigger */ if (a) return b; // 提早結束，免用大括號與else return c;
實際上還能更進一步：
/* Bigger than bigger */ ① return a ? b : c // 不要寫分號，留白予人想象的空間 ② return a && b || c
總而言之，代碼越短，可讀性越差，逼格越高
不能讓人隨便看懂，就像人不能輕易讓人看透
§ 奇技淫巧
罄竹難書
§ 經常使用庫
DOM庫
標配是jQuery，手機端有Zepto做爲替代品
想要裝逼且不怕坑，那就上Mootools
Prototype？嗯，復古的逼格都是很高的
必定要說本身純粹爲了優雅簡潔，不得不用jQuery
（如何作到jQuery-free，請看這篇文章）
固然，就算是寫jQuery
也能體現出逼格
咱們來看看新手通常是怎麼寫的：
/* Low */ var value = $(".container .myInput1").val(); $(".container .myInput2").val(value); $(".container .myInput3").attr("disabled", "disabled");
用雙引號，以及對選擇器性能認知不足，是新手的特徵
通常直接使用類選擇器的，都是對用戶體驗頗有自信的
/* Bigger */ // 把div.container命名爲myDiv var $myDiv = $('#myDiv'), // 緩存DOM v = $myDiv.find('.myInput1').val(); $myDiv .find('.myInput2').val(v) .end() // 堅持鏈式調用 .find('.myInput3').attr('disabled', 'disabled');
（有關jQuery選擇器的性能以及最佳實踐，請看這篇文章）
UI
BootStrap爛大街
不是咱們的菜
咱們選擇的標準是門檻要高
因而
Foundation6 / Ant Design
映入眼簾
請謹慎使用
Semantic UI / UIkit / Amaze UI ...
避免不能自拔
工具庫
後浪lodash把前浪underscore拍死在沙灘上
因而它成了惟一的選擇
不過爲了保持逼格
咱們要儘可能使用原汁原味的ES6
就算要用也必定要注意素質：
/* Low */ import _ from 'lodash' // 把整個lodash打包進去了
/* Bigger */ import isEmpty from 'lodash/isEmpty' // 僅把個別函數打包
模板引擎
逼格最高顯然是Jade
但更名爲Pug（哈巴狗）後
就像是小龍女被尹志平不可描述後
再也無愛了
今後之後
留了鬍子（Mustache）
扶着把手（Handlebars）
默默耕耘
異步編程
這裏不談 Q / Bluebird / Async / co / then 等庫
皆因Babel已經支持全部的異步編程解決方案
當前最經常使用的仍是Promise
有些新手會寫出這種代碼：
/* Low */ // 找出與用戶1同市的全部用戶 User.findById(1).then((user) => { User.find({ city: user.city }).then((users) => { res.json(users.toJSON()) }) })
這屬於Promise反模式，與回調函數無異
/* Bigger */ User.findById(1).then((user) => { return User.find({ city: user.city }) // 返回Promise }).then((users) => { res.json(users.toJSON()) }).catch(next)
§ 包管理工具
若是你被
Bower / spm / Component / Duo ...
坑過
請回到npm的懷抱
什麼？jspm？有完沒完...
§ 構建工具
想當年我不懂什麼是自動構建工具
他們說：生命苦短，咱們用Grunt
好不容易用上Grunt的時候
他們又說：Gulp基於流，符合Unix哲學
以後我虔誠地換上了Gulp
他們雙說：Webpack最好用
最後終於用上了Webpack
他們叒說：FIS3約不約？。。。
§ 模塊化方案
不管是
-
RequireJS (AMD)
-
SeaJS (CMD)
-
KMD.js (KMD)
-
Browserify (CommonJS)
-
...
最後都慶幸迴歸到npm + Webpack
什麼？SystemJS？有完沒完...
§ MV*框架 / 技術棧 / 大型框架
Backbone
每一個人都有一段不堪回首的經歷
就像當年在QQ空間發「你若安好即是晴天」的說說
Backbone就是這樣子的存在
Angular
必定要邊吐槽邊用，否則就一點都不ng了
「學習曲線陡峭」不該從你口中說出
「學習過程趣味盎然」纔是你的菜
Vue
必定要用「優雅」來形容
就像用ES6必定要「大膽」
React技術棧
React已是前端高逼格的代名詞
因此不管懂不懂都要喊：
「React大法好」
由於這是一種信仰
稱讚JSX的標新立異
談談 Flux / Redux
扯扯 Elm / RxJS
每到深刻則戛然而止：
「太深刻的太抽象，大家未必能理解」
由此，聽者只會更加崇拜你
其餘
還有國內相對小衆的 Ember / Knockout / Avalon
（請別再把 YUI / Dojo / Ext / KISSY 扯進來了好伐）
§ 混合 / 原生開發
自從PhoneGap出來後
貌似咱們也能搶安卓/iOS的飯碗了
Ionic更是將Hybrid APP推向高潮
不過混合始終比不上原生
因而React Native應運而生
最近多了一個新的選擇：Weex
別忘了還有桌面的nw.js以及Electron
JSer從一入門開始，就掌握了改變世界的能力
也比其餘程序員更容易走向人生的巔峯
§ 後端框架
咱們一直標榜本身是全棧
不玩幾下後端框架怎麼行
快遞員用Express
風溼患者用Koa
哲學家用ThinkJS
水手用Sails
還有全棧的Meteor
上述都用一遍
相信也快轉行了
§ 服務器進程管理
既然都玩上了後端框架
不懂部署服務器怎麼行
二逼青年用supervisor / nodemon
文藝青年用forever
普通青年用pm2
裝逼青年用Tmux + node
§ 結語
import you, { isGoodPost, star } from 'you' import { thank } from 'i' const me = 'https://github.com/kenberkeley/bigger-jser' if ( isGoodPost(url) ) { star(me) thank(you) }