JavaScript基础之函数的使用

 

目录

前言

一、什么是函数

二、函数的基本使用

 1.形式参数（形式上的参数）

2.实际参数（实际上的参数）

3.返回值

三、函数的形参和实参的关系

四、return返回值的作用

五、匿名函数的使用方式

总结

---

 

 

 

---

前言

        在写代码的时候，有些代码是需要重复使用的，或者有些代码都相似，这时候我们就可以把这写重复或者相似的代码封装在函数里，在需要的时候调用它，提高我们的效率

---

一、什么是函数

        在JavaScript中，函数是一段可被执行或调用任意次数的JavaScript代码，它可以把具有相同或相似逻辑的代码封装起来。

        简单来说，就是通过函数封装一段代码，在哪需要它，就调用这个函数

二、函数的基本使用

        在JavaScript中，声明一个完整的函数包括关键字(function)、函数名、形式参数、函数体、返回值5个部分

        使用函数的时候只需要调用这个函数就行了 语法：函数名()

function fn(a){
    //function是声明函数关键字
    //fn是函数名
    //a是函数形式参数
    return a; //返回值
}

//调用函数
fn(123);  //123是实际参数

•  1.形式参数（形式上的参数）

  • 形式参数也可以叫做形参，它是定义在声明函数的小括号里的。它是一个变量（存在函数作用域里的），它的作用是用来接收实参传递的值，在函数体中，可以调用形参来使用

• 2.实际参数（实际上的参数）

  • 实参是在调用函数时，小括号里的值就是实际上的参数，这个参数的值会传入给形参，方便函数体内的代码调用形参获得外部数据

• 3.返回值

  • 返回值就是调用这个函数后的返回值；就比如，你花一块钱买了一瓶矿泉水，你调用了一块钱，返回了你一瓶水，水就是返回值。
  • 调用函数后的返回值，需要声明一个变量来接收

  • function fn(a){
        //function是声明函数关键字
        //fn是函数名
        //a是函数形式参数
        return a; //返回值
    }
    
    //调用函数
    let result = fn(123);  //123是实际参数
    console.log(result);   //打印接收函数返回值的变量
    
    //123

三、函数的形参和实参的关系

一般情况下实参有多少个，函数的形参就要有多少个，他们之间的关系是相对于的

function fn(a, b, c) {
  console.log(a); //1
  console.log(b); //2
  console.log(c); //3
}
fn(1, 2, 3)

1. 如果形参的个数超过实参的个数，那么超出的形参值为undefined
2. 如果实参的个数超过形参的个数，那么多余的实参不会被接收
3. 实参的值可以是任何数据类型

 

四、return返回值的作用

       在函数中既然可以通过console.log直接打印数据，或者直接给全局作用域下的变量赋值，这样也能得到想要的结构，为什么还需要return返回值呢。

        是因为，如果是通过给函数外的变量赋值或者直接打印出来，这样限制了函数的灵活性，函数本质就是封装代码，让代码更有灵活性，在我们需要的时候可以多次使用它。

        而且函数本身应该是独立的，不需要依赖外部变量，只需要在调用的时候通过实参传递给形参，然后函数内部代码再调用形参，这样函数就可以获得外部传进来的数据，然后执行对应的操作，然后通过return返回对应的值

        通过return返回的值，可以让这个值在多处使用，根据有灵活性

function fn(a, b, c) {
  // 返回最大值
  return a > b ? a : b > c ? b : c;
}
// 传入对比的数字
let reslut = fn(1, 2, 3);
// 在弹窗中调用返回的值
alert(`最大值是${reslut}`);
// 在控制台打印返回的值
console.log(reslut);

这里可以看到，返回的值在弹窗和控制台打印中被使用，这就是使用return返回值的好处，更加灵活

五、匿名函数的使用方式

在声明函数时，可以不设置函数名，即为匿名函数，匿名函数有两种使用方式：

1. 函数表达式
   声明一个变量并赋值一个匿名函数，这个变量就是函数的函数名

   //声明一个fn变量，赋值一个匿名函数
   let fn = function (a) {
     return a
   }
   let reslut = fn(1);
   console.log(reslut); //1

2. 立即执行函数法
   因为是匿名函数，因此如果单独的声明匿名函数，运行时会提示需要一个函数名，因此需要用小括号把函数包起来，并在括号左边 使用()调用

   (function () {
     console.log(123); //123
   })()
   //这里的括号也是可以传入实参的

    

 

总结

这些就是函数的基本使用方法，了解函数的使用，可以让我们在写代码的时候，更加灵活、方便