【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>
相关文章
|
2月前
|
JavaScript 前端开发
JavaScript 函数参数
JavaScript 函数参数
29 3
|
2月前
|
存储 JavaScript 前端开发
JavaScript 函数定义
JavaScript 函数定义
27 3
|
2月前
|
JavaScript 前端开发
JavaScript 函数调用
JavaScript 函数调用
19 1
|
3月前
|
JavaScript 前端开发 网络架构
JavaScript 传参方法
JavaScript 传参方法
20 0
|
JavaScript 前端开发
将 JavaScript 函数作为参数传递
将 JavaScript 函数作为参数传递
538 0
|
6月前
|
存储 JavaScript 前端开发
JavaScript函数柯里化
JavaScript函数柯里化
|
JavaScript 前端开发
【JavaScript】17_函数的返回值
# 7、函数的返回值 在函数中,可以通过return关键字来指定函数的返回值 返回值就是函数的执行结果,函数调用完毕返回值便会作为结果返回 任何值都可以作为返回值使用(包括对象和函数之类) 如果return后不跟任何值,则相当于返回undefined 如果不写return,那么函数的返回值依然是undefined return一执行函数立即结束 ```html <script> function sum(a, b) { // console.log(a + b)
64 0
|
JavaScript 前端开发
JavaScript深入之参数按值传递
JavaScript深入系列第九篇,除了按值传递、引用传递,还有第三种传递方式 —— 按共享传递
157 0
JavaScript深入之参数按值传递
|
JavaScript 前端开发
JavaScript 专题之函数柯里化
JavaScript 专题系列第十三篇,讲解函数柯里化以及如何实现一个 curry 函数
99 0
JavaScript 专题之函数柯里化
|
JavaScript 前端开发
javascript匿名函数
javascript匿名函数