JavaScript在方法中使用apply(this,arguments)

女爷i 2023-01-09 15:58 124阅读 0赞

首先了解一下arguments:  
arguments 对象是JavaScript 函数内置的对象 ，包含了函数调用的参数数组。

<!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>入门JavaScript this</title>
    </head>
    
    <h2>JavaScript <b>this</b> arguments</h2>
    
    <p id="demo"></p>
    </head>
    <body>
    <script language="javascript">
    
    function findMax() { 
        var i, max = arguments[0];
        console.log(arguments);
        if(arguments.length < 2) return max;
     
        for (i = 0; i < arguments.length; i++) { 
            if (arguments[i] > max) { 
                max = arguments[i];
            }
        }
        return max;
    }
    console.log("最大值为:",findMax(1, 123, 500, 115, 44, 88)); 
    </script>
    </body>
    </html>

在控制台输出为：  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xpdWxhbmJh_size_16_color_FFFFFF_t_70]然后是apply的使用：  
apply() 方法接受两个参数：  
第一个参数为thisObject，调用时采用传入的thisObject代替函数体中this的指向，是函数运行的作用域。  
第二个参数是一个参数数组(arguments)，函数会用数组的值取代“参数列表"。

将A的方法应用到对象B上，在控制台输出为：

大家好！ 我是小B 我是个男生 今年20岁

现在将apply(this,argument)放到方法中使用：

在对象B中使用A的方法，并使用apply改变this的指向，arguments就是传入的参数：  
![在这里插入图片描述][20210122124737563.png]  
在对象B的方法funB中，this代表B，因此apply(B,arguments)就等同于apply(this,arguments)  
因此使用apply(this,arguments)可以方便的编写应用于不同对象的方法。  
看前人代码，看到一种用法，源码不好展示，这里类比一下：

var B = { 
        name:"我是小B",
    	funB:function()
    	{ 
    	console.log(this.name,arguments);
    	B.funB.apply(this,arguments)
    	}
    };
    B.funB("男生",20);

这个因为使用了递归，会导致把堆栈塞满，不知道为什么要这样用，希望路过的大佬看到了可以解释一下。。。。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xpdWxhbmJh_size_16_color_FFFFFF_t_70 1]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xpdWxhbmJh_size_16_color_FFFFFF_t_70]: /images/20221119/47483bbf2b0642a5b57ec262dc979df1.png
[20210122124737563.png]: /images/20221119/49e406b96d554536ba26e7597c3b1a06.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xpdWxhbmJh_size_16_color_FFFFFF_t_70 1]: /images/20221119/5381555fbb564514ba67db6e1454f3bd.png