day04 函数

函数

函数是什么

​ 封装好的代码块，可以达到精简、复用的效果

函数使用

命名规范

• 前缀应该为动词：addName（）

• 小驼峰命名

步骤

先声明，再调用（函数不调用自己不执行）

// 声明
function sayHi(){
    document.write('hi');
}
// 调用
sayHi();

拓展

​ 1、函数声明的时候，是在js刚进入执行环境的时候（函数声明会提前）（声明实际不是运行到这一行才声明，不像我们的let变量一样）

		 // 调用
        sayHi();//这样同样没有错，因为函数在进入时就声明了，与调用位置无关
        // 声明
        function sayHi(){
            document.write('hi');
        }

注意

​ 1、函数可以多次调用
​ 2、函数可以在任意时刻调用（当然前提是已经声明好了）

函数传参

实参和形参

//1、getSum(num1,num2) 的【形参】相当于是定义了let num1， num2因此此时默认值为undefined
        function getSum(num1,num2){
            document.write('sum=',num1 + num2);
            document.write('<br>')
        }
// 2、【实参】相当于赋值：num1 = 1，num2 = 2；
        getSum(1,2);
        getSum(2,2);
        getSum(3,2);

实参的值什么时候声明的？

​ 函数声明的时候就吧它们声明了，有赋值的情况再完成赋值

function getMax(array){
            let max = array[0];//赋值，array = arr（传入我们定义的数组）
            for(let i = 0;i<array.length;i++){
                let val = array[i];
                if(val > max){
                    max = val;
                }
            }
            return max;
        }
        debugger
        let arr = [1,2,5,6,45];
        console.log(getMax(arr));

逻辑中断

​ 主要用来为参数设置默认值，避免在实参个数<形参个数的时候，有undefined的值传入导致无法计算的情况

function getSum(x, y) {
        // 逻辑中断：  逻辑或的技巧： 取默认值
        // 1. 当 y 没传实参时， 默认值为 undefined
        // 2. undefined || 0 ;   前为逻辑假，返回后面的值 0
        // 3. 相当于 y = 0 ; 设置了默认值
        x = x || 0;
        y = y || 0;
        document.write(x + y);
      }
      getSum(1);

传入数组案例

let scores2 = [155, 44, 28, 32, 62, 2, 512, 57];
        //传入数组
        function getStuScore(stuList) {
            let total = 0;
            for (let i = 0; i < stuList.length; i++) {
                total += stuList[i];
            }
            //打印总和⭐
            document.write(total);
            document.write(`<br>`);
        }
        // 赋值⭐
        getStuScore(scores2);

函数返回值

​ 函数很多情况下需要返回值的，自己写的函数可以决定是否需要返回值

细节

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

// 使用返回值的 注意事项：
      debugger;
      function getSum(x, y) {
        // 3. return不要换行写； 如果换行写，相当于 return了 undefined
        return;
        // x + y;
        // 2. return 之后的代码，不会执行
        // console.log(123);
      }
      // 1. 函数内部的值，外部访问不到（函数内部只能通过return，返回内部的值）
      // console.log(x);

      console.log(getSum(1, 2));
      // 4. 函数可以没有 返回值， 这种情况默认返回undefined

作用域

​ 变量访问范围

全局作用域

​ 全局变量：函数外部let 的变量

// 3、访问全局变量 错误
        arru();
        // 全局变量
        let toop = 1;
		// 局部变量
        function arru(){
            let sum =0;
            // 1、访问全局变量
            console.log(toop);
        }

局部作用域

​ 局部变量：函数内部let的变量

块级作用域

​ 块级变量：{} 内部的let变量

{
	let num = 1;
}//这是块级，用花括号括起来了
console.log (num);//undefined

//拓展
let num1 = 10;
{
    let num1 = 1;
}
console.log(num1);//10 解决了冲突的问题

作用域链

• 访问变量原则：遵循就近原则：作用域最近，不是书写位置最近

• 谷歌浏览器开启查看作用域链，从而确定变量最终值

匿名函数

匿名函数

​ 函数作为一个值赋值给了变量

//声明
let x = function(){
            console.log(123);      
        }
        //调用
        x();

​ 拓展：

​ 1、作为值传递

​ 2、可作为实参传递

立即执行函数

​ 特点：声明即调用

//注意：两个匿名函数之间要加上分号
(function (){console.log(11)})();
(function (){console.log(22)}());

​ 作用：避免全局变量的污染

(function (){
    let num =1
    console.log(11);
      })();
//这里的let num是在块作用域
//下面也是，因此互相不干扰，即避免了变量之间的污染
(function (){
    let num = 1;
    console.log(11);
    }())

注意事项

1、分号重要性

  //没有分号，能输出，但报错
(function (){console.log(11)})()  //被识别undefined () 这不是以一个函数
(function (){console.log(22)}());

报错原因：

​ 错误：(intermediate value)(...) is not a function

识别为了一整条语句：

​ 1. 执行了第一个匿名函数，返回了 undefined

​ 2. 执行了 undefined() ; undefined被当做函数调用了； 自然会报错

2、区别

• ​ 不加上括号，则系统识别为 函数声明语句

• ​ 函数声明： 必须给一个函数名；否则语法错误

​ 方式一：

• ()把里面的代码当做一个表达式【返回一个值】

(function (){
	console.log(11);
   })()

​ 方式二：

• // 把里面的代码当做一个表达式

(function (){
        console.log(11);
      }())