JavaScript函数

最新推荐文章于 2023-01-11 13:07:58 发布

Survivor_lll

最新推荐文章于 2023-01-11 13:07:58 发布

阅读量230

点赞数

文章标签： JavaScript

本文链接：https://blog.csdn.net/a_lllll/article/details/84801112

版权

函数的简介

所谓函数就是指在程序设计中，可以将一段经常使用的代码“封装”起来，在需要的时候直接调用，这种“封装”叫函数。

函数的概念

函数就是重复执行的代码片。

或者说函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块

JavaScript 中的函数语法结构

使用关键字 function 定义一个函数

function 函数的名称(){
	函数的主体
}

<script type="text/javascript">
//语法结构:function 函数名称(){函数体}
//实现DJ这个函数
			function DJ(){
			alert('啊啊啊啊啊！我被触发了');
		}
</script>
<!-- 这里是一条华丽丽的分割线 -->
<body>
	<!--在点击是调用了一个函数名称为DJ的函数-->
	<button onclick="DJ();">点击我</button>
	<button onclick="DJ();">再点击我试试看</button>
</body>

函数的定义与执行

常用的函数有两种：

（1）不指定函数的名称/匿名函数；

//语法：
function(参数 1,参数 2,......,参数 n){
//函数的主体语句
}

<script type="text/javascript">
//无函数名称的加载事件：由事件驱动onload	来执行重复的代码块（匿名的函数）
    //网页事件直接调用函数
	window.onload=function(){
		alert('加载事件驱动了一个匿名函数');
	//函数之中嵌套函数
		//把函数直接直接赋值给变量
		var myFunction=function(){
			alert('你调用了一个匿名函数');
		}
	//调用这个函数
		//alert(myFunction());	这个调用有问题		会先输出函数中的主体，然后返回undefined。
		//alert(myFunction());	
		
		//myFunction();		这个调用正确
		//因为不能将函数当成一个值输出，只有这种形式才能调用，从而执行函数体
		myFunction();
		//alert(typeof myFunction);		//显示结果为function类型（一种复杂的数据类型）
				
	}
</script>

注意：如果我们只定义函数，并没有调用函数，则函数本身是不会执行的

（2）值定函数的名称

指定函数名的函数定义是应用最广泛，也是最常用的方法。

//语法格式
function 函数名(参数值1,参数值2...){
    return 表达式; 	//函数体
}

说明：

1.function为关键字，在此用来定义函数

2.函数名必须是唯一的，要通俗易懂

3.函数可以使用 return 语句将某个值返回，也可以没有返回值。参数是可选的，可以不带参数，也可以带多个参

数。如果是多个参数的话，参数之间要用英文逗号隔开。

带有参数的函数及调用方式

函数参数主要是为了提高函数的灵活性和可重要性。

在定义函数方法是，函数名后面的圆括号中的变量名称为“形参”。

在使用函数，函数名后面的圆括号中的为“实参”。

也就是，定义函数时的参数叫“形参”，调用函数时的参数叫“实参”。

定义函数的格式

function 函数名称（形参1，形参2...）{
    函数体
}

如果定义的函数有参数，调用该函数的语法格式如下：

函数名（实参1，实参2...）

注意

在未调用函数时，形参并不占用存储单元。

实参可以是常量，变量或表达式，形参必须是声明的变量。

实参对形参的数据传递是单向传递，即只能由实参传给形参。

实例

//定义一个有参数的函数
function test(a){		//形参
		document.write(a);
}
test(20);				//实参
//定义多个参数的函数
function test1(a,b,c){
	document.writeln(a+b+c);	//形参与实参必须对应
}
test1(20,2,11);			//显示结果为33
		
		//定义函数时的参数叫“形参”，调用函数时的参数叫“实参”。

例题

用户手动输入两个数字,判断两个数字的大小,如果a>b,则返回1,否则返回-1,相等返回0 使用函数解决问题

			var mess1=prompt('请输入第一个数字:');
			var mess2=prompt('请输入第二个数字:');
			var num1=parseFloat(mess1);
			var num2=parseFloat(mess2);
			function NumberBj(num1,num2){
				if(num1>num2){
					document.write(1);
				}else if(num1==num2){
					document.write(0);
				}else{
					document.write(-1);
				}
			}
			NumberBj(num1,num2);

