整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
譯局是36氪旗下編譯團隊，關注科技、商業、職場、生活等領域，重點介紹國外的新技術、新觀點、新風向。
編者按：JavaScript在前端的地位不可撼動，相關職位的薪資待遇也在穩步提升。在這種繁榮的局面下，各種框架和工具層出不窮，一時間令初學的開發者眼花繚亂，不知該做何選擇。為此，從事軟件開發教學創業的Eric Elliott通過分析Google搜索趨勢、State of JS Survey、Stack Overflow等調查數據，以及NPM下載量、匯總的職位發布情況等，給出了有助于獲得一份JS編程工作的相關推薦，并且對未來十年的前沿技術進行了展望。原文發表在medium上，標題是：Top JavaScript Frameworks and Topics to Learn in 2020 and the New Decade
如果您想獲得一份出色的JavaScript工作，或者想跟上2020及今后10年的重要技術，那這篇文章你找對了。本文的目的不是要告訴你哪些技術棧和框架是“最好的”或者最受歡迎的技術，而是要介紹一下哪些技術棧和框架能為你在2020年及今后拿到一份好工作提供最佳機會。
我們會研究各種來源的數據：
按照主題跟蹤Google Search趨勢
State of JS Survey的數據
Stack Overflow Survey調查
Npm下載量
匯總的職位發布情況
這些指標都不完美，但就我們的目的而言，npm下載量和職位發布情況最為重要，當我們把這些指標匯總起來看的時候，就能清晰一致地描繪出JavaScript技術的版圖和趨勢。根據這些指標來選擇要學習什么框架是個好主意嗎？那要取決于你的目標是什么。
既然我們有一個明確的目標——為求職者尋找學習的投資回報率——那這項任務就比告訴每個人什么是最好的要容易多了。盡管沒有對所有目的而言都是最佳的東西，但客觀地定義什么能為你實現特定的具體目標提供最大的機會還是比較容易的。我們不妨看一些數據。
在你開始太過操心技術棧之前，還是請先學習好JavaScript以及怎么用它來編寫軟件吧。如果你還沒有辦法解釋什么是函數組合，什么是對象組合，什么模塊，請從此處開始（https://medium.com/javascript-scene/composing-software-the-book-f31c77fc3ddc）。一切軟件開發都是組合：我們把一個龐大而復雜的問題分解成可以用軟件的建構塊（函數、對象、模塊等）解決的小問題。然后再把這些解決方案組裝成我們的應用。我們的2020就先從充分了解JavaScript和軟件組合開始吧。
我喜歡npm下載量這個指標，因為它能夠很好地說明框架使用的活躍度*。業界常用的框架中下載量方面的得分會高得離譜，因為用戶是在本地機器上跑npm install的。
注：此處并不包括jQuery ，因為很多jQuery 項目都是不用npm的老項目，所以不管怎樣它都會被嚴重低估。把Svelte放進來是為了讓大家看看它在市場當中的相對地位如何，并解釋為什么它會缺席圖表的其他地方——因為還沒有足夠的數據可供Svelte做出有意義的展示。比方說，Google搜索趨勢里面還沒有這個主題。
此圖統計了目前提到了某個特定框架的職位空缺。*
按UI框架統計的崗位需求
跟去年相比，React的領先優勢擴大了，而Angular和jQuery都輸給了Vue 。這個餅圖顯示了每個框架的相對就業市場份額：
頂級框架在工作市場的份額
2019年，JavaScript開發人員的平均工資再次上漲，從11.1萬美元年收入增加到11.4萬美元。
*統計方法：在Indeed.com上搜索求職情況。為了消除假陽性，我把搜索跟關鍵字“軟件”進行配對以增強相關性，然后乘以?1.5（這大概是編程崗位列表中使用了“軟件”與與不使用“軟件”的之間的差異。 ）所有搜索結果頁均按日期排序，并抽查過相關性。這里得出的數字不是100％準確的，但是對于本文來說，這種精度已經足夠好了。
就像你可能會想到的那樣，搜索興趣*多少反映出就業市場的份額情況，但有一些有趣的差異。我們可以清楚地看到，從2017年到今天，大家對jQuery的興趣正在減弱，而對Vue.js的搜索興趣出現了強勁增長。以下是搜索的份額情況：
跟招聘廣告一樣，React有很大的領先優勢，吸引了前端框架36％的搜索量，其次是Angular（約27％）和jQuery （25％）。對Vue.js的搜索興趣比其在招聘市場的份額要大得多，但該數據通常與排名中的招聘市場數據一致?？磥砦覀円呀洺晒Φ刈C實了這一點。
*研究方法：所有術語、數據均按主題而不是搜索字收集，以便從無關的關鍵字匹配中排除掉假陽性。
跟其他受歡迎但使用不那么廣泛的框架（比方說Svelte或Vue，這兩個的滿意度排名都很高，但行業采用率相對較?。┫啾?，更多的崗位要找的是具備React技能的人。
學習Svelte或Vue 可能顯得很酷——但是，如果你的目標是找到一份工作的話，如果你先去學習React就會有更好的機會。
盡管如此，Svelte和Vue 在《State of JavaScript 2019》調查當中都獲得了很高的用戶滿意度分數。在過去，React的用戶滿意度得分高預示著會搶占當時占主導地位但滿意度得分相對不高的Angular的份額。
2019年，React的用戶滿意度排名最高，用戶滿意度達到了89％。緊隨其后的是Svelte（88％）和Vue.js（87％，低于去年的91％）。Svelte或Vue 不太可能搶奪太多的React用戶，但是還有有很多的Angular和jQuery 用戶可能會變節轉投Svelte或Vue ，從而在2020年推動這兩個框架取得進一步的強勁增長。
可以肯定的是，掌握React會增加你在2020年找到并保住好工作的幾率。
毫無疑問，過去幾年的時間里TypeScript的增長非常迅速，根據State of JavaScript調查，89％的TypeScript 用戶會再次選擇使用這門語言，有66％的受訪者要么用過TypeScript ，要么對使用TypeScript感興趣（略低于去年的71％）。
但是，盡管大家對TypeScript很感興趣，且使用率似乎也在迅速增長，但是招聘市場對具備TypeScript經驗的要求還不高。只有約7％的JavaScript招聘廣告的崗位描述中提到了TypeScript。當然這可能會低估了對TypeScript 職位的需求情況，因為招聘經理一般預期JavaScript開發人員掌握起TypeScript來不會有太大麻煩 所以有可能不會在崗位描述中提及TypeScript 。
但我個人堅持認為學TypeScript這門語言的投資回報率可能會比較低，甚至是負的。這有可能會降低而不是提高生產率，并且，如果您已經有TDD，代碼審查和設計審查等很好的漏洞預防措施的話，則用TypeScript編程不太可能會帶來顯著的減少漏洞的好處。
話雖如此，并不缺少對TypeScript的熱愛，所以你當然不應該怕它，或者因為人家用的是TypeScript 而不是JavaScript而拒絕別人求職。由于TypeScript 是JavaScript的超集，所以從JavaScript轉到學TypeScript并不像學習完全不同的語言那樣具有挑戰性。
想在2020年的就業市場競爭中脫穎而出你也許不需要學習TypeScript，但是TypeScript 引擎相當有用，哪怕對于標準JavaScript也是如此。
我每天用Visual Studio Code的時候都用他來給標準JavaScript 提供智能感知。甚至還可以利用JSDoc （TypeScript引擎可理解并解釋這種類型注釋）或外部d.ts 文件來增強這種智能感知，VS Code會自動獲取你所使用的模塊的TypeScript 定義。
注：用TernJS 和Atom這么多年我也一直享受著類似的好處，但是這種結合缺乏TypeScript 引擎+ VS Code 的維護性和社區支持。
如果你還沒用過Visual Studio Code，你可以先試用一下VS Code。順便說一句，VS Code在JSState調查受訪者心目當中是JavaScript IDE市場的領導者，占有57％的市場份額（其次是WebStorm ，占有14％的市場份額）。
Redux 在狀態管理器的競賽中仍然具有領先優勢，但是GraphQL 和Apollo在滿意度和興趣方面是增加的。預計2020年GraphQL會繼續保持增長。
話雖如此，哪怕你用的是GraphQL ，我仍然認為使用Redux 狀態管理有充分的理由，而且我認為即使不用框架，每個人都將從學習Redux中受益。
GraphQL 是近年來流行的查詢語言。它的語法簡單，但是由于它是跨整個技術棧使用的，而且學這個東西意味著必須學習怎么把它連接到數據存儲層，因此集成可能會令人生畏——但這是值得付出的努力。
GraphQL 不會在短期內完全取代JSON REST API，但是它在2019年的增長甚至變得更快了，我預計這種強勁的增長會持續到2020年。
Express 是主導性的Node框架，用戶滿意度很高，2020年Express不會遇到重大的挑戰者，但是隨著無服務器（serverless）的興起，我預計在新的十年到來之際，Express的統治地位會逐漸下滑。
Next.js是一個一開始建構在Express基礎之上的全棧React框架，但此后已從Express轉換到到無服務器和靜態優化，然后就像瘋了一樣發展起來。
當我們把EricElliottJS.com從Express換到無服務器的Next.js時，我們的托管費用降低了90％，而且頁面加載速度也加快了。所以我再怎么強烈推薦這個都不夠。我們現所有的應用都是用Next.js和Zeit 托管的。
Jest和Cypress分別單元測試和功能測試最受歡迎的工具，但是我個人非常喜歡RITEWay 和TestCafe 。RITEWay 是單元測試之禪 ：一個始終回答了每個單元測試必須要回答的5個問題的測試框架。
跟Cypress一樣，TestCafe也是一種功能測試工具，這個工具不需要你跟Selenium糾纏不清，但是擁有更好的跨瀏覽器支持和一個很酷的測試記錄器/ IDE。我強烈建議QA小組試試TestCafe 。
Lodash 、Ramda 、Immer、Redux以及RxJS都是我經常使用的函數工具。
Ramda在 2019年進步神速，它提供了一些Lodash 所沒有的工具，比如lenses（透鏡）和transducer（變形器）。RxJS通過pipeable運算符提供transducer風格的函數性。
Immer使得在不改變JavaScript對象的情況下對其進行操作變得很容易。而Redux 是一種狀態管理工具。
在接下來的十年時間里，有幾種新興技術即將對人類生活產生巨大影響。以下是這些技術最新發展情況的概要：
AI
人工智能也許是有史以來最具變革性的技術。不同的學者和自以為是的億萬富翁都把AI說成是奇跡般的烏托邦，或者人類的終結。
這肯定是我們所知的人類的終結，但也可能是人類與機器之間美好合作的開始。我們才剛剛開始瞥見AI可能會變成什么樣子。其中有些令人恐懼（比方說深度偽造），而另一些則非常有用（比方說Adobe Premiere對視頻編輯的新的auto-reframe功能）。事實上，到目前為止，人工智能既極其可怕又極其有用。人工智能會繼續制造一些令人恐懼的事情，但是通過人工智能改善人類生活的潛力是巨大的。潘多拉的盒子已經打開，再也無法關閉，所以我希望你善加利用好AI，用來解決重要問題和改善生活。
2019年在AI領域取得了許多重要突破。近年來，研究團隊一直在各種視頻游戲領域爭相實現超人的表現，但有些游戲類型對AI來說仍然充滿挑戰，比方說像《星際爭霸》II這樣的策略游戲。DeepMind的AlphaStar程序利用跟人類玩家能用到的相同資源，在Battle.net官方服務器實現了大師級的水平?！缎请H爭霸》是一款復雜的游戲，需要進行長期的策略思考，這種能力曾經被認為是AI所不能及的。戰略思維代表了通向通用AI道路上的一個重大的里程碑。
如果說把資源用到游戲上看起來似乎很愚蠢的話，不妨想想DeepMind 這樣的項目在文本轉語音方面也取得了令人難以置信的進步， AI代理和私人助理被賦予了表現更自然的聲音，但同樣重要的是，通過這樣可以把聲音還給那些失聲的人。
人工智能還被用來診斷癌癥，預測蛋白質折疊（可用于了解疾病和發現新藥），恢復殘疾人的肢體控制，生成逼真的圖像等。
無人車
無人車在變革性AI技術當中應該有自己的一席之地。這個生態體系的大玩家主要包括Cruise、Uber、Waymo、Nuro\Aurora以及福特等。這項技術仍處在初級階段，過分樂觀已給這個行業帶來了真正的問題，但毫無疑問，2020年代我們將見證超越人類水平的自動駕駛能力。2015年我曾對自動駕駛技術做出過預測：
“到2045年的時候，一倆人開的車看起來會像馬拉的雙輪單座車一樣?！?/p>
現在距離這一預測已過去5年，我想我可能低估了自動駕駛汽車進入市場的速度。Waymo的車在2018年的行駛里程超過了100萬英里，美國已經有24座城市的道路上有無人車上路。現在我的預測是到2025年，多個制造商將會推出多種L5級（全自動）的車型。請密切關注Tesla、通用、福特及寶馬的表現。
在過去十年的時間里，AI研究論文的出版量增長了10倍，現在，AI正在把實用、有用的工具交到主流用戶手中，預計這種趨勢在未來十年仍將持續。
我們已經開始看到AI能做到一些幾年前大多數人都不敢相信的事情。預期AI在2020年代會取得更大的奇跡。
區塊鏈和加密貨幣
2019年對于區塊鏈和加密貨幣來說是具有里程碑意義的一年。區塊鏈技術開始進入主流。我預計2020年會有更大的發展并為主流所采用。
對用戶友好，實現無需許可，無需銀行的借貸的DeFi （去中心化金融）出現了爆發式增長。目前，有6.5億美元（包括4.5億美元的無銀行貸款）被鎖定進DeFi 合同里面，而2019年是該技術出現的元年。隨著越來越多的人投資于加密貨幣，我預計將來會出現更多有加密支持的DeFi 貸款。
大家可以在不犧牲自己的加密貨幣投資機會成本的情況下獲得流動性，或利用DeFi貸款對加密貨幣進行杠桿投資（投資的風險/回報均增加了）。
加密貨幣和區塊鏈技術正在突破主流。比特幣和以太坊的日活地址在2018年1月達到了頂峰，隨后一年，由于市場下跌，大家的興趣變弱了（每上漲10倍之后，加密貨幣的價格就會大幅回落，然后又會在下一個周期攀爬到比上一個高峰高出10倍的新高）。
比特幣和以太坊區塊鏈上的日活地址數
Square的Cash App的Android下載量已超過1000萬次，在有著出色UX的簡單app里面，用戶可以購買，出售，接收比特幣。
Coinbase 的Android下載也超過一千萬。
Brave推出了內置的以太坊錢包，月活用戶數一下子從2019年10月的870萬增加到11月底的1040萬。
因為有了Sliver.tv和DLive，2000萬視頻游戲迷正在利用Theta網絡進行去中心化的流媒體直播。
2019年我最喜歡的進展是Fortmatic 的推出。不管你是不是在開發加密應用，你都可以用Fortmatic來替換用戶身份驗證并提高安全性，并且擺脫被供應商鎖定，還可以增加諸如端到端加密，簽名交易等功能。
如果你打算在2020年開發新應用，不妨考慮一下Fortmatic，而不是再得輸入自己的用戶名/密碼進行身份驗證（2020年沒人應該再這樣做了），或者把身份驗證這件事交給Google、Facebook等。
我曾經寫過一篇文章討論如何利用加密技術來改善應用的身份驗證和安全性。我很期待在2020年能看到主流應用開始采用Fortmatic等技術。
2019年以太坊輕松贏下了智能合約平臺大戰的勝利。我預計2020年以太坊仍將繼續占據主導地位。
擴展現實（XR）
自2015年以來，我每年都對AR未來充滿希望我，從小就夢想著它的實現。將來，XR將會取代手機。這只是個時間問題。需要多長時間仍然有待討論，但似乎這種轉變可能會在未來十年內出現。甚至可能在未來5年內開始。
隨著VR與AR之間的界限逐漸模糊，該行業現在正在把整個領域泛指為XR（擴展現實）。自問世以來，ARKit 和ARCore （分別是蘋果和Google的增強現實SDK）自引入以來已取得了長足的發展。月活用戶數已從2017年的4700萬增長到2019年5月的1.5億。
WebAR 在2019年已站穩了腳跟，2020年很可能會繼續發展。如果你對此感到好奇的話，不妨看看AR.js、React 360或Viro React。
硬件也取得了很多進展。2016年推出的Hololens 1大概是5000美元。自此之后又發生了什么呢？
Hololens 2的價格仍然高達3500美元，他們還沒有為消費者準備。剪切、SLAM（實時定位與地圖構建）及視野等方面仍然存在問題。你不會想一整天都戴著這樣的東西。但是，因為現在它的定價是每月99美元上手個開發者工具包還是有可能的，雖說你得在等待名單上等一段時間。
無人機
在美國已經售出了大約200萬架無人機，它們已經改變了建筑，地理調查，制圖，電影，航空攝影，農業，環境科學和娛樂等領域。2020年商用無人機物流配送最終可能在美國成為現實。
FPV無人機比賽是我最喜歡的觀賞運動，還有Drone Racing League直播賽事。如果你想了解它是什么樣的，他們還提供了精心設計的模擬器。
所有這些新的無人機活動均需要大量軟件支持，包括圖像處理，無人機地圖軟件，物流飛行規劃，遙測記錄和處理，分析，行業應用集成等。
這跟AI也有很多重合之處——自主飛行的無人機需要圖像處理，碰撞避免等。
2010年代為我們提供了大量變革性技術，其中許多我們已經視為理所當然，但其實是產生了巨大影響的：
Spotify
虛擬助手
無線耳機
主流VR
增強現實（熱門游戲“精靈寶可夢”就用這個）
經濟實惠的Tesla
共享經濟（汽車，電動滑板車，自行車）
主流平板電腦
主流生物識別技術（觸摸ID，面部ID）
眾籌
我已經迫不及待想看看你在新的十年會創造出什么樣的東西。
開始表演你的魔術吧。
譯者：boxi。
exceljs是一個讀取，操作和編寫電子表格數據和樣式到XLSX和JSON，從Excel電子表格文件逆向工程設計的項目。之所以稱它最強，是因為它的功能強大，簡直就是專門為Excel打造的前端處理插件，到目前為止，筆者還尚未見過比這個更強大的前端插件，由于其強悍的前端處理能力，這就意味著有很多操作將減輕服務器端壓力，而且性能更加出色！
https://github.com/exceljs/exceljs安裝我們當然是首選npm
npm install exceljsvar workbook = new Excel.Workbook();workbook.creator = 'Me';
workbook.lastModifiedBy = 'Her';
workbook.created = new Date(1985, 8, 30);
workbook.modified = new Date();
workbook.lastPrinted = new Date(2016, 9, 27);// 將工作簿日期設置為1904日期系統
workbook.properties.date1904 = true;“工作簿”視圖控制Excel在查看工作簿時打開多少個單獨的窗口。
workbook.views = [
{
x: 0, y: 0, width: 10000, height: 20000,
firstSheet: 0, activeTab: 1, visibility: 'visible'
}
]var sheet = workbook.addWorksheet('My Sheet');用addWorksheet函數的第二個參數設置工作表的選項。
// 創建一個紅色標簽顏色的工作表
var sheet = workbook.addWorksheet('My Sheet', {properties:{tabColor:{argb:'FFC0000'}}});
// 創建一個隱藏網格線的工作表
var sheet = workbook.addWorksheet('My Sheet', {properties: {showGridLines: false}});
// 創建一個第一行和列凍結的工作表
var sheet = workbook.addWorksheet('My Sheet', {views:[{xSplit: 1, ySplit:1}]});使用工作表id從工作簿中刪除工作表。
// 創建工作表
var sheet = workbook.addWorksheet('My Sheet');
// 使用工作表ID刪除工作表
workbook.removeWorksheet(sheet.id)// 迭代所有sheet
// 注意：workbook.worksheets.forEach仍然可以工作，但這個方式更好
workbook.eachSheet(function(worksheet, sheetId) {
// ...
});
// 按名稱獲取表格
var worksheet = workbook.getWorksheet('My Sheet');
// 按ID獲取表格
var worksheet = workbook.getWorksheet(1);。。。。。。以上只是部分文檔中的介紹，感興趣的小伙伴可以移步Github直接查看詳細的文檔，完整功能了解可參考下一個標題
PS：提供了中文文檔
雖然以上功能還不能包括了Excel的所有功能，但也已經相當的豐富了！
在之前的文章中曾介紹過另一個不錯的前端Excel插件，感興趣的可以去看一看，exceljs擁有這么豐富的功能，如果你想開發一個功能強大的Web電子表格，不妨多嘗試嘗試！
在Vue3中，多頁面開發的配置比較簡單，下面來看一下具體的操作步驟：
1.使用vue創建單頁面應用程序
見《Vue3腳手架指南》文章
2.在項目的根目錄下創建vue.config.js文件，如果已經創建則忽略
3.在src目錄下新建module文件夾，用于存放多頁面相關文件
module文件夾下用來存放頁面文件，一個頁面需要有最少三個文件構成，.html、.js、.vue，所以要創建一個最終的頁面，我們需要創建三個文件，在實際開發中，最好根據自己的習慣或者公司的約定來起文件名。我們一般會根據頁面的名稱來命名。比如登錄頁：login.html、login.js、login.vue。
4.在module下建立頁面
我們這里建立三個頁面：login、major、sub/sub1，根據這個需求，為了便于項目文件的管理，我們在module目錄下創建相應的子文件sub，在module下創建login和major的三個文件，在sub目錄下創建sub1的三個文件，如下圖：
5.編寫代碼
我們以login頁面為例來說明：
login.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Login</title>
</head>
<body>
<div id="app"></div>
</body>
</html>login.js
import { createApp } from 'vue'
import App from './login.vue'
createApp(App).mount('#app')login.vue
<template>
<div>登錄頁</div>
</template>
<script>
export default {
name: 'App'
}
</script>
<style scoped>
</style>其他頁面的代碼，請參照login頁面代碼編寫。
6.在 vue.config.js 文件中配置多頁面應用
vue.config.js
module.exports = {
pages: {
login: {
// 入口文件，相當于單頁面的 main.js
entry: 'src/module/login.js',
// 模板文件
template: 'src/module/login.html',
// 編譯后 dist 目錄下輸出的文件，可以包含子目錄
filename: 'login.html'
},
major: {
entry: 'src/module/major.js',
template: 'src/module/major.html',
filename: 'major.html'
},
'sub1': {
entry: 'src/module/sub/sub1.js',
template: 'src/module/sub/sub1.html',
filename: 'sub/sub1.html'
}
}
}7.啟動應用
>npm run server訪問：
http://127.0.0.1:8080/login.htm
http://127.0.0.1:8080/major.html
http://127.0.0.1:8080/sub/sub1.html
8.構建應用
>npm run build構建結果如下：
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
