开启掘金成长之旅！这是我参与「掘金日新计划 · 12 月更文挑战」的第13天，点击查看活动详情

1、初识函数

函数（Function）

• 函数也是一个对象
• 它具有其他对象所有的功能
• 函数中可以存储代码，且可以在需要时调用这些代码

语法： function 函数名(){ 语句... }

调用函数： - 调用函数就是执行函数中存储的代码 - 语法： 函数对象()

使用typeof检查函数对象时会返回function

    <script>
        // 创建一个函数对象
        function fn(){
            console.log("你好！")
            console.log("Hello!")
            console.log("萨瓦迪卡")
            console.log("阿尼哈撒有")
        }
        console.log(typeof fn)
        // fn()
    </script>

2、函数的创建方式

函数的定义方式：

1.函数声明

function 函数名(){

语句...

}

2.函数表达式

const 变量 = function(){

语句...

}

3.箭头函数

() => {

语句...

}

    <script>
        function fn(){
            console.log("函数声明所定义的函数~")
        }
​
        const fn2 = function(){
            console.log("函数表达式")
        }
​
        const fn3 = () => {
            console.log("箭头函数")
        }
​
        const fn4 = () => console.log("箭头函数")
        
​
        console.log(typeof fn)
        console.log(typeof fn2)
        console.log(typeof fn3)
        console.log(typeof fn4)
        fn4()
    </script>

3、参数

形式参数

• 在定义函数时，可以在函数中指定数量不等的形式参数（形参）

• 在函数中定义形参，就相当于在函数内部声明了对应的变量但是没有赋值

实际参数

• 在调用函数时，可以在函数的()传递数量不等的实参
• 实参会赋值给其对应的形参
• 参数：
  1. 如果实参和形参数量相同，则对应的实参赋值给对应的形参
  2. 如果实参多于形参，则多余的实参不会使用
  3. 如果形参多于实参，则多余的形参为undefined ​
• 参数的类型
  • JS中不会检查参数的类型，可以传递任何类型的值作为参数

1.函数声明 ​ function 函数名([参数]){ ​ 语句... ​ }

2.函数表达式 ​ const 变量 = function([参数]){ ​ 语句... ​ }

3.箭头函数 ​ ([参数]) => { ​ 语句... ​ }

    <script>
        //定义一个可以求任意两个数和的函数
        // const sum2 = () => console.log(1 + 1)
​
        function fn(a, b){
            console.log("a =", a, a.name)
            console.log("b =", b)
        }
​
        // fn(1)
        // fn(true, "hello")
        // fn(null, 11n)
        // fn({name:"孙悟空"},"hello")
​
        function sum(a, b){
            console.log(a + b)
        }
        sum(123, 456)
    </script>

4、箭头函数的参数

只有一行代码时，可以不加大括号，不能写return语句，省略大括号，会隐式的返回函数返回值

当箭头函数中只有一个参数时，可以省略()

定义参数时，可以为参数指定默认值

默认值，会在没有对应实参时生成

    <script>
        
        const fn3 = () => {
            console.log("箭头函数")
        }
​
        //只有一行代码时，可以不加大括号，不能写return语句，省略大括号，会隐式的返回函数返回值（P288页）
        const fn4 = () => console.log("箭头函数")      
        //--------------------------------------------------
        
        const fn = (a, b) => {
            console.log("a =", a);
            console.log("b =", b);
        }
​
​
        // 当箭头函数中只有一个参数时，可以省略()
        const fn2 = a => {
            console.log("a =", a);
        }
        // fn2(123)
        
        const fn3 = (a=10, b=20, c=30) => {
            console.log("a =", a);
            console.log("b =", b);
            console.log("c =", c);
        }
        fn3(1, 2)
    </script>