來到 JavaScript 全端開發學習筆記 的第四篇文章，這一篇算是一個階段性的總結，主要是摘錄我在 ALPHA CAMP 參與學期一_程式設計入門 課程的相關筆記與分享。會有基本的語法介紹、概念解析和個人心得的分享。
因此，這篇文章會以下面三點架構進行撰寫：
- 什麼是 Javascript？JS 基礎概念介紹
- Javascript 基礎語法筆記分享
- 跨領域學習甘苦談：個人心得
什麼是 Javascript？
JavaScript 是一種腳本，也能稱它為程式語言，可以讓你在網頁中實現出複雜的功能。當網頁不只呈現靜態的內容，另外提供了像是：內容即時更新、地圖交動、繪製 2D/3D 圖形，影片播放控制……等，你就可以大膽地認為 JavaScript 已經參與其中。
結合我在前兩篇介紹過的 HTML 和 CSS，這三者合起來就成為了網頁開發的三劍客。簡單來說會是下面的這個樣子：
- HTML 是一種標記語言，我們使用它來建立網頁的內容架構與整理內容， 例如：定義段落、標題、資料表格，或是在頁面嵌入圖片和影片。【延伸閱讀】
- CSS 是一種樣式規則的語言，用來幫我們的 HTML 內容上套用樣式，例如：設置背景顏色、字型，或讓內容以多欄的方式呈現。【延伸閱讀】
- JavaScript 是一種腳本語言，它使你能夠動態的更新內容、控制多媒體、動畫……幾乎所有事。
【延伸閱讀】JavaScript 是什麼? – 學習該如何開發Web | MDN
這裡也幫大家整理一下我近期撰寫的程式語言學習相關文章，如果有興趣的人可以一次看完喔~
為什麼要學 Javascript？
其實關於這一點，以我現在的程度來說並不能很好的證明 JS 和其他語言相比，到底好在哪裡（畢竟我接觸的也不多），但我根據我自身感受，以及在網路上搜尋到的一些資料，來跟大家說明 JS 的三大優勢：
- 容易上手：無論你是新手還是曾經學過程式語言的人，在學習 JS 的時候我認為會比較容易，因為在變數的設計上 JS 並沒有太過嚴格的規則，重要的函式和一些條件式我個人覺得並不會太過困難，以我這個只學過一些 python 的人來說這話應該會比較有說服力一點吧~
- 容易找工作：很多人在學程式語言的時候，如果不是本科系，那麼多少都會抱著想轉職或接觸相關行業的心態，「成為工程師」這句話在台灣特別有吸引力。而學習 JS，你會有前端、後端甚至是全端工程師的選擇，在這個網路蓬勃發展的時代，我認為擁有網頁開發、資料庫處理等能力會相當吃香，這點從 104 的徵人訊息就可得知一二。
- 豐富的學習資源：其實這點在現今所有的程式語言中都頗常見，但 JS 算是 Python 以外，擁有最多學習資源的一個語法，先不論我參與的 ALPHA CAMP，網路上也有很多網頁種子培訓、前端工程師能力培養和相關的計畫，都是以 Javascript 做為主力，去讓大家充分的認識這個語言。所以只要你願意，網路上都有滿滿的資源等著你去挖掘！
【延伸閱讀】用 JavaScript 做全端適合嗎？4 大優勢告訴你為什麼要這麼做！
筆記分享：JS 基礎語法
練習工具推薦：Repl.it
在開始向大家分享一些語法之前，這裡要和大家推薦一個在練習 JS 上相當好用的一個免費工具：Repl.it。這套工具也是我在 AC 學習的時候會搭配使用的，可以在不下載其他開發環境的情況下，去練習 JS 並跑出結果。最後也能在網路上分享你的程式碼！我個人覺得這和 GitHub 還蠻像的，但使用上相當方便。
而由於使用這個工具的方法相當簡單（只要註冊、選取正確的環境 Node.js，再開始寫 JS 即可），我找了一篇寫得還蠻詳細的教學，大家可以依照文章中的步驟去註冊帳號，註冊完之後再進入到下方的語法練習！
【推薦閱讀】Repl.it 教學 – HackMD
如何印出結果？JS 不可不知的 console.log
都說 python 有最基礎的 print(’Hello World’)，JS 當然也有和 python 的 print 一樣，能輸出結果的語法，那就是在這之後會很常用到的 console.log。
大家可以先試著在你的 Repl.it 上寫下下方這段程式碼，點擊 Run 按鈕看看會跑出什麼：
console.log('Hello Javascript！')如果你的電腦沒有出問題，那麼你會在旁邊的輸出結果看到 Hello Javascript！的結果，這就是 console.log 的作用，跑出（）內的內容。目前你只需要知道這些就可以了，其他的延伸觀念有興趣可以自行去找更多資源～
定義變數
接著進入到每個程式語言都非常重要的變數。我們知道，我們是透過程式語言，來讓電腦操作資料。而在任何一個程式語言中，操作資料前，你會需要先找到一個地方放置這些資料：變數就是這樣的存在。當我們將資料寫上記憶體時，先用一個可以識別的名字標識它，變數有點類似資料的容器：
在 JavaScript 裡面，若我們想定義變數，可以使用兩個指令：let和const，這兩者的差別是，若我們使用 let，則可在之後的程式碼中更改變數的值，但 const 定義的變數無法被改變。
撰寫方式我們以下列這行程式碼為例：
let myName = 'Wizard'它的意思是，使用 let 的方式，宣告一個名為 myName 的變數，並對應到一筆 ‘Wizard’ 的資料，是不是相當好懂呢？
在這行程式碼中，你可能注意到了一些有趣、很容易看懂的資訊，比如 let 這個詞、myName 這個詞，以及 = 這個符號，讀起來似乎很接近一個簡化版、數學化的日常語句。我個人覺得還蠻好理解的~
JS 的運算式子一覽
在進入到 JS 的條件式與程式邏輯之前，我們要先知道，想要用 JS 來進行運算，該使用那些指令，知道這些指令之後，我們才能進一步利用 JS 來幫助我們實現更多事情。
- 加減乘除：算術運算子（就是最基本的運算功能）
- 比較特別的運算式
- %：取餘數（
7 % 2的印出結果為1，因為不可整除，餘數為 1） - ++：將值加一
- —：將值減一
- **：計算 a 的 b 次方（
2 ** 3這段指令意思是 2 的 3 次方）
- %：取餘數（
- 賦值運算子
- +=｜
x += y等同x = x + y的意思 - -=｜
x -= y等同x = x - y的意思 - *=｜
x *= y等同x = x * y的意思 - /=｜
x /= y等同x = x / y的意思 - %=｜
x %= y等同x = x % y的意思
- +=｜
- 比較運算子
- == 寬鬆的等於
- === 嚴格的等於
- ! = 寬鬆的不等於
- ! == 嚴格的不等於
- 大於
- <小於
等號的陷阱！
這裡我當初在學習的時候，教案明確的提醒大家：在 JavaScript 裡，當你想比對兩個 value 是否相等時，請使用嚴格等於 ===，而不是寬鬆等於 ==。
因為 JavaScript 是一個弱型別的語言，意思是說在 JavaScript 裡，型別特別容易自動轉換。使用== 不會特別判斷兩邊的資料型別是否不同，因此會發生許多難以掌握的狀況。而使用 === 則會進一步比較資料型別是否相等，因此在撰寫 JavaScript 時一定要記得使用 ===。
if/else 條件式
這個觀念不管有沒有學過程式語言的人應該都知道，我們會用程式來進行條件設定，以達成讓電腦來幫助我們解決問題和判斷的過程。其中 if/else 條件式正是最經典的一個。
整體來說，if/else 條件式的寫法就是用中文的邏輯去撰寫，我們來看下方的示範：
if ( 錢包裡的錢 >= 55 元) {
// 立即買杯奶茶！
} else if ( 錢包裡的錢 >= 35 元 ) {
// 改買一杯樸實的紅茶吧！
} else {
// 無奈地離開
}當然，這樣是不會跑出結果的，因為電腦讀不出中文，所以我們要用電腦看得懂的方式來寫我們的條件式：
let milkTeaPrice = 55
let blackTeaPrice = 35
let budget = 50
if ( budget >= milkTeaPrice ) {
budget = budget - milkTeaPrice
console.log('立即買杯奶茶！')
} else if ( budget >= blackTeaPrice ) {
budget = budget - blackTeaPrice
console.log('改買一杯樸實的紅茶吧！')
} else {
console.log('無奈地離開')
}
console.log(`錢包剩下 ${budget} 元`)請大家細細品味一下這其中的邏輯所在，我這邊就不多加贅述，如果大家真的有疑問，也可以寄信詢問我或是在網路上直接打關鍵字，會出現許多說明文件，相信一定能找到解方的！（學程式的人 Google 能力一定要很強）
個人心得
在這堂學期一的課程裡，其實 JS 並不是課程的重心，雖說有讓我們了解到這個語法的邏輯和基礎語法，但最主要還是讓我們對前端網頁開發有個基礎的認識。這一點在我現在開始上學期二的課程時愈發明顯，同樣都是 Javascript 的課程，難度根本不在一個檔次上…讓我現在是痛苦與快樂並存著˙。
不過，我認為 JS 算是一個難度適中、而且能應用在許多地方的一個語言，如果你今天是以想要成為轉職成工程師的目標來學習的話，JS 真的是個好選擇。從職缺上都可以看到，前端和後端工程師其實一直都有很多空缺，只要熟悉 JS，再搭配一些其他程式語言的基礎認識，我認為找工作並不會太難，那怕進不了大公司，在傳產或中小企業擔任 IT 人員也是個不錯的選擇。
總而言之，總算是把我之前在 AC 上課的筆記和心得補完了，等我結束學期二的課程再來和大家分享，真的是蠻推薦對程式語言或轉職有興趣的朋友可以去 AC 試試看，相當優質。
