JavaScript第四天

函数

function，是被设计为执行特定任务的代码块

用于把具有相同或相似逻辑的代码“包裹”起来，有利于精简代码方便使用

函数基本使用

函数的声明
   function 函数名() {
            函数体
   }

函数传参

参数

把要计算的数字传到函数内。，若函数完成能需要调用者传入数据，那么就需要用有参数的函数，这样就可以极大提高函数的灵活性

// 封装一个求两个数字的和 的函数，并输出在页面中

        function getSum(a, b) {
            document.write(a + b)
        }
        // let num1 = +prompt('请输入数字1')
        // let num2 = +prompt('请输入数字2')
        getSum(10, 20)

注意（arguments）

如果实参个数大于形参，则后续传递进去的值会忽略

如果实参个数小于形参，则形参默认为undefined


// 函数中 arguments代表传递进来参数的伪数组，伪数组无法使用一些数组的方法 
        function getSum() {
            // 遍历数组
            let sum = 0
            for (let i = 0; i < arguments.length; i++) {
                sum = sum + arguments[i]
            }
            document.write(sum)
        }

        getSum(10, 20, 30)

return函数返回值

单个返回值

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

return后面的代码不再执行


// 求和函数有返回值  这个函数就只是求和，把结果返回给我们就行了，这个函数不需要打印输出
        function getSum(x, y) {
            return x + y
        }
        // res -> result 结果
        let res = getSum(10, 20)

        // 拿到结果后，由开发者决定返回值后续如何操作(alert dw log 或者进一步处理...)
        console.log(res)

多个返回值

利用数组来实现返回多个函数值


 // 封装一个计算两个数字的和和差的函数
        function getRes(a, b) {
            let he = a + b
            let cha = a - b
            return [he, cha]
        }

        let res = getRes(3, 1)
        document.write(`和为${res[0]},差为${res[1]}`)

变量作用域

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

全局作用域

全局有效。作用域所有代码执行的环境（整个script标签内）或者一个独立的js文件

局部作用域

局部有效。作用于函数内的代码块环境，就是局部作用域。因为跟函数有关系，所以也称函数作用域

块级作用域'

{}有效。块级作用域由{}包裹，if语句和for语句里面的{}等


function f1() {
            let num = 123  // 局部变量
            function f2() {
                let num = 0
                console.log(num)
            }
            f2()
        }
        let num = 456  // 全局变量
        f1()

函数表达式


let 变量  = function(){
  
}

立即执行函数

立即执行函数，作用：避免重复声明变量名导致代码bug


(function () {
            let res = 1
            console.log(1, '李狗蛋写的');
        })();


        (function () {
            let res = 2
            console.log(2, '张翠花写的');
        })();

04-JavaScript