Vue 3源碼基本上使用TypeScript編寫。做為前端,是不是該學TypeScript啦?

雪之夢技術驛站



因此,關於你的提問,我可以肯定的告訴你,作為前端開發者,我們此時比以往任何時候更需要學習TypeScript,以下是針對這個答案的觀點,歡迎大家指正。


首先我們來了解下什麼是TypeScript

C#語言的創始人 Anders Hejlsberg 設計了 TypeScript,並於2013年6月19日發佈了其第一個正式版本,它是JavaScript的一個超集,之所以設計這個語言的初衷就是幫助前端開發人員能像後端開發人員那樣利用高級語言的特性進行編寫代碼。比如可以利用高級語言的這些特點:強類型、面向對象、語法檢查,代碼編譯等。TypeScript 還有一個最大的特點就是可編譯 ,編譯的好處就是有利於發現錯誤,一發現錯誤就終止編譯,提前幫我們定位問題,編譯通過後,就會將 TypeScript 語言轉換成高質量的原生JavaScript 代碼。


經過這幾年的發展,TypeScript 的最新版本是3.X,目前是微軟最有影響力的產品之一,最重要的一點是現在完全免費並且開源。還有一個比較有趣的事情是,連谷歌這樣競爭對手,在其 Angular 的前端框架產品上,也放下成見,從2.0 版本就開始擁抱TypeScript,可見谷歌在這件事情多麼有先見知名,現在 React 、Vue 才意識到使用TypeScript。從目前的情況來看,如果你不學習TypeScript,Angular 框架你就無法使用,在過不了多久,React 、Vue 也不好說會不會強制要求我們使用TypeScript,反正Angular 最早這麼幹了,目前還是主流的前端框架之一。


然後我們在來分析下 JavaScript 的現狀

這幾年 JavaScript 可謂發展迅速,可謂全平臺通吃,現流行稱作“大前端”,目前前端不僅能做網站、還能做手機端、WebGL 3D 動畫、VR、後端、遊戲開發、物聯網開發、甚至人工智能等等,這些互聯網產品的主要形態,幾乎都可以用前端來完成。由於其發展太快,JavaScript 這門語言也在緊跟時代的步伐,並且改名ECMAScript,幾乎每年都會有新版本發佈,目前最新版本應該到10了,就是這樣的發展速度,還是與java 和 c# 這些成熟的高級語言還有很大的距離。由於版本的問題,我們在項目中可能混雜著各版本的腳本,造成了規範不統一,兼容性差的各種問題。


接下來,我們來回顧下 JavaScript 的常見的場景,由於其實弱語言的特點,不會進行類型檢查,比如 1+“1” 這個問題,有可能是我們人為失誤的原因多寫了雙引號,其結果不會報錯,會正常輸出一個我們不想見到的結果11,這就造成了我們很難發現問題。除此之外,還有莫名其妙的各種undefined問題,也不會影響程序運行,增加了我排查問題的難度。


因此我們需要一個工具幫我們降低 JavaScript 弱語言的脆弱性,減少由於不正確類型導致錯誤產生的風險和各種版本混雜造成錯誤的風險等等。TypeScript 的出現正好解決了我們的這類問題。


接下來具體分析下 TypeScript 的特點和優勢


1、入門容易,前端開發者很容易上手

TypeScript 從表面上看來就和普通的 JavaScript 代碼差不多,無非就是把高級語言的強類型這個最主要的特徵引入JavaScript,就好像為 JavaScript 上了一把高級語言強類型的鎖,避免這類問題的產生,由此不得不佩服微軟的良苦用心,就是為了讓我們前端開發者更好的更快的學習TypeScript。我們先來看段代碼,理解下強類型的特徵,如下代碼所示:

你可能認為這段代碼很平常,如果你這樣調用 increaseAge(cat),TypeScript 編譯器就會報出錯誤,提示你increaseAge這個函數的參數必須是數字。如果是原生 JavaScript 不但不報錯,還會正常的返回結果,這就大大增加了我們開發過程中潛在的風險及排查錯誤的時間成本。這也許就是TypeScript 的魅力所在,提前幫我們發現代碼出現錯的風險。


2、按需編譯成我們指定的 JavaScript 版本

在上面分析 JavaScript 的現狀時,我們提及到 JavaScript 版本幾乎每年都會有新的版本,如果你要寫出兼容性比較高的腳本,對於我們前端開發者來說是一個很大的挑戰,你不能保證每個人都使用let,或者超前使用最新語法特性等。TypeScript 卻很好的解決了此問題,你可以按需輸出你需要的腳本,比如 ECMAScript 3、ECMAScript 5 、ECMAScript 6 。同時 TypeScript 還與時俱進,緊跟 JavaScript 的新特性,這就意味你可以使用這些新特性進行編寫,無需考慮其是否兼容,兼容的事情都交給 JavaScript 編譯器吧。


3、代碼規範標準,有利於團隊協作開發

現在的互聯網產品越來越複雜,形態又多,各終終端,一個產品不可能只有一個前端進行開發,現在前端開發也是團隊的開發模式,剛才提及到 JavaScript 本身的特點還有其發展太快,這就會造成每個人寫代碼的隨意性就會很大,你當然可以為團隊引入 eslint 這些插件進行代碼質量檢查,但是你要整理出這些規範來估計要花費不少的時間。與其花時間在這上面,還不如在TypeScript 的基礎上,結合 TypeScript 的特點做一套標準即可來應對 JavaScript 版本不斷更新的特點。


最後給前端初學者的一些建議

