JS基础四

一、函数

1.1为什么需要函数

• 函数：
  function,是被设计为执行特定任务的代码块
• 说明
  函数可以把具有相同或者相似逻辑的代码“包裹”起来，通过函数调用执行这些被“包裹”的代码逻辑，这么做的优势是有利于精简代码方便复用。

1.2函数使用

• 函数的声明语法
  
  例如：
  
• 函数命名规范
  • 和变量名基本一致
  • 尽量小驼峰式命名法
  • 前缀应该为动词
  • 命名建议：常用动词约定
• 函数的调用语法
  

注意：声明（定义）的函数必须调用才会真正被执行，使用（）调用函数

• 例如
  
• 我们曾经使用的alert(),parseInt()这种名字后面跟小括号的本质都是函数的调用
• 函数体
  函数体是函数的构成部分，它负责将相同或相似的代码“包裹”起来，直到函数调用时函数体内的代码才会执行。函数的功能代码都要写在函数体的当中。

1.3函数传参

• 思考：函数只能写固定的，功能局限非常大
  

• 解决方法：把要计算的数字传入到函数内

• 结论：

  • 若函数完成功能需要调用者传入数据，那么就需要用有参数的函数
  • 这样可以极大提高函数的灵活性

• 声明语法
  

  • 参数列表
    • 传入数据列表
    • 声明这个函数需要传入几个数据
    • 多个数据用逗号隔开

• 调用语法
  
• 调用函数时，需要传入几个数据就写几个，用逗号隔开

• 形参：声明函数时写在函数名右边小括号里面的叫形参（形式上的参数）
• 实参：调用函数时写在函数名右边小括号里面的叫实参（实际上的参数）
• 形参可以理解为是在这个函数内声明的变量，实参可以理解为是给这个变量赋值

参数默认值
形参：可以看做变量，但是如果不赋值，默认是什么？

• undefined
  但是如果做用户不输出实参，刚才的案例，则出现undefined+undefined结果是什么？
• NaN

我们可以改进下，用户不输入实参，可以给形参默认值，可以默认为0，这样更加严谨，可以如下操作：

说明：这个默认值只会在缺少实参参数传递时，才会被执行，所以参数会优先执行传递过来的实参，否则默认为undefined,数组的话可可 arr = []

1.4函数返回值

• 提问：什么是函数？
  函数是被设计为执行特定任务的代码块

• 提问：执行完特定任务之后，然后呢
  把结果给我们

• 缺点：把计算后的结果处理方式写死了，内部处理了

• 解决：把处理结果返回给调用者

• 有返回值的概念：

  • 当调用某个函数，这个函数就会返回一个结果出来
  • 这就是有返回值的函数
    

• 前面已经接触了很多具有返回值的函数：
  

• 这些函数是JS底层内置的，我们直接就可以使用

• 当然有些函数，则没有返回值
  

• 所以根据需求，来设定需不需要返回值

• 当函数需要返回数据出去时，用return关键字

• 语法
  

• 细节

  • 在函数体中使用return关键字能将内部的执行结果全部交给函数外部使用
  • return后面代码不会再被执行，会立即结束当前函数，所以retrun后面的数据不要换行写
  • return函数可以没有return，这种情况函数默认返回值为undefined

案例

求两个数中的最大值并返回

<script>
    function getMax(num1, num2) {
      return num1 > num2 ? num1 : num2
    }
    let num1 = +prompt('请输入第一个数：')
    let num2 = +prompt('请输入第二个数：')
    let max = getSum(num1, num2)
    document.write(`${max}`)
  </script>

求任意数组的最大值，并返回

<script>

    function getArrMax(arr = []) {
      let max = arr[0]
      for (let i = 1; i < arr.length; i++) {
        max = max > arr[i] ? max : arr[i]
      }
      return max
    }
    let maa = getArrMax([1, 4, 35, 33, 65])
    document.write(`${maa}`)
  </script>

同时求最大值和最小值

<script>

    function getArrMax(arr = []) {
      let max = arr[0]
      let min = arr[0]
      for (let i = 1; i < arr.length; i++) {
        max = max > arr[i] ? max : arr[i]
        min = min < arr[i] ? min : arr[i]
      }
      return [max, min]
    }

    let maa = getArrMax([1, 4, 35, 33, 65])
    let sum = document.write(`最大值为：${maa[0]},最小值为：${maa[1]}`)
  </script>

细节补充

• 两个相同的函数后面的会覆盖前面的函数
• 在JavaScript中实参的个数和形参的个数可以不一致
  • 如果形参过多 会自动填上undefined(了解即可)
  • 如果实参过多那么多余的实参会被忽略（函数内部有一个atguments，里面装着所有的实参）
  • 函数一旦碰到return就不会再往下执行了，函数的结束用return

1.5作用域

通常来说，一段程序代码中所用到的名字并不总是有效和可用的，而限定这个名字的可用性代码范围就是这个名字的作用域

作用域的使用提高了程序逻辑的局部性，增强了程序的可靠性，减少了名字冲突

全局变量：编写在script标签中，或者.js文件中
局部变量：编写在函数中

坑： 如果函数内部，变量没有声明，直接赋值，也当全局变量看，但是强烈不推荐

• 变量访问原则：能够访问到的情况下 先局部没有再找全局
• 就近原则

1.6 匿名函数

• 函数可分为：
  
  1.函数表达式
  将匿名函数赋值给一个变量，并且通过变量名称进行调用 我们将这个称为函数表达式
  语法：
  
  调用：
  
  其中函数的形式和实参使用跟具名函数一致

2.立即执行函数

场景介绍：避免全局变量之间的污染
语法：

• 无需调用，立即执行，其实本质已经调用了
• 多个立即执行函数之间用逗号隔开

案例：
用户输入秒数，自动转换为时分秒
分析：
①：用户输入总秒数（注意默认值）
②：计算时分秒（封装函数）里面包含数字补0
③：打印输出

计算公式：计算时分秒
小时： h = paseInt(总秒数 / 60 / 60 % 24)
分钟： m = parseInt(总秒数 / 60 % 60）
秒数：s = parseInt(总秒数 % 60）

<script>
    function getTime(t) {
      let h = parseInt(t / 60 / 60 % 24)
      let m = parseInt(t / 60 % 60)
      let s = parseInt(t % 60)

      h = h < 10 ? '0' + h : h
      m = m < 10 ? '0' + m : m
      s = s < 10 ? '0' + s : s

      return `转换为${h}时${m}分${s}秒`
    }

    let second = +prompt('请输入秒：')
    let time = getTime(second)

    document.write(time)

  </script>

逻辑中断

• 短路：只存在于&&和||中，当满足一定条件会让右边的代码不执行
  
• 原因：通过左边能得到整个式子的结果，因此没必要在判断右边
• 运算结果：无论&&还是||运算结果都是最后被执行的表达式值，一般用在变量赋值

转换为Boolean型
显示转换：
1.Boolean（内容）
记忆：‘’、0、undefined、null、false、NaN转换后都是fasle,其余为true

隐式转换：
1.有字符串的加法 “” +1 ，结果是"1"
2.减法 -（像大多数数学运算一样）只能用于数字，它会使空字符串""转换为0
3.null经过数字转换之后会变为0
4.undefined经过数组转换之后为NaN