浅谈一下javascript中的方法重载

最新推荐文章于 2024-12-24 10:47:48 发布

程宇寒

最新推荐文章于 2024-12-24 10:47:48 发布

阅读量491

点赞数

分类专栏： javascript 文章标签： javascript 方法重载

本文链接：https://blog.youkuaiyun.com/czh500/article/details/79576137

版权

javascript 专栏收录该内容

15 篇文章

订阅专栏

本文通过实例演示了JavaScript中并不存在传统意义上的方法重载概念。介绍了如何通过参数数量检查实现类似的功能，并提供了代码示例来展示如何根据不同参数数量执行不同功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

javascript中的方法重载的疑惑？直接上代码，代码中有详细的注释和解释说明的文字!

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>javascript中的方法重载的疑惑？</title>
<link rel="stylesheet" type="text/css" href="body.css">
<link rel="stylesheet" type="text/css" href="input2.css">
<link rel="stylesheet" type="text/css" href="mark.css">

<script type="text/javascript">
/*
	经过测试发现，javascript中的方法重载，和方法的顺序位置有关，重载的方法以最后一个位置的方法为准，也就是说重载的方法，最
	后面的方法会把前面的方法覆盖掉
	js中没有重载的概念，所以你的同名方法永远都是最后一个方法覆盖掉前面的方法，就如下代码一样：
	var a = 1;
	var a = 2;
	var a = 3;
	alert("a=" + a);
 */
	function hello() {
		alert("我是无参数的hello()函数!");
	}

	function hello(userName) {
		alert("我是带1个参数的hello(userName)函数!" + " - " + userName);
	}
	
	function hello(userName, age) {
		alert("我是带2个参数的hello(userName, age)函数!" + " - " + userName + " - " + age);
	}
	
	//js没有重载，因此需要做判断。
	function hello(userName,age){
        if(arguments.length==2){
  			alert("我是带2个参数的hello(userName, age)函数!" + " - " + userName + " - " + age);
        }else if(arguments.length==1){
            alert("我是带1个参数的hello(userName)函数!" + " - " + userName);
        }else if(arguments.length==0){
            alert("我是无参数的hello()函数!");
        }
	}
	
	var age = 16;
	var age = 22;
	var age = 9;
	alert("age=" + age);
	
	function test(){
		//局部变量和全局变量同名
		var age = 25;
		alert("age=" + age);
	}
	
	//调用test()函数
	test();
	
</script>
</head>
<body>
	<div align="center" style="height: auto;">
		<h2>javascript中的方法重载的疑惑？</h2>
		<h3>js中没有重载的概念，所以你的同名方法永远都是最后一个方法覆盖掉前面的方法</h3>
		<h2>有时间的话可以拓展一下知识，如下</h2>
		
		<a href="http://blog.youkuaiyun.com/fogcrane/article/details/54094941" target="_blank">
		JavaScript的函数支持重载吗？
		</a><br><br>
		
		<a href="https://www.cnblogs.com/yugege/p/5539020.html" target="_blank">
		浅谈JavaScript函数重载
		</a><br><br>
		
		<a href="http://www.jb51.net/article/62310.htm" target="_blank">
		JavaScript中的方法重载实例
		</a><br><br>
		
		
		<input type="button" value="js方法重载(1个参数)" οnclick="hello('令狐冲')">
		<input type="button" value="js方法重载(2个参数)" οnclick="hello('韦小宝', 16)">
		<input type="button" value="js方法重载(无参数)" οnclick="hello()">
		<br><br>
	</div>
</body>
</html>