这是我参与 8 月更文挑战的第 15 天，活动详情查看： 8月更文挑战

感激相遇你好我是阿ken

作者：请叫我阿ken
链接：juejin.cn/user/109118…
来源：掘金
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

🌊🌈关于前言：

文章部分内容及图片出自网络，如有问题请与我本人联系(主页介绍中有公众号)

本博客暂适用于刚刚接触JS以及好久不看想要复习的小伙伴

🌊🌈关于内容：

————— JavaScript 函数 —————

📚4.1_初识函数

📙4.1.1_函数的使用

function 函数名() {
//函数体代码
}

function 是声明函数的关键字，必须全部使用小写字母。

当函数声明后，里面的代码不会执行，只有调用函数的时候才会执行。
调用函数的语法为“函数名( )”。

案例：

//声明函数
function sayHello() {
console.log ('Hello');
}

//调用函数
sayHello();

在这里插入图片描述

📗4.1.2_函数的参数

函数的参数分为形参和实参。

在声明函数时，可以在函数名称后面的小括号中添加一些参数，这些参数被称为形参。

当函数调用的时候，同样也需要传递相应的参数，这些参数称为实参。

函数的形参是形式上的参数，因为当函数声明的时候，这个函数还没有被调用，这些参数具体会传过来什么样的值是不确定的。而实参是实际上的参数，在函数被调用的时候。它的值就被确定下来了。

案例：

function 函数名 (形参1, 形参2, ...) {
// 函数体代码
}

函数名 (实参1, 实参2, ...);

JavaScript 函数参数的使用非常灵活，它允许函数的形参和实参个数不同。当实参数量多于形参数量时，函数可以正常执行，多余的实参由于没有形参接收，会被忽略，除非用其他方式（例如后面学到的 arguments ）才能获得多余的实参。当实参数量小于形参数量时，多出来的形参类似一个已声明未赋值的变量，其值为 undefined。

function getSum (num1, num2) {
console.log (num1, num2);
}
getSum (1, 2, 3); // 实参数量大于形参数量，输出结果为 1,2
getSum (1); // 实参数量小于形参数量，输出结果为 1,undefined

在这里插入图片描述

📘4.1.3_函数的返回值

例如，一个人去餐厅吃饭，我们将餐厅的厨师看成一个函数，顾客通过函数的参数来告诉厨师要做什么菜。当厨师将饭菜做好以后，这个饭菜最终应该是传给顾客。但我们在前面编写的函数都是直接将结果输出，这就像厨师自己把饭菜吃了，没有将函数的执行结果返回给调用者。

格式：

function 函数名() {
return 要返回的值;  //利用 return 返回一个值给调用者
}

案例：

function getResult() {
return 666;
}

// 通过变量接收返回值
var result = getResult();
console.log (result);   // 输出结果：666
// 直接将函数的返回值输出
console.log ( getResult() );// 输出结果：666

console.log (getResult);// 输出结果：输出函数(见下图)

在这里插入图片描述

反例：

function getResult() {
console.log (1);
// 该函数没有return
}

getResult(); // 输出结果: 1
console.log ( getResult() ); // 输出结果: 1 undefined

在这里插入图片描述

📚4.2_函数返回值案例

📙4.2.1_利用函数求任意两个数的最大值

function getMax (num1, num2) {

if (num1 > num2) {
return num1;
} else {
return num2;
}

}
console.log ( getMax(1, 3) );   // 输出结果: 3

在这里插入图片描述

或者

function getMax (num1, num2) {
return num1 > num2 ? num1 : num2;
}
console.log ( getMax(1, 3) );  // 输出结果:3

在这里插入图片描述

📗4.2.2_利用函数求任意一个数组中的最大值

回顾一下如何创建数组：

【熬夜猛肝万字博文】学妹问我怎么入门 Javascript，百般盘问下我终于决定贡献出自己的 JavaScript入门笔记(三)

function getArrMax(arr) {
var max = arr[0];

for(var i = 1; i <= arr.length; i++) {
if(arr[i] > max) {
max = arr[i];
}
}

return max;
}

var arr = getArrMax([5, 2, 99, 101, 67, 77]);
console.log(arr);  // 输出结果: 101

在这里插入图片描述

或者

function getArrMax(arr){
var max = arr[0];

for(var i = 1; i <= arr.length-1; i++) {
if(arr[i] > max){
max = arr[i];
}
}

return max;
}
console.log( getArrMax( [5, 2, 99, 101, 67, 77]) );  
// 输出结果:101

在这里插入图片描述

📘4.2.3_利用 return 提前终止函数

return 语句之后的代码不会被执行。
例如：在 getMax() 函数中判断两个参数是否都是数字型，只要其中一个不是数字型，则提前返回 NaN。

function getMax(num1,num2){
if(typeof num1 != 'number' || typeof num2 != 'number'){
return NaN;
}
return num1 > num2 ? num1 : num2;
}
console.log( getMax(1, '3') );  // 输出结果:NaN

在这里插入图片描述

NaN( Not a Number,非数)，是计算机科学中数值数据类型的一类值，表示未定义或不可表示的值。
null(空型)、undefined(未定义型)、number(数字型) 为基本数据类型。

📒4.2.4_利用 return 返回数组

在函数中使用 return 时，应注意 return 只能返回一个值。即使使用多个逗号隔开多个值，也只有最后一个值被返回。

function fn(num1, num2){
return num1, num2;
}
console.log( fn(1, 2) ); // 输出结果:2

在这里插入图片描述

在开发中，当需要返回多个值的时候，可以用数组来实现，也就是将要返回的多个值写在数组中，作为一个整体来返回。

function getResult(num1, num2){
return [num1 + num2, num1 - num2, num1 * num2, num1 / num2];
}
console.log( getResult(1,2) );  // 输出结果: (4)[ 3, -1, 2, 0.5 ]

在这里插入图片描述

今日入门学习暂时告一段落

Peace

🌊🌈往期回顾：

🌊🌈关于后记：

感谢阅读，希望能对你有所帮助博文若有瑕疵请在评论区留言或在主页个人介绍中添加联系方式私聊我感谢每一位小伙伴不吝赐教

原创不易，「点赞」+「关注」 谢谢支持❤

【JS干货分享 | 建议收藏】挑战最短时间带你走进JS（四）

🌊🌈关于前言：

🌊🌈关于内容：

📚4.1_初识函数

📙4.1.1_函数的使用

📗4.1.2_函数的参数

📘4.1.3_函数的返回值

📚4.2_函数返回值案例

📙4.2.1_利用函数求任意两个数的最大值

📗4.2.2_利用函数求任意一个数组中的最大值

📘4.2.3_利用 return 提前终止函数

📒4.2.4_利用 return 返回数组

🌊🌈往期回顾：

🌊🌈关于后记：