【JavaScript】12_函数1:函数的参数,箭头函数的参数

举报
魔天伦 发表于 2023/02/24 18:14:54 2023/02/24
【摘要】 1、初识函数函数(Function)函数也是一个对象它具有其他对象所有的功能函数中可以存储代码,且可以在需要时调用这些代码 语法:function 函数名(){        语句…    } 调用函数:- 调用函数就是执行函数中存储的代码        - 语法:        函数对象()使用typeof检查函数对象时会返回function <script> // ...

1、初识函数

函数(Function)

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

语法:

function 函数名(){
        语句…
    }

调用函数:

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

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

    <script>
        // 创建一个函数对象
        function fn(){
            console.log("你好!")
            console.log("Hello!")
            console.log("萨瓦迪卡")
            console.log("阿尼哈撒有")
        }
        console.log(typeof fn)
        // fn()
        // 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>
        /* 
            定义一个可以求任意两个数和的函数
        */

        // function sum(){
        //     let a = 123
        //     let b = 456
        //     console.log(a + b)
        // }

        // const sum2 = () => console.log(1 + 1)
        // sum()

        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、箭头函数的参数

    <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>
【版权声明】本文为华为云社区用户原创内容,转载时必须标注文章的来源(华为云社区)、文章链接、文章作者等基本信息, 否则作者和本社区有权追究责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@huaweicloud.com
  • 点赞
  • 收藏
  • 关注作者

评论(0

0/1000
抱歉,系统识别当前为高风险访问,暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称,即可参与社区互动!

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。