在 js 中 函数 Function(大写) 就是一个对象。在 javascript 中没有函数 reload (重载)的概念。
我们看下面这个,结果应该是什么呢?
<html> <head> <script type="text/javascript"> function add(number) { alert(number+20); } function add(number) { alert(number+30); } add(10); </script> </head> <body> </body> </html>
结果是 40. 也就是第二个 add()方法的结果。我们再改成
<html> <head> <script type="text/javascript"> function add(number) { alert(number+20); } function add(number, number1) { alert(number+30); } add(10); </script> </head> <body> </body> </html>
结果还是40.虽然第二个 add()中有2个参数。
我们把两个 add()方法调换位置。
<html> <head> <script type="text/javascript"> function add(number, number1) { alert(number+30); } function add(number) { alert(number+20); } add(10); </script> </head> <body> </body> </html>
结果变成了 30。
难道 js 是查看哪个方法在后面么?不是。
其实对于第一个 add(number){alert(number+20;} 方法,它等于
var add = function (number) //f 是小写
{
alert(number + 20);
}
也就是说 function (number){alert(number+20);} 是一个对象。而 add 是指向 function 对象的引用。
所以第二个变成了
var add = function (number, number1)
{
alert(number + 30);
}
这时候 add 已经指向了这个 function 对象,而不再指向原来的 (number+20)对象。又由于 js 中可以定义2个参数却仅仅传递1个参数,所以 add指向的新的 function对象仍然可以继续执行。
我们再看下面这个。结果是什么呢?
<html> <head> <script type="text/javascript"> function add(number) { alert(number+20); } function add(number, number1) { alert(number1); } add(10);//注意:这里只传递了 number 没有传递 number1 </script> </head> <body> </body> </html>
结果是: undefined
javascript 中有一种数据类型叫 Undefined。它只有一个值 undefined.
就像java中有数据类型 boolean,它有两个值 true或者 false一样。
在 javascript 中有个 Function(大写) 对象,所有自定义的函数都是 Function (大写)对象类型的。
既然如此,我们也可以用 Function 对象来直接定义函数:
<!DOCTYPE html> <html> <head> <script type="text/javascript"> var add = new Function("number", "alert(number+20)"); add(10); </script> </head> <body> </body> </html>
注意, Function 这个对象中所有的参数都是字符串的形式的(即使我们用 add(10)传进来一个数字),而且他的最后一个参数(这里指 "alert(number+20)")是要执行的函数体。
再看一个实例
<html> <head> <script type="text/javascript"> var add2 = new Function("number", "number1", "alert(number+number1);"); add2(10,20); </script> </head> <body> </body> </html>
结果:30
在 js中每个函数都有一个隐含的对象 arguments,表示给函数实际传递的参数。
我们看这个
<html> <head> <script type="text/javascript"> function add(num1, num2) { alert(arguments[0]); alert(arguments[1]); } add(2,3); </script> </head> <body> </body> </html>
结果会依次打印出 2 , 3
我们再看一个
<html> <head> <script type="text/javascript"> function add(num1, num2) { alert(arguments[0]); alert(arguments[1]); alert(arguments[2]); } add(2,3,4); </script> </head> <body> </body> </html>
上面的例子add只定义了两个参数,但是调用的时候传进来3个参数,可以么?结果如何?
可以的。结果是一次打印出 2, 3, 4。
这就是说 arguments 这个固有对象是不受自定义方法的影响的。
arguments 还有一个属性 length,表示有几个参数,比如:
<html> <head> <script type="text/javascript"> function add(num1, num2) { alert(arguments.length); } add(2,3,4); </script> </head> <body> </body> </html>
结果是: 3
表示3 个参数。
js 是不支持方法重载的,但是我们可以使用 arguments模拟出来方法的重载的。
<html> <head> <script type="text/javascript"> function add2() { if (1== arguments.length) { alert (arguments[0]); } else if(2== arguments.length) { alert (arguments[0]+arguments[1]); } else if(3== arguments.length) { alert (arguments[0]+arguments[1]+arguments[2]); } } add2(1); add2(1,1); add2(1,1,1); </script> </head> <body> </body> </html>
结果,分别打印出 1, 2, 3
其实,由于 javascript 中对传入参数数量没有严格限定, 在很多框架中都应用了 arguments来限定用户输入的参数个数。