學習軌道
/
JavaScript
JavaScript
/
練習
/
盧西恩的美味千層麵
盧西恩的美味千層麵

盧西恩的美味千層麵

學習練習

簡介

JavaScript 是一種動態語言,支援物件導向、指令式,以及宣告式(例如函式程式設計)等各種風格。

變數

在 JavaScript 中,有幾種主要的方式可以把值指定給名稱:使用變數或常數。 在 Exercism,變數一律以 camelCase 撰寫;常數則以 SCREAMING_SNAKE_CASE 撰寫。 這件事沒有官方指南可循,各家公司和組織也有各自的風格指南。 你可以自由選擇要用什麼方式撰寫變數。 按照練習題準備的方式來寫變數,好處是它們在網頁介面和大多數 IDE 中會以不同的方式標示。

JavaScript 中的變數可以用 const、let 或 var 關鍵字來定義。

使用 let 或 var 時,一個變數在其生命週期內可以參照不同的值。 例如,myFirstVariable 可以用賦值運算子 = 定義並重新定義許多次:

let myFirstVariable = 1;
myFirstVariable = 'Some string';
myFirstVariable = new SomeComplexClass();

與 let 和 var 相反,用 const 定義的變數只能被指定一次。 在 JavaScript 中,這用來定義常數。

const MY_FIRST_CONSTANT = 10;

// Can not be re-assigned.
MY_FIRST_CONSTANT = 20;
// => TypeError: Assignment to constant variable.
Note

💡 在之後的概念練習中,會探討並說明_常數_的指定、_常數_的綁定,以及_常數_的值之間的差異。

函式宣告

在 JavaScript 中,功能單位會封裝在_函式_裡;如果幾個函式屬於同一組,通常會把它們放在同一個檔案中。 這些函式有參數(因此可以接受引數),並且可以用 return 關鍵字_回傳_一個值。 函式透過 () 語法來呼叫。

function add(num1, num2) {
  return num1 + num2;
}

add(1, 3);
// => 4

在這個例子中,函式名稱是 add。 它有兩個參數:num1 和 num2。 它會回傳一個值:運算式 num1 + num2 的結果

接著,函式 add 會用兩個引數_呼叫_:1 和 3。 函式的結果,也就是回傳值,是 4。

Note

💡 在 JavaScript 中,宣告函式有_許多_不同的方式。 其中有些方式看起來和用 function 關鍵字不一樣。 這個學習軌道會試著逐步介紹它們,但如果你已經認識它們,也歡迎使用任何一種。 大多數情況下,用哪一種都不會更好或更差。

對其他檔案公開

要讓一個 function、常數或變數能在_其他檔案_中使用,必須用 export 關鍵字將它們匯出。 接著,另一個檔案可以用 import 關鍵字匯入它們。 這也稱為模組系統。

所有測試的運作方式就是一個很好的例子。 每個練習至少有一個檔案,例如 lasagna.js,其中包含_實作_。 實作_會從該檔案被 export 出去,讓它可以在另一個檔案中被匯入。 此外,至少還有一個其他檔案,例如 lasagna.spec.js,其中包含_測試。 這個檔案會 import 公開的(也就是被 export 的)實體,以便測試實作:

// file.js
export const MY_VALUE = 10;

export function add(num1, num2) {
  return num1 + num2;
}

// file.spec.js
import { MY_VALUE, add } from './file';

add(MY_VALUE, 5);
// => 15

說明

Lucian 的女朋友正在回家的路上,而他還沒煮好他們的週年晚餐!

在這個練習中,你會寫一些程式碼,幫 Lucian 按照他最愛的食譜做出精緻的千層麵。

這個練習有四個任務,都跟烹調千層麵所花費的時間有關。

1. 定義預期的烤箱時間(分鐘)

定義 EXPECTED_MINUTES_IN_OVEN常數,代表千層麵應該在烤箱裡烤幾分鐘。這個常數必須匯出。根據食譜,預期的烤箱時間是 40分鐘。

2. 計算剩餘的烤箱時間(分鐘)

實作 remainingMinutesInOven函式,它會接收千層麵實際在烤箱裡的分鐘數作為_參數_,並根據上一個任務的預期烤箱時間(分鐘),_回傳_千層麵還需要留在烤箱裡幾分鐘。

remainingMinutesInOven(30);
// => 10

3. 計算準備時間(分鐘)

實作 preparationTimeInMinutes函式,它會接收你加到千層麵裡的層數作為_參數_,並_回傳_你準備千層麵花了幾分鐘,假設每一層要花你 2 分鐘準備。

preparationTimeInMinutes(2);
// => 4

4. 計算總工作時間(分鐘)

實作 totalTimeInMinutes函式,它會接收_兩個參數_:numberOfLayers參數是你加到千層麵裡的層數,而 actualMinutesInOven參數則是千層麵已經在烤箱裡的分鐘數。這個函式應該_回傳_你烹調千層麵總共花了幾分鐘,也就是準備時間(分鐘)加上千層麵當下已經待在烤箱裡的分鐘數。

totalTimeInMinutes(3, 20);
// => 26
透過 GitHub 編輯 連結會在新視窗或分頁中開啟
JavaScript Exercism

準備好開始 盧西恩的美味千層麵 了嗎?

註冊 Exercism,透過 37 個概念159 個練習 和真人引導來學習並精通 JavaScript,全部免費。