函数js

Posted

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了函数js相关的知识，希望对你有一定的参考价值。


函数的定义格式：
function 函数名(形参名列表){
函数体;
}

javascript定义函数时需要注意的细节：
1.在javascript定义函数的时候，形参不能使用var关键字声明变量类型，只写形参的名称就可以了.
2.在javascript中的函数是没有返回值类型的，如果函数需要返回数据类型给调用者，直接返回即可，如果不需要返回则不返回。
3.在javascript中没有函数重载的概念，后定义的同名函数会直接覆盖前面定义的同名函数。
4.在javascript中任何的函数内部都隐式维护了一个arguments（数组）的对象，给函数传递数据的时候，是会先传递到arguments对象中，然后再由arguments对象分配数据给形参的。
5.在函数中可以直接使用arguments变量，arguments是一个数组，表示所有传递过来的参数。
6.在声明函数时，定义的形参就对应arguments数组中相应位置的参数值，写形参只是用着方便一点。但是不推荐。
                例如：
                 
  1. function Person(){
  2. this.id = arguments[0]; //在函数中可以直接使用arguments变量，arguments是一个数组，表示所有传递过来的参数。
  3. this.name = arguments[1];
  4. }

Demo如下：
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <title>javascript函数</title>
  6. </head>
  7. <script type="text/javascript">
  8. /*
  9. javascript函数
  11. 函数的定义格式：
  12. 	function 函数名(形参名列表){
  13. 		函数体;
  14. 	}
  16. javascript定义函数时需要注意的细节：
  17. 	1.在javascript定义函数的时候，形参不能使用var关键字声明变量类型，只写形参的名称就可以了.
  18. 	2.在javascript中的函数是没有返回值类型的，如果函数需要返回数据类型给调用者，直接返回即可，如果不需要返回则不返回。
  19. 	3.在javascript中没有函数重载的概念，后定义的同名函数会直接覆盖前面定义的同名函数。
  20. 	4.在javascript中任何的函数内部都隐式维护了一个arguments（数组）的对象，给函数传递数据的时候，是会先传递到arguments对象中，然后再由arguments对象分配数据给形参的。
  21. 	5.在函数中可以直接使用arguments变量，arguments是一个数组，表示所有传递过来的参数。
  22. 	6.在声明函数时，定义的形参就对应arguments数组中相应位置的参数值，写形参只是用着方便一点。但是不推荐，不方便分析函数
  23. */
  24. //需求：定义一个函数做两个参数的加法功能。
  25. with(document){
  26. 	function add1(a, b){
  27. 		var sum = a + b;
  28. //		document.write(sum);
  29. 		return sum;
  30. 	}
  31. 	
  32. 	//调用函数
  33. 	var result = add1(1, 2);
  34. 	document.write(result);
  35. 	
  36. 	document.write("<hr/>");
  37. 	
  38. 	function add2(a, b){
  39. 		var sum = a + b;
  40. 		document.write(sum);
  41. 	}
  42. 	
  43. 	//调用函数
  44. 	var result = add2(1, 2);
  45. 	document.write("两个函数总和" + result);//undefined   函数中没有返回值时，return可以有，也可以没有。若有return返回值为undefined
  46. 	
  47. 	document.write("<hr/>");
  48. 	
  49. 	// javascript中的函数没有重载的形式，后定义的函数会直接覆盖前面 的函数。
  50. 	function add2(a, b, c){	
  51. 		var sum = a + b + c;
  52. 		document.write("三个函数总和" + sum);
  53. 	}
  54. 	//调用函数
  55. 	add2(1, 2, 3);
  56. 	add2(1, 2);
  57. 	
  58. 	document.write("<hr/>");
  60. 	function add2(){	
  61. 		document.write("arguments对象长度：" + arguments.length + "\\t, ");
  62. 		
  63. 		var sum = 0;
  64. 		document.write("0个函数总和" + sum);
  65. 		
  66. 		for(var i=0; i<arguments.length; i++){//在函数中可以直接使用arguments变量，arguments是一个数组，表示所有传递过来的参数。
  67. 			document.write(arguments[i]);//输出arguments对象中的参数
  68. 		}
  69. 	}
  70. 	
  71. 	add2(1, 2, 4, 5, 6);
  72. 	
  73. 	write("<hr/>");
  74. 	
  75. 	//在声明函数时，定义的形参就对应arguments数组中相应位置的参数值，写形参只是用着方便一点。但是不推荐
  76. 	function Person(){
  77. 		this.id = arguments[0]; //在函数中可以直接使用arguments变量，arguments是一个数组，表示所有传递过来的参数。
  78. 		this.name = arguments[1];
  79. 	}
  80. 	var p = new Person(111, "木丁西");
  81. 	write(p.id + "\\t" + p.name);
  82. }	
  83. </script>
  84. <body>
  85. </body>
  86. </html>
效果如下：
技术分享


Demo需求如下：
定义一个输入框输入的月份，然后输出本月对应的天数。 
31天：1,3,5,7,8,10,12
30天：4,6,9,11
28天：2
 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <title>javascript函数练习</title>
  6. <script type="text/javascript">
  7. /*需求：定义一个输入框输入的月份，然后输出本月对应的天数。 
  8. 		31天：1,3,5,7,8,10,12
  9. 		30天：4,6,9,11
  10. 		28天：2
  11. */
  12. 	function showDay(){
  13. 		//找到对应的标签对象
  14. 		var monthObj = document.getElementById("month");
  15. 	//	alert(month.value);//访问对象的值  对象.value
  16. 	
  17. 		//获取到输入框中的月份值
  18. 		var month = monthObj.value;
  19. 		
  20. 		//判断输入框中的数据是不是数字
  21. 		if(isNaN(month)){
  22. 			alert("请输入月份（数字）。。。");
  23. 			return;
  24. 		}		
  25. 		
  26. 		//将月份字符串转换成数字
  27. 		month = parseInt(month);  //和java一样，switch case中的值必须要与switch表达式的值具有相同的数据类型。获取到对象的值为string，而case后面的是number，所以得统一数据类型。
  28. 		
  29. 		//判断输入框中的数据是否是月份
  30. 		if(month<1 || month>12){
  31. 			alert("请输入正确的月份（1-12）。。。");
  32. 			return;
  33. 		}
  34. 		
  35. 		switch(month){
  36. 			case 2:
  37. 				alert("28天");
  38. 				break;
  39. 			case 4:
  40. 			case 6:
  41. 			case 9:
  42. 			case 11:
  43. 				alert("30天");
  44. 				break;
  45. 			default:
  46. 				alert("31天");
  47. 		}		
  48. 	}
  49. </script>
  50. </head>
  52. <body>
  53. 	月份<input type="text" id="month"/><input onclick="showDay();" type="button" value="查询" />
  54. </body>
  55. </html>
结果如下：
技术分享
 















以上是关于函数js的主要内容，如果未能解决你的问题，请参考以下文章

几个关于js数组方法reduce的经典片段

web代码片段

JS常用代码片段-127个常用罗列-值得收藏

ES7-Es8 js代码片段

谷歌浏览器调试jsp 引入代码片段，如何调试代码片段中的js

VSCode自定义代码片段——JS中的面向对象编程