函数与事件

day05

文章目录

• day05
• • 一·函数的嵌套调用
  • 二：函数定义的另一种表现形式
  • 三：事件和函数的关系
  • • 3·1：事件和函数绑定的两种方式
    • • 3·1·1方式一：在HTML元素中就进行绑定
      • 3·1·2：方式二：通过js获取HTML元素进行绑定
  • 四：各种文本内容的读写：
  • • 4·1：表单内容通过value进行读写
    • 4·2：基本元素通过innerHTML进行读写
  • 五：变量的声明提升
  • 六：变量的作用域
  • • 6·1：全局变量
    • 6·2：局部变量
    • 6·3：作用域链：
  • 七：递归：

一·函数的嵌套调用

主调函数:调用别的函数的函数

被调函数:被别的函数调用的函数

function fun1(){
		console.log("fun1");
	}
	function fun2(){
		fun1();
		console.log("fun2");
	}
	
	function fun3(){
		fun2();
		console.log("fun3");
	}
fun3();

其中从f1到f3被称为压栈。又叫保护现场：入口地址+形参变量+局部变量

从f3到f1的被称为弹栈，又叫恢复现场

断点调试：

通过Call stack清楚的观看压栈和弹栈的过程

二：函数定义的另一种表现形式

匿名函数：

 var fun = function(a,b){
       console.log(a+b);
       }

三：事件和函数的关系

事件：事件的本质就是函数调用； 比方：鼠标的滑动，按压等就是一个事件。

函数：函数就是对事件作出具体反馈映射。

3·1：事件和函数绑定的两种方式

3·1·1方式一：在HTML元素中就进行绑定

【注意事项】: 这种绑定方式，绑定的不是函数的返回值，而是函数对象本身

<button onclick="fun()">点击</button>
//"fun()" == fun
 var fun = function(){
	 	console.log("heihei");
	 }

3·1·2：方式二：通过js获取HTML元素进行绑定

document.getElementById(ID名称):返回HTML元素中ID所对应的元素

<button type="button" id="btn">点击</button>
	var oBtn = document.getElementById("btn");
	oBtn.ondblclick = function(){
	console.log("呵呵");
	}

四：各种文本内容的读写：

4·1：表单内容通过value进行读写

写：

var oTxt1 = document.getElementById("txt1");
	 oTxt1.value = 999;

读：

 console.log(oTxt1.value);

4·2：基本元素通过innerHTML进行读写

写：

var oP = document.getElementById("_p");
	oP.innerHTML = "嘿嘿";

读：

console.log(oP.innerHTML);

五：变量的声明提升

JS会默认的对未被定义而使用的变量进行声明提升，

即就是var a=undefined；（尽可能不要未定义就开始使用）

六：变量的作用域

作用域：不同变量的定义方式,决定了该变量可以在那些范围下可以被使用

6·1：全局变量

概念：没有被任何括号括起来的变量,它的作用域是该文件
它类似于共享单车，谁都能用，并且数值是共享的。

缺陷：1:降低函数的独立性
2:会额外的占用内存

6·2：局部变量

概念：被任意括号括起来的变量，局部变量，作用域是该函数体内，函数体外部不 能使用。（因为该函数执行完就销毁了）

6·3：作用域链：

内部函数可以使用外部函数的变量，反之不行

function father(a){
		var b = 2;
		var son = function(c){
			var d = 4;
			console.log(a,b,c,d);
		}
		// son(3);
		
		console.log(d);
	}
	
	father(1);//X

七：递归：

一个函数直接或者间接的嵌套自己本身

function age(n){
		var c;
		if(n==1){
			c = 10;
		}else{
			c = age(n-1)+2;
		}
		return c;
	}
	console.log(age(5));

一个函数直接或者间接的嵌套自己本身

function age(n){
		var c;
		if(n==1){
			c = 10;
		}else{
			c = age(n-1)+2;
		}
		return c;
	}
	console.log(age(5));