【JavaScript】43_可变参数

简介: # 19、可变参数## arguments- arguments是函数中又一个隐含参数- arguments是一个类数组对象(伪数组) 和数组相似,**可以通过索引来读取元素**,也可以通过for循环变量,但是它不是一个数组对象,不能调用数组的方法- arguments用来存储函数的实参, 无论用户是否定义形参,实参都会存储到arguments对象中 可以通过该对象直接访问实参```html <script> function fn(){ console.log(arguments[2])//读取

19、可变参数

arguments

  • arguments是函数中又一个隐含参数
  • arguments是一个类数组对象(伪数组)

    和数组相似,可以通过索引来读取元素,也可以通过for循环变量,但是它不是一个数组对象,不能调用数组的方法

  • arguments用来存储函数的实参,

    无论用户是否定义形参,实参都会存储到arguments对象中

    可以通过该对象直接访问实参

    <script>
        function fn(){
            console.log(arguments[2])//读取到下标为2的函数参数
            console.log(Array.isArray(arguments))//false
            for(let i = 0; i < arguments.length; i++){
                console.log(arguments[i])
            }

            //上下两种循环效果一样

            for(let v of arguments){
                console.log(v)
            }

            arguments.forEach(element => {console.log(element)});
        }
        fn(1,10,23)

        //定义一个函数,可以求任意个数值的和
        function sum(){
            //通过arguments,可以不受参数数量的限制更加灵活的创建函数
            let result = 0;
            for(let num of arguments){
                result += num
            }
            return result
        }
    </script>

可变参数,在定义函数时可以将参数指定为可变参数

  • 可变参数可以接收任意数量实参,并将他们统一存储到一个数组中返回
  • 可变参数的作用和arguments基本是一致,但是也具有一些不同点:

    1. 可变参数的名字可以自己指定
    2. 可变参数就是一个数组,可以直接使用数组的方法
    3. 可变参数可以配合其他参数一起使用
    <script>
        function fn2(...abc){
            console.log(abc)
        }

        function sum2(...num){
            return num.reduce((a,b) => a + b, 0)
        }

        // 当可变参数和普通参数一起使用时,需要将可变参数写到最后
        function fn3(a, b, ...args) {
            // for (let v of arguments) {
            //     console.log(v)
            // }

            console.log(args)
        }

        fn3(123, 456, "hello", true, "1111")
    </script>

函数

根据函数调用方式的不同,this的值也不同:

  1. 以函数形式调用,this是window
  2. 以方法形式调用,this是调用方法的对象
  3. 构造函数中,this是新建的对象
  4. 箭头函数没有自己的this,由外层作用域决定
  5. 通过call和apply调用的函数,它们的第一个参数就是函数的this

调用函数除了通过 函数() 这种形式外,还可以通过其他的方式来调用函数
比如,我们可以通过调用函数的call()和apply()来个方法来调用函数

函数.call()

函数.apply()

  • call 和 apply除了可以调用函数,还可以用来指定函数中的this
  • call和apply的第一个参数,将会成为函数的this
  • 通过call方法调用函数,函数的实参直接在第一个参数后一个一个的列出来
  • 通过apply方法调用函数,函数的实参需要通过一个数组传递
    <script>
        function fn(){
            console.log('函数执行了~~~',this)
        }

        const obj = {name:'孙悟空',fn}

        fn.call(obj)
        fn.apply(console)

        function fn2(a, b) {
            console.log("a =", a, "b =", b, this)
        }

        // fn2.call(obj, "hello", true)
        fn2.apply(obj, ["hello", true])
    </script>
相关文章
|
6月前
|
自然语言处理 JavaScript 前端开发
探索JavaScript中的闭包:理解其原理与实际应用
探索JavaScript中的闭包:理解其原理与实际应用
63 0
|
6月前
|
JavaScript 前端开发
JavaScript基础语法(类型转换)
JavaScript基础语法(类型转换)
50 0
|
6月前
|
存储 JavaScript 前端开发
JavaScript基础知识:JavaScript 的基本数据类型有哪些?
JavaScript基础知识:JavaScript 的基本数据类型有哪些?
52 0
|
2月前
|
JavaScript 前端开发
JavaScript基础知识-立即执行函数
关于JavaScript基础知识中立即执行函数的介绍。
26 2
JavaScript基础知识-立即执行函数
|
3月前
|
JavaScript 前端开发
JavaScript——实现一些常用函数
JavaScript——实现一些常用函数
14 0
|
5月前
|
缓存 前端开发 JavaScript
【JavaScript】JavaScript 中的闭包:从入门到精通
【JavaScript】JavaScript 中的闭包:从入门到精通
107 0
|
6月前
|
JavaScript 前端开发 Java
JavaScript基础语法(函数)
JavaScript基础语法(函数)
46 0
|
6月前
|
JavaScript 前端开发 Java
JavaScript流程控制语句及函数
JavaScript流程控制语句及函数
50 0
|
Web App开发 JavaScript 索引
javascript_01基本语法(下)
javascript_01基本语法(下)
78 0
|
存储 移动开发 JavaScript
javascript_01基本语法(上)
javascript_01基本语法(上)
37 0