函数

目标：理解封装的意义，能够具备封装函数的能力

什么是函数?为什么需要函数?

• 函数可以理解为一个 特定的代码块 容器 ，它可以完成特定的需求, 并且可以 重复 使用
• 需求: 让99乘法表重复使用 ?

函数声明和函数调用

• 函数默认不会主动执行,必须通过函数名() 调用才会执行.

• 函数一次声明可以多次调用,每一次函数调用函数体里面的代码会重新执行一次.

• 我们曾经使用的 alert() , parseInt() 这种名字后面跟小括号的本质都是函数的调用

• 思考小问题: 函数的复用和循环的重复有什么不同?

• 小练习

  • 封装一个打招呼的函数
  • 封装一个函数，计算两个数的和
  • 封装一个函数，计算1-100之间所有数的和
  • 问: 这些函数有什么缺陷

函数传参

• 根据上面练习的缺陷引出函数传参

  • 把函数在复用过程中会改变的值提取出来, 作为参数传递进去.这样可以极大提高函数的灵活性

• 需求: 封装一个可以跟任何人打招呼的函数

• 函数传参的语法

  • 完成上述需求

• 细节说明

  • 1. 术语1: 在声明函数的小括号里面写的数值我们称之为形式参数
  • 2. 术语2: 在调用函数的小括号里面写的数值我们称之为实际参数
  • 3. 形参作用: 本质上就是在函数内部声明变量
  • 4. 实参作用: 给形参赋值
  • 5. 我们曾经使用过的 alert('打印'), parseInt('11'), Number('11') 本质上都是函数调用的传参

• 练习

  • 1. 计算1-n之间所有数的和
  • 2. 计算m-n之间所有数的和
  • 3. 学生的分数是一个数组,计算每个学生的总分

函数的返回值

• 我们使用过的返回值引出为什么需要返回值

  • 使用过的返回值

    • let result = prompt('请输入你的年龄?');
    • let result2 = confirm('你确定要删除这条记录么?')
    • let result3 = parseInt('111');
    • // 函数的返回值不是必须的, 比如: alert() let result4 = alert('弹出一个内容');

  • 上面都是我们使用过的函数返回值的情况. 只是这些函数是JS底层内置的.我们直接就可以使用

    • 引出我们自己自定义的函数如何拥有返回值

  • 介绍语法

    • function doSomething(){ // doing return result; }

let jieguo = doSomething();

• 场景介绍

  • 调用两次求和函数,得到每一次求和的结果,再比较这两个结果的大小

    • function getSum(a, b) { let sum = a + b; return sum; }

let sum1 = getSum(10, 20); let sum2 = getSum(5, 16);

let max = sum1 > sum2 ? sum1 : sum2; console.log(max);

- return result 和 console.log(result)的区别 ???

	- 银行取钱的案例介绍

• 返回值练习

  • 根据下面的模板, 计算不同学生的总成绩(将每科成绩累加), 并求出当中的最高分
  • // 声明 function getScore(arr) { }

// 张三的分数数组 getScore([100, 90, 85]); // 李四的分数数组 getScore([95, 92, 89]); // 王五的分数数组 getScore([69, 100, 100]);

• 综合练习

  • 1. 求任意数组中的最大值并返回这个最大值
  • 2. 求任意数组中的最小值并返回这个最小值
  • 3. 求任意2个数中的最大值, 并返回

断点调试

• f11进入函数内部

细节补充

• 两个相同的函数后面的会覆盖前面的函数

• 在Javascript中 实参的个数和形参的个数可以不一致

  • 如果形参过多 会自动填上undefined (了解即可)
  • 如果实参过多 那么多余的实参会被忽略 (函数内部有一个arguments,里面装着所有的实参)

• 函数一旦碰到return就不会在往下执行了 函数的结束用return

  • 1. 思考: break的结束和return结束有什么区别 ?
  • 2. 思考: 如何返回多个数据 ?

作用域

• 什么是作用域? 为什么要了解作用域

  • 准备好一个变量在不同的情况下,取值不同的问题例子作为开场

• 作用域分类

  • 全局作用域:
  • 函数作用域
  • 块作用域: ?

• 变量分类

  • 全局变量

    • 在函数外部let 的变量 => 全局变量在任何区域都可以访问和修改

  • 局部变量

    • 在函数内部let 的变量 => 局部变量只能在当前函数内部访问和修改

  • 块级变量

    • let定义的变量,只能在块作用域里访问,不能跨块访问,也不能跨函数访问

  • 大坑: 局部变量必须是函数里面声明过(let)的变量

• 变量访问原则

  • 在能够访问到的情况下 先局部 局部没有在找全局

• 练习

匿名函数

• 没有名字的函数, 无法直接使用

• 使用方式

  • 将匿名函数赋值给一个变量，并且通过变量名称进行调用 我们将这个称为函数表达式

  • 自执行（匿名函数自执行）

    • 场景介绍: 避免全局变量之间的污染

综合案例