You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
Web-Dev-For-Beginners/1-getting-started-lessons/1-intro-to-programming-lang.../translations
Olga Kitel e20be69899
[RU] Translation to Russian (#467)
3 years ago
..
README.el.md 🚚 Renames greek ISO code to 'el' 3 years ago
README.es.md changing quiz app link 3 years ago
README.fil.md Add Translation to Filipion (#460) 3 years ago
README.fr.md changing quiz app link 3 years ago
README.hi.md changing quiz app link 3 years ago
README.id.md changing quiz app link 3 years ago
README.it.md changing quiz app link 3 years ago
README.ja.md changing quiz app link 3 years ago
README.ko.md changing quiz app link 3 years ago
README.ms.md changing quiz app link 3 years ago
README.nl.md changing quiz app link 3 years ago
README.pt.md Correction in translation to pt-br 3 years ago
README.zh-cn.md fix typo 3 years ago
README.zh-tw.md changing quiz app link 3 years ago
assignment.el.md 🚚 Renames greek ISO code to 'el' 3 years ago
assignment.es.md Create file assignment.es.md 4 years ago
assignment.fr.md Update 4 years ago
assignment.hi.md Removed en-us from links 4 years ago
assignment.id.md Removed en-us from links 4 years ago
assignment.it.md Removed en-us from links 4 years ago
assignment.ja.md Removed en-us from links 4 years ago
assignment.ko.md Removed en-us from links 4 years ago
assignment.ms.md Removed en-us from links 4 years ago
assignment.nl.md translate 1.1 to Dutch 4 years ago
assignment.pt.md pt assigment 1.1 4 years ago
assignment.ru.md [RU] Translation to Russian (#467) 3 years ago
assignment.sw.md edits for swahili format 4 years ago
assignment.zh-cn.md translate Ch. 2-2 assignment into zh-cn 4 years ago
assignment.zh-tw.md revise zh-tw article & add lesson 7 missing file 4 years ago

README.zh-tw.md

程式語言概論與必備工具

這堂課程解釋程式語言的基礎。這項主題能應用到當代多數的程式語言。關於必備工具的部分,你會學到許多實用的開發者軟體。

關於程式語言

Tomomi Imura 繪製。

課前測驗

課前測驗

大綱

在這堂課中,包含:

  • 什麼是程式設計?
  • 程式語言的種類
  • 程式的基本架構
  • 給專業開發者的實用軟體與工具

什麼是程式設計?

程式設計又稱作Coding是編寫電腦或手機裝置的指令過程。我們以裝置看得懂的程式語言來編寫這些指令這些指令集涉及到常見的程式電腦程式應用程式(App)執行檔

一個程式以程式碼任意創作出來,網頁、遊戲、手機應用都是程式的一種。雖然我們可以在不編寫程式碼的情況下建出程式,但裝置底下的邏輯概念還是以程式碼為主。一個執行中執行編碼的程式都是仰賴著指令。你眼前正閱讀的文字就是由程式輸出到螢幕。

課外研究: 誰被認為是世界上第一位電腦工程師?

撰寫程式語言

編寫程式語言的主要目的是讓開發者得以指示裝置。裝置只能讀懂二元格式 ( 1 與 0 ),對於大多數的開發者而言,這並不是個很好理解溝通的方式。程式語言就像人類與電腦之間溝通的橋梁。

程式語言有不同的格式與滿足的目的。舉例來說JavaScript 常被用在網頁應用上,而 Bash 主要是用在作業系統上。

低階語言(Low level languages) 通常比 高階語言(high level languages) 要求更少的裝置指示步數。然而高階語言的閱讀性與支援性讓它成為最普及的程式語言。JavaScript 即是一種高階語言。

下列程式碼說明高階語言(JavaScript)與低階語言(ARM assembly code)的差異:

let number = 10
let n1 = 0, n2 = 1, nextTerm;

for (let i = 1; i <= number; i++) {
    console.log(n1);
    nextTerm = n1 + n2;
    n1 = n2;
    n2 = nextTerm;
}
 area ascen,code,readonly
 entry
 code32
 adr r0,thumb+1
 bx r0
 code16
thumb
 mov r0,#00
 sub r0,r0,#01
 mov r1,#01
 mov r4,#10
 ldr r2,=0x40000000
back add r0,r1
 str r0,[r2]
 add r2,#04
 mov r3,r0
 mov r0,r1
 mov r1,r3
 sub r4,#01
 cmp r4,#00
 bne back
 end

事實上,他們都做一樣的事情 ── 印出前十項費氏數列。

費氏數列的定義為該數是由之前的兩數相加而得出。初始值為 0 與 1。

程式的基本架構

程式中的一行指令(instruction)被稱做陳述式(statement),通常會由特定符號或分行來決定結尾處,或是執行程式終止。程式終止的方式會依不同程式語言而有所不同。

大多數程式需要使用用戶或其他位置的資料,陳述式依照這些資料決定指令。資料會影響程式的運作方式,編寫程式語言便是一種暫時性儲存資料的途徑。這些資料稱為變數(Variables)。變數會指引資料儲存到裝置上的位置,它們就像代數一樣:有自己的名稱、數值隨時間改變。

有些情況裝置不會執行到陳述式。通常是開發者故意的選擇或意外性地輸入錯誤,讓應用程式變得更豐富且需要被維護。常見的發生情況在決定條件的時候,如當代程式語言以 if..else 條件式來決定程式的執行方式。

往後的課程會講解各式各樣的陳述式型態。

工欲善其事,必先利其器

謀生工具 Tools of the Trade

在這個章節,你會學習到一些實用的軟體來開始你的開發旅程。

一個開發環境包含許多開發者撰寫程式需要用到的工具。它們會依照開發者的需求而不同,隨著時間、專案大小、程式語言而有所調整。每個開發者都有自己獨特的開發環境。

文字編輯器

文字編輯器可說是最重要的軟體開發工具。開發者可以在其中撰寫並執行程式。

還有許多原因讓開發者選擇文字編輯器:

  • 偵錯(Debugging) 在程式碼中一行一行地找尋錯誤。有些文字編輯器有偵錯的功能,可以依照不同的程式語言而調整。
  • 語法突顯(Syntax highlighting) 將程式碼加上顏色並自動排版,方便開發者閱讀。文字編輯器也支援語法突顯的客製化。
  • 整合擴充插件(Extensions and Integrations) 擴充插件不包含在預設的文字編輯器當中,開發者依照自己的需求建立並新增到文字編輯器當中。舉例來說,許多開發者需要統整程式文檔並註解這些檔案,他們就會加裝檢查拼字的插件。有些插件功能只支援特定的文字編輯器,文字編輯器也提供搜尋擴充插件的功能。
  • 客製化(Customization) 大多數的文字編輯器都允許開發者做客製化,開發者依照自己的習慣,建立自己順手的開發環境。其中也包含建立自己的擴充插件。

常見文字編輯器與網頁開發插件

瀏覽器

另一款重要的工具是瀏覽器。網頁開發人員會藉由瀏覽器觀察程式的執行情況,瀏覽器也是常見的網頁編輯與檢視器,顯示來自檔案的可見物件,如 HTML 檔。

許多瀏覽器都附加開發者工具(DevTools),內含實用的功能協助開發者蒐集與取得重要的程式資訊。假設有一頁網頁出現錯誤,了解它出錯的時間與狀況就很重要,配置開發者工具即可蒐集這些資訊。

常見瀏覽器與網頁開發工具

常用指令

有些開發者偏好較少的介面,通常會使用指令來完成工作;撰寫程式碼要求大量的文字輸入,有些開發者偏好以不中斷文字輸入為首要條件,常用快捷鍵做視窗與檔案的切換。多數工作能以滑鼠操作,但為了減少鍵盤與滑鼠間的切換,指令輸入會是實踐上較合適的方式。另一項指令輸入的好處是它們彈性很高,隨時可以更新設定,甚至移植到其他機器上。每一位開發者有各自的開發習慣,開發環境也有所不同。

常用指令選項

指令選項(Command Line Options)會依不同的作業系統而有所不同。

💻 表示預設已安裝在作業系統上。

Windows

MacOS

Linux

其他常用指令

  • Git (💻 已支援大多數的作業系統。)
  • NPM
  • Yarn

技術文件

若開發人員想學新的事物,技術文件會是很好的幫手。他們會參照文件來學習如何使用工具與新的程式語言,並瞭解如何鑽研更深入的用法。

常用的網頁開發文件

研究項目: 現在你已經了解基本的網頁開發環境了。請比較「網頁開發環境」與「網頁設計環境」之間的差異。


🚀 挑戰

比較不同的程式語言: JavaScript 與 Java 間有什麼獨特的特徵? 那 COBOL 與 Go 呢?

課後測驗

課後測驗

複習與自學

學習不同的程式語言。試著在三種不同的程式語言寫幾行程式碼。你學到了什麼?

作業

閱讀技術文件