iT邦幫忙

第 12 屆 iThome 鐵人賽

DAY 8
0
自我挑戰組

草頭黃小姐的 30 天 JavaScript 自學小本本系列 第 8

Day08 JavaScript :基礎班的函數

我是草頭黃小姐,很感謝我寫了七天的超基礎到不能基礎的幼幼班文章之後,大家都還在:)
今天我就來跟大家聊聊 JavaScript 的函數,英文稱之為 function。

在進到 JavaScript 之前,我們第一次接觸函數的時候,是在高中數學,大家還記得一個算式嗎:

f(x)=3x+3

如果 x = 2,所以代入之後進入算式,值會等於 3*2+3 = 9。

那 JavaScript 的 function 又要怎麼定義呢?跟著我到 JS bin 做看看吧!
我們在定義 function 的時候,我們就是用 function 這個關鍵字。

function sayHelloTo(){
  console.log('Hey');
}

我們用 function 開頭,希望代入一個值後,會印出 Hey 這個字,但是在 JS bin 按出 Run 之後,會跑不出任何結果,因為目前僅是定義而已,都還沒執行的動作,所以要接著寫下去,去呼叫 function 讓它啟動:

function sayHelloTo(){
  console.log('Hey');
}

sayHelloTo('孫悟空');

當我們輸入孫悟空後,就會執行一開始的定義,會跑出:Hey

那如果我們想把孫悟空這個名字帶進去值內,我們可以改成以下寫法:

function sayHelloTo(someone){
  console.log('Hey' + someone);
}

sayHelloTo('孫悟空');

我們在第一行將 sayHelloTo() ,括號裡面要帶入的參數為 someone
第二行則是要印出 Hey 加上你帶入的任何人名。
所以在 JSBin 運作的時候,就會跑出 Hey孫悟空 。他會根據你帶入的東西,跑出不一樣的結果。

回傳值

這裡指得是定義一個 function 之後,輸入一個值,會回傳什麼東西回來!
舉個例子來說:

function isAdult(age){
  if ( age>=18){
    return true;
  }else{
    return false;
  }
}

這裡指得是我定義一個參數是 age,如果我的值大於或等於 18 請回傳 true 回來否則回傳 false。

那接著我們使用剛剛定義的這個 function 來做一件事情:

var yourAge=20;
if (isAdult(yourAge)){
  console.log('可以看這部電影');
}else{
  console.log('抱歉,你不能看!')
}  

那我們來看執行結果:

是不是蠻有趣的:)


上一篇
Day 07 JavaScript 的流程控制
下一篇
Day 09 JavaScript:陣列
系列文
草頭黃小姐的 30 天 JavaScript 自學小本本30

尚未有邦友留言

立即登入留言