一, 我们在学习 java 的时候, 其中方法有一个比较的重要的特性重载, 根据传入的参数的个数来执行不同的方法, 而方法其根据签名来判断, 而 JavaScript 却不能根据方法的签名来进行重载, 只能通过参数的个数的来进行实现伪重载.
在函数体中有个对象 arguments, 记录调用函数的传入的参数的对象:
- <!DOCTYPE html>
- <HTML>
- <head>
- <title></title>
- </head>
- <body>
- <script type="text/JavaScript">
- function reloadFunc(ar1,ar2,ar3){
- console.log(arguments);
- console.log(typeof arguments);
- };
- reloadFunc('a','b')
- </script>
- </body>
- </HTML>
输出:
1 Arguments(2) ["a", "b", callee: ?, Symbol(Symbol.iterator): ?]0: "a"1: "b"callee: ? reloadFunc(ar1,ar2,ar3)length: 2Symbol(Symbol.iterator): ? values()__proto__: Object
我们可以在定义函数函数的不显示的显示参数, 通过传入 arguments 的长度来判断参数.
- function reloadFunc(){
- switch(arguments.length){
- case 1:
- console.log("一个参数!");
- break;
- case 2:
- console.log("两个参数!");
- break;
- case 3:
- console.log('三个参数!');
- break;
- default:
- console.log('未传入参数!')
- }
- };
- reloadFunc('a','b');
- reloadFunc();
- reloadFunc(1,2,3)
等同于:
- <script type="text/JavaScript">
- function reloadFunc(ar1,ar2,ar3){
- switch(arguments.length){
- case 1:
- console.log("一个参数!");
- break;
- case 2:
- console.log("两个参数!");
- break;
- case 3:
- console.log('三个参数!');
- break;
- default:
- console.log('未传入参数!')
- }
- };
- reloadFunc('a','b');
- reloadFunc();
- reloadFunc(1,2,3)
- </script>
注意: 1, 当我们显示定义了参数之后, 如果传入的参数个数小于我们显示定义参数, 默认缺省参数为 undefined 的.
2,arguments 的对象和函数的参数是不同的内存空间, 我们可以通过 arguments 修改参数.
3, 通过 arguments 修改参数的时候, 可以反射对应的变量, 但是 arguments 的长度在调用该函数的时候, 就已经决定了. 如果我们修改 arguments 的不存在的索引的变量值并不能反射到对应变量, 依然是 undefined 的:
- <!DOCTYPE HTML>
- <HTML>
- <head>
- <title></title>
- </head>
- <body>
- <script type="text/JavaScript">
- function reloadFunc(ar1,ar2,ar3){
- arguments[3]=2;
- console.log(ar3);
- };
- reloadFunc('a','b');
- </script>
- </body>
- </HTML>
输出:
1 undefined
我们可以通过下标访问 arguments 对象:
- <script type="text/JavaScript">
- function reloadFunc(ar1,ar2,ar3){
- console.log(arguments);
- console.log(typeof arguments);
- console.log(arguments[0],arguments[1])
- };
- reloadFunc('a','b')
- </script>
我们可以通过判断该对象的长度来进行方法的重载.
- <script type="text/JavaScript">
- function reloadFunc(ar1,ar2,ar3){
- switch(arguments.length){
- case 1:
- console.log("一个参数!");
- break;
- case 2:
- console.log("两个参数!");
- break;
- case 3:
- console.log('三个参数!');
- break;
- default:
- console.log('未传入参数!')
- }
- };
- reloadFunc('a','b');
- reloadFunc();
- reloadFunc(1,2,3)
- </script>
输出:
两个参数!
函数重载. HTML:20 未传入参数!
函数重载. HTML:17 三个参数!
我们可以判断传入的参数的长度来决定一个执行的不同的代码块. 实现类似的 java 的伪重载.
来源: http://www.bubuko.com/infodetail-2795934.html