前端开发必备：JavaScript 基础知识（五）

在上一篇📕前端开发必备：JavaScript 基础知识（四）中，我们学习了 JavaScript 的基础操作，如弹框、控制台打印、prompt 输入，以及数组和对象的使用。这些内容帮助我们更好地与用户交互并组织数据。

本篇我们将深入 JavaScript 的核心——函数。函数是封装代码的工具，能够提高代码的复用性和可维护性。通过学习函数的定义、调用和返回值，你将掌握编写高效代码的关键技能。

---

什么是函数？

函数是一段可以重复执行的代码块，它接受输入（称为参数），并可以返回输出（称为返回值）。通过函数，我们可以将复杂的逻辑分解成更小的、可管理的部分。

1.函数

在JavaScript中，我们可能定义非常多的相同的代码或者功能相似的代码，这些代码可能大量重复使用，如：求和。函数就是封装了一段可被重复调用执行的代码块。

1.1 声明与调用

◾具体函数（常用）

使用 function 声明函数时，同时赋予函数名。

形式： function 函数名 ( ) {   /*   代码   */   }

function fn(){
    /* 代码 */
}

◾匿名函数

使用 function 声明函数时，不赋予函数名，而是将其赋值给一个变量。常用于回调函数。

形式： 变量 = function( ) {   /*   代码   */   }

function fn = function(){
    /* 代码 */
}

◾调用函数

函数不调用，不会执行。

形式： 函数名( )

function fn(){
    console.log(1 + 1)
}
//调用函数
fn()

 

 1.2函数return

调用函数后，可以获取到结果值。常用于一些高频复用的功能性函数，类似数学函数y = x² + 10 ，输入不同的 x 可以获取到结果值 y 。

◾返回值

在函数内部用 return 关键字来返回一个结果，返回的值就是函数调用者获取到的值。 return 后面也可以写一些简单的代码逻辑，如：简单的计算、调用别的函数。

形式： return 值（非必须）

注意：如果调用了一个没有return的函数，调用者获取的是 undefined 值。

function 函数名(){
    return 需要返回的结果
}

示例：

//求和函数（有返回值）
function sum(num1,num2){
    return num1 + num2
}
var sumResult = sum(12,12)
console.log(sumResult) //24

 在控制台上输出：

 ◾结束函数执行

return 后面的语句不会执行，因此也常用于在分支语句中结束函数执行。

注意：如果有分支语句，一条支路上只能有一次return。

示例：

//开发中性别常用数字代替，写一个函数转化对应中文
    function transformSex(sexCode){
      if(sexCode == 0){
        return '女'
      }else if(sexCode == 1){
        return '男'
      }
        return '未知'
    }

    var man = transformSex(1)
    var woman = transformSex(0)
    var unknow = transformSex(3)

    console.log(man);
    console.log(woman);
    console.log(unknow);
    

效果：

 

总结

通过本篇的学习，我们掌握了 JavaScript 中函数的核心概念，包括函数的定义、调用、返回值以及实际应用场景。函数是封装代码的重要工具，能够提高代码的复用性和可维护性，是编写高效 JavaScript 程序的关键。