函数返回值

有时，我们会希望函数将值返回调用它的地方、通过使用 return 语句就可以实现。在使用 return 语句时，函数会

停止执行，并返回指定的值

//带有返回值:使用关键字 return
var X=prompt('请输入第一个数值：');
var Y=prompt('请输入第一个数值：');
var x=parseFloat(X);	//将字符串类型转换为数字类型
var y=parseFloat(Y);
function test(x,y){	//形参
		return x+y;	//+:决定它作用的是实参
//		document.write(x+y);
	}
//	test(x,y);		//实参
	var sum=test(x,y);
	alert(sum);

例题

比较两个数字的大小,a>b返回1,否则返回-1,相等则返回0

var a=prompt('请输入第一个数值：');
var b=prompt('请输入第一个数值：');
function test2(a,b){
if(a>b){
	return 1;
}else if(a<b){
	return -1;
}else{
	return 0;
}
}
var num=test2(a,b);
alert(num);

函数中’return’关键字的作用：

1、返回函数执行的结果

2、结束函数的运行

3、阻止默认行为

函数的调用

①事件驱动的方式进行调用函数

②自己调用

<body>
	<!--通过事件驱动来调用函数look()-->
		<div onclick="look();"></div>
		<button id="dj">点我吧</button>
		<script type="text/javascript">
			function look(){
				alert('看着我看着我');
			}
			look();
			var dj1=document.getElementById('dj');		//获取页面元素
//			dj1.onclick=function(){			//点击事件驱动匿名函数执行
//				alert('哈哈哈，你点击我了');
//			};
			//dj1.onclick=函数(有名称的函数/匿名函数)
			dj1.onclick=dj;					//直接调用函数的名称就行,不需要添加括号
			function dj(){					//创建了一个触发点击事件后要执行的行为(函数)
				alert('点击调用有名的函数');
			}
		</script>
	</body>

全局变量

在整个程序中,所有的函数都可以访问到的一个变量,或者是写在对象底下的变量

可以在整个HTML文档范围中使用的变量，这种便利通常都是在函数体外定义的变量，省略关键字var声明的变量，无论是在函数体内还是函数体外，都是全局变量。

全局变量在整个页面中可见，并在页面任何位置被允许访问。

//	全局变量:在整个程序中,所有的函数都可以访问到的一个变量,或者是写在对象底下的变量
			window.onload=function(){
				//变量/字段: 用来存储数据
				var name='一只咪';
				var age=18;
				var job='软件开发';
				function myTest1(){
					document.write('我是第一个函数调用变量name为'+name);
				}
				myTest1();
//				function myTest1(name1){
//					document.write('我是第一个函数调用变量name为'+name1);
//				}
//				myTest1(name);
				function myTest2(){
					document.write('我是第二个函数也可以调用变量name为'+name);
				}
				myTest2();
				//注: 以上两个函数都可以访问变量name的值,所以把name 称之为全局变量
			}

局部变量

只能在局部范围内使用的变量，这种变量通常都是在函数体内定义的变量，所以只能在函数体内有效。

局部变量只在指定的函数内可见，函数外不可见，也不允许访问。局部变量又称私有变量。

window.onload=function(){
//				var num1;  //定义为全局变量
				function test1(){					
//					var num1=20;
					//转换为全局变量:去掉var关键字
//					num1=20;
					num1=20;
				}
				function test2(){
					document.write('使用test2函数访问 test1函数中的变量num1='+num1);
				}
				test1();
				test2();  //在调用test2函数的时候,访问test1中的变量num1无效,原因是num1作用于test1函数				
				//在一个函数体中如何将一个局部变量转换为全局变量?
				//注: 只需要将这个函数体中的定义变脸搞得关键字var 去掉
			}

Survivor_lll

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JavaScript函数

函数的简介所谓函数就是指在程序设计中，可以将一段经常使用的代码“封装”起来，在需要的时候直接调用，这种“封装”叫函数。函数的概念函数就是重复执行的代码片。或者说函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块JavaScript 中的函数语法结构使用关键字 function 定义一个函数function 函数的名称(){ 函数的主体}&amp;amp;lt;script type=...
复制链接

扫一扫