JavaScript函数

96 阅读2分钟

JavaScript函数

function,是被设计为执行特定任务的代码块
有利于精简代码方便复用
函数不调用自己不执行, 使用中方便控制执行位置
随时调用,随时执行,可重复调用

函数的使用

image.png

实参及形参概括

函数声明时,小括号里面的是形参,形式上的参数
函数调用时,小括号里面的是实参,实际的参数
尽量保持形参和实参的个数一致 ,中间用逗号符号隔开

image.png

        // 如果 实参个数大于形参,则后续传递进去的值会忽略
        // 如果 实参个数小于形参,则形参默认为undefined
    function getSum(x, y) {  
        return x + y
    }
    console.log(getSum(1, 2));  //调用函数打印得到实参x+y的返回值

逻辑中断解决

开发中形参如果不被赋值,就是undefined

        // 鲁棒性 -> 健壮性
        function getSum(a, b) {
            a = a || 0
            b = b || 0
            document.write(a + b)
        }
        getSum(1)
        // 给函数的形参设置默认值
        function getSum(a = 0, b = 0) {
            document.write(a + b)
        }
        getSum(9, 10)

函数返回值return

为什么要让函数有返回值
  1. 函数内部不需要输出结果,而是返回结果
  2. 对执行结果的扩展性更高,可以让其他的程序使用这个结果
函数返回值语法及注意事项
  1. 语法:return 数据
  2. return后面不接数据或者函数内不写return,函数的返回值是undefined
  3. return能立即结束当前函数, 所以 return 后面的数据无效

作用域

image.png

注意点:局部变量或者块级变量 没有let 声明直接赋值的当全局变量看
作用域链:采取就近原则的方式来查找变量最终的值

arguments 的介绍及用法

arguments在函数参数中是个伪数组,可以代替形参遍历来使用.但是没有没有数组的一些增减功能.
传递的实参不需要加 [ ]

image.png

        // 函数中 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)

立即执行函数写法

            (function (){ 
                函数体
            })();    
// 立即执行函数,作用:避免重复声明变量名导致代码bug

转换时间案例

    <script>
        /*  封装输入秒装换案例
            小时:  h = parseInt(总秒数 / 60 / 60 % 24)
            分钟:  m = parseInt(总秒数 / 60 % 60 )
            秒数:  s = parseInt(总秒数 % 60)
        */


        //用户输入弹出; 由于用户输入的是字符串  '+' 转换为数字
        //console.log(typeof times)  查看类型

        //第一步
        let times = +prompt(`请输入要装换的秒数`)

        // 第三步
        function data(time) {

            // 第二步
            let h = parseInt(time / 60 / 60 % 24)
            let m = parseInt(time / 60 % 60)
            let s = parseInt(time % 60)

            //补零操作;注意点 1 加字符串的零加时间,先零在时间  2 三元计运算符写好记得=赋值  
            h = h >= 10 ? h : '0' + h
            m = m >= 10 ? m : '0' + m
            s = s >= 10 ? s : '0' + s

            return [h, m, s]  //以字符串形式转出三个不同的数

            //打印下是否能接收到装换数据
            // console.log([h, m, s]);
        }

        // 第四步
        let res = data(times)  //新建个变量接收函数的返回数组  
        //data(这里为全局变量的time 赋值给data函数;形参=实参)
        console.log(res);  //查看能否打印
        document.write(`您输入的秒数为${times},转换的时间为:${res[0]}:${res[1]}:${res[2]}`)  //注意res为数组,选择第几个[索引]


    </script>