韩顺平_轻松搞定网页设计(html+css+javascript)_第26讲_js函数调用过程内存分析_js函数细节_学习笔记_源代码图解_PPT文档整理

文西马龙:http://blog.csdn.net/wenximalong/

函数(方法)——如何理解

如何理解方法这个概念,给大家举个通俗的示例:

拉灯同志给特工小组下达命令:去炸XXX,特工小组返回结果
程序员调用方法:给方法必要的输入,方法返回结果

函数——调用过程
为了让大家更好的理解函数调用过程,给大家画一个示意图, ★★★这个很重要★★★,这里可以简单介绍一下递归。

函数——return语句
return 表达式;

递归,下面的js代码会输出什么
function abc(num1){
if(num>3){
abc(--num1);
}
document.writeln(num1);
}
abc(5);

demo1.html

<html>
	<head>
		<script language="javascript">
			// abc是一个函数,它接收数值
			function abc(num1){
				if(num1>3){
					abc(--num1); //递归
				}
				document.writeln(num1);
			}
			abc(5);
		</script>
	</head>
	<body></body>
</html>

先复习下:++和--
b=++a;先自加,然后再赋值;
b=a++;先赋值,然后再自加;

当开始执行abc(5);
js函数的调用过程,内存分析:

js引擎也有堆栈概念,也有代码区。

分析图:(图片太大,在新网页中打开图片,看的更加完整)


★★★★★具体分析:★★★★★

步骤1、在主栈区,存放着程序代码,当执行到函数abc(5);的时候,一旦执行函数abc(5);,就开辟了新栈:新栈(1)


步骤2、在新栈(1),函数abc(5);给num1传了一个值,即num1=5;①,然后执行②if(num1)>3成立,接着执行③abc(--num1);,--num1,则先自减再赋值,原先num1=5,现在num1=4,因为执行函数③abc(--num1);,又开辟了新栈:新栈(2)

注:函数调用规范,开辟新栈,是操作系统定的,不要太纠结细节,知道一旦执行函数,就要开辟新栈即可。


步骤3、在新栈(2),num1传值4,即num1=4;⑤,然后执行⑥if(num1)>3成立,接着执行⑦abc(--num1);,--num1,则先自减再赋值,原先num1=4,现在num1=3,因为执行函数⑦abc(--num1);,又开辟了新栈:新栈(3)


步骤4、在新栈(3),num1传值3,即num1=3;⑨,然后执行①〇if(num1)>3,不成立,跳出if语句,然后执行①②document.writeln(num1);,打印输出当前的num1的值,3。document.writeln(num1);执行完毕后,这个栈:新栈(3)就被销毁了被系统回收了。没的去了,只能原路返回,退回到新栈(2)


步骤5、在新栈(2),函数⑦abc(--num1);已经被执行完毕,然后执行⑧document.writeln(num1);此时的num1,因为--num1,这num1的值为3了(虽然新栈(2)刚开始的时候num1的值为4,但是经过了--num1,别搞乱了),所以输出3。document.writeln(num1);执行完毕后,这个栈:新栈(2)就被销毁了被系统回收了。没的去了,只能原路返回,退回到新栈(1)


步骤6、、在新栈(1),函数③abc(--num1);已经被执行完毕,然后执行④document.writeln(num1);此时的num1,因为--num1,这num1的值为4了(虽然新栈(1)刚开始的时候num1的值为5,但是经过了--num1,别搞乱了),所以输出4。document.writeln(num1);执行完毕后,这个栈:新栈(2)就被销毁了被系统回收了。没的去了,只能原路返回,退回到主栈。
至此:函数abc(5);就执行完毕,然后系统接着执行abc(5);下面的代码……

程序依次打印输出:3 3 4。上面的分析,虽然啰嗦,但是尽可能的讲明白了。自己画图走一遍,就理解的更深了。对执行函数时,就要开辟新栈,新栈执行完毕后,就要被销毁,然后退回。

函数——深入使用
①函数的参数列表可以是多个
②函数列表可以是多个,并且数据类型可以是任意的类
③js支持参数个数可变的函数

④js支持创建动态函数

<html>
	<head>
		<script language="javascript">
			//编写一个函数,可以接受任意多个数,并计算他们的和
			function abc(n1){
				//在js中有一个arguments,可以访问所以传入值
				//打印参数的个数
				//window.alert(arguments.length);
				//既然能得到参数的个数,就用for循环遍历,参数具体的值
				//遍历所有的参数

				for(var i=0;i<arguments.length;i++){
					window.alert(arguments[i]);
				}
			}
			abc(4,3,5);
		</script>
	</head>
	<body></body>
</html>

注:
(1)javascript是弱数据类型语言
(2)特别强调一下,js的函数天然支持可变参数。对③,javascript天然支持可变,之所以天然支持可变,和语言本身的特点是有关系的,因为它是动态语言,它在执行的瞬间才去判读

(3)javascript不支持重载


 韩顺平_php从入门到精通_视频教程_学习笔记_源代码图解_PPT文档整理_目录


  • 0
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值