[day-8] function函式

function 函式

設定指令驅動程式

把前面學的東西去進行總整理

//機器人-早起起床-起床刷牙洗臉出門

function morningAction(){  //先設定好一個函式
    console.log('起床');
    console.log('刷牙');
    console.log('洗臉');
    console.log('出門');
}

morningAction(); //會執行函式內的所有指令
morningAction();

函式不限制組數 可以設定很多個不同的函式來使用

//機器人-晚上活動

function nightAction(){
    console.log('回家');
    console.log('刷牙');
    console.log('洗臉');
    console.log('睡覺');
}

morningAction(); //執行上面的早上活動
nightAction();  //執行晚上活動

函式裡面仍可以執行函式

可以看到前兩個範例裡面動作都有用到刷牙洗臉這兩個指令
那這時候就可以把這兩個指令再變成一個函式

function nightAction(){
    console.log('回家');
    cleanHead(); //會執行下面的cleanHead函式 
    console.log('睡覺');
}

function cleanHead(){
    console.log('刷牙');
    console.log('洗臉');
}

nightAction();

函式參數介紹

前面函式都可以看到有一個括號裡面是空白的
其實就是用來放參數用的

function a(num){
    console.log(num);
}

a(1); //會帶入num 執行上面變成console.log(1);

a(3); //會帶入num 執行上面變成console.log(3);

那參數也可以帶多個參數

function a(num,num2){
    console.log(num);
    console.log(num2);
}

a(1,2); //會帶入num,num2 執行上面變成console.log(1); console.log(2);

a(3,4); //會帶入num,num2 執行上面變成console.log(3); console.log(4);

參數寫法-參數只存活在大括號

那這邊要特別提到 參數只存在大括號裡運用

function a(num,num2){
    console.log(num);
    console.log(num2);
}

a(1,2);
console.log(num) //這邊是會出現錯誤的
//因為你並沒有宣告num這個變數

宣告變數和參數是有差別的
參數除了函式裡的運用外
不能直接使用參數 (要等到後面return的部分)

參數寫法-兩個數字相加工具

這邊提供一個簡單的範例實作來給大家參考

//透過函式
//函式 兩個數字相加工具

function add(num1,num2){
    console.log(`您加總的數字為${num1+num2}`)
}

add(2,3);

add(1231213213,123123213);

輸入跟輸出的重要性

了解輸入跟輸出才可以比較好理解什麼時候該用參數

函式就是透過 input 輸入 ＞ 處理 ＞ output 輸出

function add(num1,num2){
    console.log(`您加總的數字為${num1+num2}`) // output 輸出！
}

add(2,3); // input 輸入！

return 寫法

透過return把運算後的結果傳回參數
就可以透過變數來將參數存下來使用

//國文分數+數學分數的加總計算機

function calcTotalScore(chinedeScore,mathScore){
    console.log(chineseScore+mathScore);

    return chineseScore + mathScore; //回傳的意思 把結果帶到參數上
}

let markTotalScore = calcTotalScore(40, 60);//就可以存下mark的加總分
let tomTotalScore = calcTotalScore(100, 60);//也可以存下tom的加總分

console.log(`Tom的總分為%{tomTotalScore}`);

return 宣告 let

如果要將上方的程式簡化
可以在函式裡宣告變數來接值
再回傳該變數 （但請注意大括號內的變數在函式執行結束後不會保留）
不能在外面再叫出該資料 整個函式只會保留回傳結果

function calcTotalScore(chinedeScore,mathScore){
    //console.log(chineseScore+mathScore);
    let totalScore = chineseScore+mathScore;
    return totalScore; //回傳的意思 把結果帶到參數上
}

console.log(totalScore); //這邊會出現錯誤 請特別記得函式裡的變數或參數
執行完就都會消失了 只會留下回傳的資料

return 可以有多個

這邊示範一個return後繼續寫指令和return
結果會是在第一個return就中斷函式

//return可以中斷函式執行，後面得程式就不會繼續跑了
function calcTotalScore(chinedeScore,mathScore){
    //console.log(chineseScore+mathScore);
    let totalScore = chineseScore+mathScore;
    return totalScore; //程式執行到這裡就會結束

    console.log('hello');//不會執行
    return 3;//不會執行
}

因此要怎麼有多個retrun呢
就要應用到if else 將不同的retrun結果分支

//檢查學生成績是否及格的函式

function checkScore(score){
    if(score >= 60){
        return ' 及格 '; //執行到該段及中斷函式
    }else{
        return ' 不及格 '; //執行到該段及中斷函式
    }
    console.log('尾巴') //這行是不會執行的 因為上面return就會中斷函式了
}

let tomScore = checkScore(60);
console.log(`Tom的成績${tomScore}`);

let markScore = checkScore(30);
console.log(markScore);

這邊再提供一個範例
計算是否為偶數的函式

function checkNumber(myInput){ //input帶入的值適合當參數
    if (myInput % 2 == 0){
        //console.log('是偶數');
        return'是偶數';
    }else{
        //console.log('是奇數');
        return'是奇數';
    }
}

let checkSevenNumer = checkNumber(7);
console.log(checkSevenNumbe);

let checTwoNumer = checkNumber(2);
console.log(checkTwoNumbe);

//checkNumber(7);

let 全域與區域變數邏輯

這邊就提供一個計數器的範例
在外面宣告的變數
在裡面進行運算
結束函式後還是會影響結果

let count = 0 //先宣告計數器=0

function test() {
  count += 1 //每次執行讓他+1
  console.log('執行一次') //變顯示一次執行
}

test()
test()

console.log(`目前您紀錄了${count}次`)

寫程式一定不會是直接把function直接生出來
可以先畫出流程判斷
再去思考input ouput的作法邏輯可不可以符合

寫程式沒有最佳解法，只有當下最適合

小步測試，反覆驗證！