js调用函数时传入的参数个数与函数定义时的参数个数不符时的操作

以你之姓@ 2022-04-25 06:58 188阅读 0赞

转截自：[https://www.cnblogs.com/daixiaotian/p/6423691.html][https_www.cnblogs.com_daixiaotian_p_6423691.html]

1.在js中函数没有重载的概念，如果声明了多个重名的函数，不管函数的形参个数是否一样，只有最有一个有效，其他的函数声明都是无效的。比如说声明了两个函数fn()，第一次声明时没有形参，第二次声明时形参有两个，则在调用fn()时不管有没有传入参数，都是调用后声明的那个函数。假如说调用时只传入了1个参数，例如fn(1)，则1会赋给函数的第一个形参，而第二个形参不会赋值，如果有用到，就会当undefined处理，可能会报错。如果调用时传入了3个参数，例如fn(1,2,3)，则1会赋给第一个形参，2会赋给第二个形参，3是用不上的，但是不会报错。

<table> 
 <tbody> 
 <tr> 
 <td> 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 </td> 
 <td> <code>&lt;</code><code>html</code><code>&gt;</code> <code>&nbsp;&nbsp;</code><code>&lt;</code><code>head</code><code>&gt;</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>&lt;</code><code>title</code><code>&gt;</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>函数调用测试，参数个数和函数声明不一样多</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>&lt;/</code><code>title</code><code>&gt;</code> <code>&nbsp;&nbsp;&nbsp;</code>&nbsp; <code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>&lt;</code><code>script</code>&nbsp;<code>language="JavaScript"&gt;</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>function&nbsp; needTwoPara(p1,p2){ </code> <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>var a=arguments;</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>var result='我是个需要2个参数的函数\n'</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>+'您输入的参数的个数为:'+a.length+'\n'</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>for(var i=0, len = a.length; i &lt;&nbsp;</code><code>len</code><code>; i++){ </code> <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>result=result+'第'+(i+1)+'个参数为:'+a[i]+'\n'</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>}</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>result+='以上是用arguments来获得参数\n';</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>result+='下面用变量来获得参数:\n';</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>result+='p1:'+p1+'\n';</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>result+='p2:'+p2+'\n';</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>alert(result);</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>}</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>&lt;/script&gt;</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>&lt;/</code><code>head</code><code>&gt;</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>&lt;</code><code>body</code><code>&gt;</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>&lt;</code><code>form</code><code>&gt;</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>&lt;</code><code>input</code>&nbsp;<code>type="button" value="测试1--传递1个参数"</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>onClick="JavaScript: needTwoPara('smallerpig');"&gt;</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>&lt;/</code><code>form</code><code>&gt;</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>&lt;</code><code>form</code><code>&gt;</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>&lt;</code><code>input</code>&nbsp;<code>type="button" value="测试2--传递2个参数"</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>onClick="JavaScript: needTwoPara('smallerpig','小小猪');"&gt;</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>&lt;/</code><code>form</code><code>&gt;</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>&lt;</code><code>form</code><code>&gt;</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>&lt;</code><code>input</code>&nbsp;<code>type="button" value="测试3--传递3个参数"</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>onClick="JavaScript: needTwoPara('smallerpig','小小猪','生命不息');"&gt;</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>&lt;/</code><code>form</code><code>&gt;</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>&lt;</code><code>form</code><code>&gt;</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>&lt;</code><code>input</code>&nbsp;<code>type="button" value="测试4--传递4个参数"</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>onClick="JavaScript: needTwoPara('smallerpig','小小猪','生命不息','学习不止');"&gt;</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>&lt;/</code><code>form</code><code>&gt;</code> <code>&nbsp;&nbsp;&nbsp;</code>&nbsp; <code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>&lt;/</code><code>body</code><code>&gt;</code> <code>&lt;/</code><code>html</code><code>&gt;</code> </td> 
 </tr> 
 </tbody> 
</table>

点击第一个按钮的返回结果：

<table> 
 <tbody> 
 <tr> 
 <td> 1 2 3 4 5 6 7 </td> 
 <td> <code>我是个需要</code><code>2</code><code>个参数的函数</code> <code>您输入的参数的个数为:</code><code>1</code> <code>第</code><code>1</code><code>个参数为:smallerpig</code> <code>以上是用arguments来获得参数</code> <code>下面用变量来获得参数:</code> <code>p1:smallerpig</code> <code>p2:</code><code>undefined</code> </td> 
 </tr> 
 </tbody> 
</table>

点击第二个按钮的返回结果：

<table> 
 <tbody> 
 <tr> 
 <td> 1 2 3 4 5 6 7 8 </td> 
 <td> <code>我是个需要</code><code>2</code><code>个参数的函数</code> <code>您输入的参数的个数为:</code><code>2</code> <code>第</code><code>1</code><code>个参数为:smallerpig</code> <code>第</code><code>2</code><code>个参数为:小小猪</code> <code>以上是用arguments来获得参数</code> <code>下面用变量来获得参数:</code> <code>p1:smallerpig</code> <code>p2:小小猪</code> </td> 
 </tr> 
 </tbody> 
</table>

点击第三个按钮的返回结果：

<table> 
 <tbody> 
 <tr> 
 <td> 1 2 3 4 5 6 7 8 9 </td> 
 <td> <code>我是个需要</code><code>2</code><code>个参数的函数</code> <code>您输入的参数的个数为:</code><code>3</code> <code>第</code><code>1</code><code>个参数为:smallerpig</code> <code>第</code><code>2</code><code>个参数为:小小猪</code> <code>第</code><code>3</code><code>个参数为:生命不息</code> <code>以上是用arguments来获得参数</code> <code>下面用变量来获得参数:</code> <code>p1:smallerpig</code> <code>p2:小小猪</code> </td> 
 </tr> 
 </tbody> 
</table>

点击第四个按钮的返回结果：

<table> 
 <tbody> 
 <tr> 
 <td> 1 2 3 4 5 6 7 8 9 10 </td> 
 <td> <code>我是个需要</code><code>2</code><code>个参数的函数</code> <code>您输入的参数的个数为:</code><code>4</code> <code>第</code><code>1</code><code>个参数为:smallerpig</code> <code>第</code><code>2</code><code>个参数为:小小猪</code> <code>第</code><code>3</code><code>个参数为:生命不息</code> <code>第</code><code>4</code><code>个参数为:学习不止</code> <code>以上是用arguments来获得参数</code> <code>下面用变量来获得参数:</code> <code>p1:smallerpig</code> <code>p2:小小猪</code> </td> 
 </tr> 
 </tbody> 
</table>

## 理解原因： ##

ECMAScript函数的参数与大多数其他语言中的函数的参数有所不同。ECMAScript函数不介意传递进来多少个参数，也不在乎穿进来参数是什么数据类型。也就是是说，即便你定义的函数值接受两个参数，在调用这个函数时也未必一定要是两个参数。可以传递一个、三个甚至不传递参数，而解析器永远不会有什么怨言。之所以会这样，原因是ECMAScript中的参数在内部是用一个数组来运行的。函数接受到的永远是这个数组，而不关心数组中包含哪些参数(如果有参数的话)。如果这个数组中不包含任何元素，无所谓；如果包含多个元素，也没问题。实际上，在函数体内可以通过arguments对象来访问这个参数数组，从而获取传递给含糊的每一个参数。

[https_www.cnblogs.com_daixiaotian_p_6423691.html]: https://www.cnblogs.com/daixiaotian/p/6423691.html