JavaScript 基础(四)【函数】

1 函数

应用场景:当某些事件触发时才执行的代码块。
程序的语句是按顺序执行的,如果我们需要在满足某些条件或发生某些事件时执行,就需要使用函数。

1.1 定义

函数是能实现一定功能的代码块
作用:对事件做出响应,可重复执行
声明:function关键字

1.2 调用

使用函数名称+括号的方式调用;
方式:

程序中直接调用: test();

元素上调用:<button onclick="change()">点我</button>

程序中添加事件绑定

function test(){
	alert('hans')
}
function test1(){
	alert('test1')
}

var pTag = document.getElementById('change_color');
pTag.onclick=test;
//pTag.οnclick=test1;
pTag.addEventListener('click',test);
pTag.addEventListener('click',test1);

on绑定和addEventListener绑定的区别:
on只能绑定一个函数,后者会覆盖前者;addEventListener可以绑定多个函数,程序依次执行。

1.3 参数

参数就是调用函数时传给函数的数据
实例:计算器功能,输入两个数字,输出它们的和;
调用函数的时候需要给函数传入两个数字,函数接收这两个数字,然后输出他们的和

function sum(x,y){
	console.log(x+y);
}
sum(3,4);
用来接收参数的x,y称为形参,调用时传入的34称为实参

Arguments对象,可以获取传入的所有参数
参数和变量没有本质区别
上述例子可以不用参数来实现

1.4 返回值

有些函数执行后会计算出一些数据,我们可以使用return将数据返回,供以后使用return 语句,将值返回调用它的地方

function sum(x, y) {
	var z = x + y;
	return z;
}
var aa = sum(3, 4);
alert(aa);

1.5 变量作用域和生命周期

全局作用域,局部作用域,块级作用域,循环作用域
Var
全局变量:从声明到关闭页面
局部作用域:从声明到函数执行结束
Let
块级作用域:在指定块的作用域之外无法访问的变量,它存在于
1、函数内部
2、{}之间的块区域内
循环作用域:只在当前循环内部有效
作用域链:子对象会一级一级向上寻找所有父对象的变量,反之不行。

1.6 函数种类

1.6.1 声明函数

使用function关键字声明,使用函数名称加括号调用
函数提升:可以吧函数放在调用后面(执行代码之前会先读取函数声明)
例如:function my(){} 就是声名函数
注意:如果函数名称重复,下面的函数会覆盖上面的

1.6.2 匿名函数

函数如果没有名字,就是匿名函数。
匿名函数不能直接调用。
1、通过变量调用
把匿名函数赋给一个变量,通过变量调用来调用匿名函数

var a = (function(){});
a();

2、直接调用(也叫自调用函数或者立即函数)
两种写法:

(function(){}());
(function(){})();

1.6.3 函数表达式

在使用之前必须先赋值

var obj = function(){
	alert("a")
}
obj();

1.6.4 拓展(回调函数、闭包函数)

1、回调函数
函数作为参数调用

//函数声明,fn是一个参数同时又是一个变量
function f1(fn){
	fn(); //函数调用--说明fn这个变量中存储的是一个函数
}
function f2(){
	console.log("函数可以作为参数使用")}
f1(f2); //调用f1,将f2作为参数传进去
//结果:函数可以作为参数使用

2、闭包函数
闭包是一个可以读取其他函数内部变量的函数

//例1
function fn(){
	n = 100;
	function fn1() {
		console.log(n);
	}
	return fn1;
}
var result = fn();
result(); //100
//例2
function fn(){
	n = 100;
	nadd = function(){
		n += 1;
	}
	function fn1() {
		console.log(n);
	}
	return fn1;
}
var result = fn();
result(); //100
nadd();
result(); //101

闭包的优缺点:
可以读取其他函数内部的变量,并让这些值永远保存在内存中;但是它会携带包含他函数的作用域,因此占的内存会比较多

1.7 This指向

This关键字指向当前对象,谁调用函数,this就指向谁

发布了23 篇原创文章 · 获赞 51 · 访问量 1109

猜你喜欢

转载自blog.csdn.net/xqainyo/article/details/105191694