如果你是 JavaScript 的新手,我不建議你一上來就學習 TypeScript,等你有了一定的基礎,對前端的概念和邏輯有一定的認知後,再學 TypeScript 也不晚,並且學習起來更快 ,這樣你就會寫出更健壯的 TypeScript。TypeScript 這個工具的設計初衷並不是為了吸引更多的人學習前端,而是為了讓具有一定基礎的前端開發者編能像其他高級語言開發者一樣編寫出質量更高的健壯性的代碼。


小節

今天的內容就分享到這裡,不知道我的這些觀點是否能說服你去學習 TypeScript 。還有一個原因我漏掉了,我在這裡補充下,你會發現目前端崗位的招聘需求裡有的公司都明確要求熟練掌握TypeScript啦 ,學習TypeScript本身並不難。它像JavaScript一樣編寫和運行,只是增加一些新的理念和語法糖,我們學起來也會更加順手,加油吧,現在開始學習 TypeScript 並不晚。

感謝大家閱讀,如果你有什麼好的想法歡迎到留言區分享交流,如果你贊同我的回答,歡迎給個贊和轉發,謝謝支持。

前端達人


在前端進階的路上,TypeScript真的是必不可少的,也是極為重要的,真正的吃香,很得寵,目前前端框架Angular、Vue、React已全部支持TypeScript。你要去熟知,熟練,肯定會為你找工作添加很多機會。

TypeScript

TypeScript是JavaScript的一個超集,支持ECMAScript 6 標準,有由微軟開發的自由和開源的編程語言,其設計目標是開發大型應用,它可以編譯純JavaScript,編譯出來的JavaScript可以運行在任何瀏覽器上。

前端標配Vue

作為一名標準的前端開發人員,掌握並熟練Vue的使用已經是一個標配了,那麼從這一方面來看,如果你想熟練並精通Vue框架,就必須從源碼入手,就像你想成為一黑客,就必須瞭解Windows系統後臺源碼一樣,想當初也是,想精通js,那麼你必須的熟練js源碼一樣,知道了它怎麼運行,什麼原理,你才可以去用它,給你自己加砝碼。如今Vue3.0出來了,使用TypeScript編寫,你說能不學習嗎?往後會更火,上GitHub你就能看見有多少星星了。

TypeScript特點

1、提高代碼質量

一段代碼好不好,就要看它的可維護性、健壯性、簡潔而不簡單,TypeScript能從這些方面提高代碼的質量,不為別的,如果你做過大項目,後期對於長期迭代的項目、開發和維護的成員會很多,每個人獨有每個人的風格,流動性也很大,代碼質量過關就可以避免一些問題,我們公司就使用jshint統一規範,不能通過不能上線。

而TS就可以為我們幫助規避這些問題,從而提高代碼的質量。

2、對面向思想進行了加強

維基百科對OOP的定義是:是種具有物件概念的程式編程典範,同時也是一種程序開發的抽象方針,它可能包含資料、屬性、程式碼與方法,對象則指的是類的實例。它將對象最為程序的基本單元,將程序與數據封裝在其中,以提高軟件的重用性、靈活性與擴展性。物件裡的程序可以訪問經常修改物價相開外的資料。

接口:

當我們設計程序的時候,基類中的所有方法都不用去實現,就可以使用接口來實現,提高延展性。

泛型:

泛型可以用來創建可重用的組件,一個組件可以支持做種類型的接口,這樣使用者就可以通過用自己的數據來使用組件。這樣一來就可以最大限度的重用代碼,保護類型的安全。降低了強制轉化操作的成本與風險。

TypeScript發展前景

你看了上面幾張圖以後發現,他們都有在用TypeScript,真的是這樣,基於TS開發的項目越來越多,因為在Web應用變複雜的同時,js慢慢的透露出一些問題,性能不能滿足一切場合的需要,語法太靈活導致在大項目中bug接踵而至。

但是TypeScript通過為js加入靜態類型檢查改進js的鬆散語法,提神代碼的健壯性,對於性能問題,有GOOGle、MICOSof、Mozilla、Apple等幾家公司合作發起一個關於面向Web的通用二進制和文本格式的項目——webAssetmbly。大家又興趣的可以去了解一下。我就不多所,我也不瞭解哈。

總結

說這麼多,也不如去嘗試一下,有中文文檔,而且也很完善,跟著上手操作一波,也很簡單,反正適用於js程序員學習,小白們可以去適當瞭解學習一下,發展前景還是相當可觀的。


以上就是本問題的全部內容,希望本文能對你有幫助,謝謝閱讀。

PS:本文為‘Web前端進階指南’原創,手動碼字不易,小夥伴們別忘了順手點個贊加個關注哈,後續會帶給你們更多的前端小知識,感受前端帶來的魅力。


Web前端進階指南


ts當然要學,ts的技術棧和體系已經相當成熟了,該工程學結構開發效率和質量都很高。


程序猿創業筆記


要學!

Typescript是趨勢,不可逆!

Vue已經是web開發標配,後端都會用了,你覺得作為前端你還有啥優勢?

雖然不會ts不影響使用,但很多知名的庫都在用ts重構,比如ant.design,vant等等,我怕以後你搜個資料源代碼都是ts版,只會傳prop,別說改了,看都看不懂,你說尷尬不!


老郵局


我覺得不應該糾結到底學不學,而是TS是開發中大型項目必須的,因為每個人寫的風格都不一樣,但是通過TS可以強約束我們寫出可擴展,可插拔健壯的代碼邏輯,同時加深自己的嚴謹性。根據自己的需要判定,本來TS也不是多麼難學的一個東西(當然只是用來寫項目,並不是去研究這門語言,除非你自己寫個解釋器😂)


分享到:


相關文章: