JavaScript Day 8. 浅谈 Function-操作实例

上一篇大略的说明了 function 的两个大类别，这里试着放比较多的简易操作实例。

注册多组函式

一个函式可以注册多组函式，并且在执行的时候也可以看见他的执行顺序。

// 执行1
function morningAction () {
    console.log("起床");
    console.log("摺棉被");
    console.log("刷牙");
}
//执行2
function nightAction () {
    console.log("吃面包");
    console.log("吃薯条");
    console.log("喝牛奶");
}

morningAction (); // 起床、摺棉被、刷牙
nightAction (); // 吃面包、吃薯条、喝牛奶

虽然说照着上面这样子写的确也可以正常执行，但会造成程序码变的很长，也很容易会有重复，如果很单纯的这样子写，整篇程序码其实会看起来非常的杂乱。

在函式里面的函式

其实函式里面仍然可以执行另一个函式，以这个概念去写的话，可以减少不断需要重复写或是太冗长的情况。

function morningAction () {
    console.log("起床");
    console.log("摺棉被");
    seeMe();
    console.log("刷牙");
}
function nightAction () {
    console.log("吃面包");
    console.log("吃薯条");
    seeMe();
    console.log("喝牛奶");
}
	function seeMe () {
    console.log("欧害幽");
}

morningAction (); // 起床、摺棉被、欧害幽、刷牙
seeMe(); // 欧害幽
nightAction (); // 吃面包、吃薯条、欧害幽、喝牛奶

函式上的参数

理解到上面的简易操作概念之後，接着要讨论的是函式如何代入参数。在自定义名称旁边的括号就是代入参数的地方，要注意的部分是参数只存活在大括号里。

// num 这个参数只能存活在大括号里，随着大括号结束，也就跟着消失了
function any(num) {
    console.log(num);
}

// 在这个部分 1 会代入到 num 因此结果会出现 1
any (1); // num 是 1
any (2); // num 是 2

// 除此之外参数也可以代入两个
function any(num, num2) {
    console.log(num);
		console.log(num2);
}

any (1,2); // num 是 1、2
any (3,4); // num 是 3、4

只存活在函式里的参数

上面提到参数只存活在大括号里，这个部分也可以透过操作来证实，可以看见最後的结果是没有东西。

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

any (1,2); // num 是 1、2
console.log(num) // error

透过参数相加

透过函式里面的参数，还可以有很多有趣的变化，譬如做一个小型的相加程序。

function add(num1,num2) {
    console.log(`您的加总为${num1+num2}`);
}

add(1,1); // 2

使用 return 回传

return 也是在使用函式的时候很常碰到的功能，return 语意上为：「终止一个函式执行，并且从该函式返回一个值。」，光是这麽说实在很抽象，因此可以直接看范例。

function add(num1,num2) {
		// 在这个地方会把值回传到 addNumber
    return  num1 + num2;
}

let addNumber = add(123456789,987654321);
console.log(addNumber);

简单说，当我们需要把资料回传到外层时，就是一个使用 return 的时机。另外，return 也可以有很多个，当我们熟悉它的时候，真的会觉得是一个很好用的方法。