iT邦幫忙

2021 iThome 鐵人賽

DAY 3
0
Modern Web

Flutter web 的奇妙冒險系列 第 3

Day 3 | Dart 基本介紹 - Dart vs JS

  • 分享至 

  • xImage
  •  

Dart是什麼?

Dart 是一個靜態強型別的語言,同時支援物件導向程式設計(OOP)及函數式程式設計(FP)的特性,

而 Dart 正是「Flutter」所使用的語言,原本是 google 為取代 JavaScript 而設計的語言,所以在語法上借鑑許多 JS 的特點,同時剛好補足一些我認為的缺點。

這裡先來大概列舉JS的差異,而與其他語言一樣的基本語法就會直接省略(條件判斷及迴圈相關等)。

相似的地方:

  1. first-class function
  2. 非同步程式設計的相關概念
  3. 基本語法、運算子大部分類似

相異的地方:

  1. JS是 prototype-base 而 Dart 則是 class-base
  2. Dart 是強型別且支援型別推斷
  3. Dart 擁有健全的null safety功能
  4. 執行環境

根據以上幾點我認為 「 Dart 是具有Type保障且是class-base的JS」 *,基本上只要是熟悉JS的開發者轉而學習Dart的學習曲線是相當友善的。在網路上其他文章也有看過「Dart是融合JavaScript與Java優點的語言」,但因為我沒使用過Java所以對這個觀點就不多做評論了。如果有使用過Java的讀者可以在底下留言與大家分享一下你的觀點。

特別說明一下差異裡的後三點,型別這個問題,有寫過JS的讀者應該都有遇過 「xxx is not defined」 這種runtime error,但如果有型別系統,在開發期間的編輯器靜態檢查就能很大的一部份避免這些問題了。

當然如果跟TypeScrpit相比一樣也能達成上面的需求且對於開發體驗的提升也很大,但使用TS有時會遇到第三方package的generic type很難標,甚至最後標成 any。但因為Dart本身就有型別系統所以基本上第三方的pub還是有型別保障的。

那 null safety指的是什麼?最大的好處就是我們可以在開發時很有把握的知道這個變數是不是null的而不必其他額外的null判斷,至於是怎麼做到的後面的篇章會介紹到。

(題外話:因為null safety所以現在Dart/Flutter在使用第三方的pub時也是有很多的坑)

至於執行環境,JS在node出現之前大部分就是直接跑在瀏覽器上

而Dart本身可以分成兩類平台

  1. Dart Native
  2. Dart web

Dart Native:簡單來說就是同時利用Dart 兩種編譯模式JIT(即時編譯)及AOT(預先編譯),開發時是使用JIT編譯模式跑在Dart VM上(可以想像成跟node.js一樣)然後到production時則是採用AOT的形式。
這樣就能讓我們是開發時享受到hot reload的之類的好處,而到了production環境時AOT編譯器就會產生出該環境要用machine code,讓程式的啟動時間減少。

Dart web:基本上就是將Dart轉成JS,開發環境會使用dartdevc,production則是用dart2js。而flutter web也是利用已經成熟的dart2js才得以實現的。

今天的內容就大概到這裡,明天我們將會正式進入Dart的語法介紹了。


附註* :prototype-base或者class-base哪個比較好也許是沒有絕對的答案,根據周遭的意見大多數的人還是比較喜歡class-base的寫法。雖然js後來有 class 這個語法糖但終究不像是操作class、instance那樣的感覺。

參考資料

  1. https://dart.dev/overview#platform

上一篇
Day 2 | Dart 開發環境設定
下一篇
Day04 | Dart基本介紹 - 變數宣告與基本型別
系列文
Flutter web 的奇妙冒險30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言