iT邦幫忙

第 12 屆 iT 邦幫忙鐵人賽

DAY 6
0
Modern Web

JavaScript 從零開始系列 第 6

JavaScript 從零開始 - Day6- 在函式 function 加入參數

JavaScript Note

學習了變數 variable 跟函式 function 的基本認識,單元分開都很可以,最怕就是綜合應用,深怕我自己根基不夠穩,所以我拆了很細來學習,一次學一點,雖然慢,但觀念清楚比較重要。


函式帶入參數

函式基本寫法:

function number() {
  console.log("Tim"); //字串要加引號
  console.log(323); //數字不用加引號
}
number(); //執行函式

在小括弧中可以帶入參數名稱,一樣是自定義

練習帶入一個參數會這樣寫:

function math(number) {
  var total = number; //宣告變數的值等於參數
  console.log(total); //驗證結果是變數的名稱,但這邊不是輸入字串,故不用加上引號
}
math(10); //執行函式,並帶入參數

函式 + 參數 + 運算

參數可以帶入兩個、三個甚至無限多,並可以利用變數做加減乘除的方式來做更多元的變化。(變數的加減乘除是:+-*/ )

EX. 加法

function math(numOne, numTwo) {
  var total = numOne + numTwo; //結果為兩個變數相加
  console.log(total); //驗證變數
}
math(10, 25); //執行函式,並帶入參數

在 Chrome 的開發人員工具會顯示如下:

函式帶參數

其他也可以在 codepen 調整不同的加減乘除方式玩玩看。


上一篇
JavaScript 從零開始 - Day5- 認識函式 function 與使用
下一篇
JavaScript 從零開始 - Day7- function 的語法作用域 Lexical Scope
系列文
JavaScript 從零開始40

1 則留言

0
hannahpun
iT邦新手 5 級 ‧ 2020-09-07 00:19:20

補充之然後參數還可以預設值,有預設值好處是可以避免沒預期的錯誤

function math(number = 0) {}

例如

function math(number) {
  
  return number*2;
}
console.log(math(2)) // 4
console.log(math()) // NaN
function math(number = 0) {
  
  return number*2;
}
console.log(math(2)) // 4
console.log(math()) // 0
Tim Hsu iT邦新手 5 級 ‧ 2020-09-07 09:38:14 檢舉

大感謝~再補進文章中~

TerryYu iT邦新手 5 級 ‧ 2020-09-07 10:55:42 檢舉

獲益良多

我要留言

立即登入留言