【Web测试】JavaScript函数定义与调用_web的js函数定义-CSDN博客

本文链接：https://blog.csdn.net/weixin_53217341/article/details/134342183

函数

- 一.函数的定义与调用
- 二、匿名函数

一.函数的定义与调用

1.函数：又被称为"方法"，解决问题：实现不同功能对应的代码块的封装

例：函数/方法----->封装代码块----->实现某个功能

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<script language="javascript">
			//无参无返回值函数fun01
			function fun01(){
				alert("这是一个按钮!");
			}
			fun01();
		</script>
	</body>
</html>

2.声明/创建函数

function 函数名(参数名1,参数名2…){

函数体;---->函数要实现的功能对应的代码块

return 返回值;

}

备注：①小括号内的参数是可写的；

②return语句可写，如果函数需要有返回值，则关联上；

③在声明函数时设置的参数被称为==“形式参数”，简称"形参"==;

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<script language="javascript">
		//有参无返回值函数fun02
			function fun02(x,y,z){
				alert(x-y-z);
			}
			fun02(100,40,35);
		</script>
	</body>
</html>

3.函数调用：运行/执行已经创建好的函数

格式：函数名(); 或函数名(实参);

备注：

实参：实际参数，指的是在对有形式参数的函数调用时，进行的赋值操作;

实参就是给形参赋的值：实参传形参

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<script language="javascript">
		//无参有返回值函数fun03
			function fun03(){
				return(Math.random()*100);
			}
			var f=fun03();
			alert(f)
		</script>
	</body>
</html>

4.return语句:

没有输出功能，它只能把数据进行返回，如果想要显示返回的结果值，还得借助于输出语句;

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<script language="javascript">
		//有参有返回值函数fun04
			function fun04(i,j,k){
				alert("三个数相乘为:");
				return(i*j*k);
			}
			//var ijk=fun04(Math.random(),Math.random(),Math.random());
			//alert(ijk);
			var ijk=fun04(fun03(),fun03(),fun03());
			alert(ijk);
		</script>
	</body>
</html>

二、匿名函数

1.概述：函数是没有名字的,是结合变量来使用

2.格式：

var 变量名=function(参数名){

函数体;

return 返回值；

}

3.调用:变量名()；变量名(值);

例:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>匿名函数</title>
		
		<script language="JavaScript">
			
			//声明一个匿名函数：实现两个数的取余操作
			//有参有返回值的匿名函数
			var  fun01=function(x,y){//x=10  y=24
				
				//返回取余的结果
				return  x%y;   //63%9=0
			}
			//调用
			alert(fun01(10,24));
			
			alert(fun01(11,10));
			
			//声明一个无参无返回值的匿名函数
			var  fun02=function(){
				//输出
				alert("我是无参无返回值的匿名函数");
			}
			//调用
			fun02();
		</script>
	</head>
	<body>
	</body>
</html>

4.全局函数: 可以直接拿来使用的函数;

1> eval(): 识别并执行字符串中包含的JS代码;

2>中文编码: encodeURI()

例:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>编码</title>
	</head>
	<body>
		<script language="javascript">
			//我和我的祖国
			 var name=prompt("请输入...");
			 var bbb=encodeURI(name);
			 if(bbb=="%E6%88%91%E5%92%8C%E6%88%91%E7%9A%84%E7%A5%96%E5%9B%BD"){
				 alert("验证正确!");
			 }else{
				 alert("大笨蛋!");
			 }
		</script>
	</body>
</html>

3> 中文解码: decodeURI()

例:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>js</title>
		
		<script language="JavaScript">
			//③中文解码：decodeURI()
			var  i="%E7%9B%B8%E4%BA%B2%E7%9B%B8%E7%88%B1%E7%9A%84%E4%B8%80%E5%AE%B6%E4%BA%BA";
			//对i的值进行解码
			var  jm=decodeURI(i);
			//输出  相亲相爱的一家人
			console.log(jm);
			
		</script>
		
	</head>
	<body>
	</body>
</html>

JavaScript中文解码

4> isNaN(): 判断是否为数字，是数字返回false，不是数字返回true：看字面值

例:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>js</title>
		
		<script language="JavaScript">
			//isNaN()：判断是否为数字，是数字返回false，不是数字返回true：看字面值     
			var x="testing";
			var y=26;
			var z="69";
			console.log(isNaN(x));  //true
			console.log(isNaN(y));  //false
			console.log(isNaN(z));  //false
		</script>
		
	</head>
	<body>
	</body>
</html>

isNaN函数

5> parselnt(): 把字符串中的数字转换成原始的数据类型;

例:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>js</title>
		
		<script language="JavaScript">
			
			//parseInt()：把字符串中的数字转换成原始的数据类型
			var  s="123";
			alert(s+1);  //1231
			alert(parseInt(s)+1);   //124
		</script>
	</head>
	<body>
	</body>
</html>

parselnt函数