JS-函数

一、声明函数

		function fn1() {
            console.log('fn1');
        }

        // 匿名函数
        let fn2 = function () {
            console.log('fn2');
        }
        let fn3 = new Function(123)

        fn1()
        fn2()
        fn3()

通过赋值的方式,函数没有了函数提升

		console.log('函数前', fn);

        var fn = function () {
            console.log(123);
        }
        console.log('函数后', fn);

		console.log('函数前', fn);
        var fn = new Function()
        console.log('函数后', fn);

前两段代码执行结果都是下图:

二.调用函数

函数名()

三、参数

1.实参

实际传入函数的参数

2.形参

    function 函数名(形参,形参...){}
    形参可以为变量或数组

    当实参和形参相同   正常执行
    当实参多余形参     取到哪里算哪里
    当实参少于形参     undefined 数字计算NaN

i.默认参数
给形参设置默认值

		function fn(形参 = 值,形参 = 值) {}

        function fn(a = 0, b = 0) {
            console.log(a + b);
        }

        fn()
        fn(12, 6)

实际开发写法:

		function fn(a, b) {
            a = a || 0
            b = b || 0
            console.log(a + b);
        }

        fn()

ii.动态参数
应用场景: 当函数中形参个数不确定的时候,那么可以通过arguments(动态参数)获取实参信息

    例子
    console.log(12,1,2,3,5);
    div.classList.add('one','two','three')
    总结
    1) arguments 必须在函数中使用
    2) arguments 是一个伪数组(保存实参信息)
    3) 如果要通过 arguments 得到实参信息,需要遍历伪数组





    argunments[0]
    argunments.length
    argunments.callee
    执行函数后输出整个函数代码

		function fn() {
            console.log(123);
            console.log(arguments.callee); 
        }

        fn(1,2,3,4)

iii.剩余参数
剩余参数只能有一个,且只能放到最后,如果多的实参都存储在这里,它是一个伪数组

		function fn(a, b, ...c) {
            console.log(a, b, ...c);
        }

        fn(1, 2, 3, 4, 5, 6, 7)

点语法:
…形参 剩余参数
…数组 将数组中的值展开

四.返回值

返回多个值用数组保存
当无返回值时 返回undefined

五.函数提升

程序在执行代码过程中,遇到函数的时候,将函数的声明提升到当前作用域的开始位置,不包含函数的调用

六.各种函数

1.高阶函数

函数的参数中有函数，那么这个函数就是高阶函数

2.回调函数

函数中的参数函数是回调函数

3.匿名函数

没有函数名的函数称为匿名函数

4.自调用函数

自己调用自己的函数称为自调用函数

		(function() {})();
        ~function(){}();
        (function() {}());

5.递归函数

函数内部调用函数自己
如果退出在调用前加return

		let i = 0
        function fn() {
            i++
            console.log(123);
            if (i == 10) {
                return
            } 
            fn()
        }

        fn()

6.延迟函数

setTimeout（函数名，延迟时间毫秒）
clearTimeout（timeID）
等一段时间后执行，只执行一次

和定时器区别

定时器
setInterval（函数名，时间间隔）
定时器是一个高阶函数
每隔一段时间执行一次，默认执行无限次
通过clearInterval（timeID）清除定时器

延迟函数
setTimeout（函数名，毫秒数）
延迟函数也是一个高阶函数
只执行一次，如需执行多次，需要结合递归函数使用
setTimeout在递归函数中停止-- -return
通过clearTimeout（）停止setTimeout延迟函数

7.闭包函数

在函数中,其他函数访问当前函数中的变量,整体函数称为闭包函数

作用
1) 延伸变量的使用生命周期
2) 规避变量污染(利用了作用域)

		function fn1() {
            let x = 0
            function fn2() {
                console.log(x);
            }

            fn2()
        }

        fn1()