函数
函数是一个可重用的代码块,用来完成某个特定功能。每当需要反复执行一段代码时,可以利用函数来避免重复书写相同代码。
函数包含着的代码只能在函数被调用时才会执行,就可以避免页面载入时执行该脚本
在JavaScript中,可以使用以下三种方法来定义一个函数
使用function语句定义函数
使用Function()构造函数来定义函数
在表达式中定义函数
Function构造函数定义函数
var 函数名 = new Function(“参数1”,”参数2”,”参数3”……”函数体”);
注意:
- 在使用Function()构造函数的时候,第一个字母要大写
- Function()构造函数只能在JavaScript 1.1或更高版本中使用
- 每次调用构造函数时都会解析函数体,并且创建一个新的函数对象,效率非常底
function语句定义函数function 函数名 (参数1,参数2……[形参]){ <语句块> return 返回值 }
function关键字:用于定义一个函数
函数名:函数名通常是一个合法的标识符,是唯一的,区分大小写的
参数:在函数里,可以有0个或者多个参数。如果有多个参数,参数与参数之间要用逗号隔开。无论函数是否有参数,小括号必需要有
函数体:用大括号括起来的代码块,即函数的主体
返回值:函数返回的值由关键字return完成,可选项
在表达式中直接定义函数var 函数名 = function (参数1,参数2,…){函数体};
注意:
在表达式中定义函数的方法只能在JS1.2版本或以上版本中使用
函数名()
函数名/变量名var rightKey=function(){ if(event.button==2){ alert("禁止使用鼠标右键"); } } window.onmousedown = rightKey;
调用函数
1.直接调用myFunction();或window.myFunction()
2.事件处理中调用
<div onclick="myFunction()"></div>
3.将函数的返回值赋给变量
var t = myFunction();
函数的参数
形參:定义函数时,函数名后面()中的参数;JavaScript中的函数允许给行参赋初始值
实参:调用函数时,传递的参数
参数的匹配:
默认情况下,形參和实参是一一对应的
但是当传递的参数个数与函数定义好的参数个数可以不匹配当不匹配时
如果传递的参数个数小于函数定义的参数个数,JavaScript会自动将多余的参数值设为undefined;
如果传递的参数个数大于函数定义的参数个数,那么多余传递的参数将会被忽略掉。
获取所有实参【arguments】function Test(a,b){ alert(typeof(arguments)); // 获得类型 alert(arguments[1]); // 获取下标为1的参数值 alert(arguments.length); // 获取参数的长度 alert(arguments.callee); // 获取函数的所有内容 } Test("zhang","li");
默认参数
JavaScript中的函数允许给参数赋初始值
比如:我们在创建封装一个创建table表格的函数,如4果任何参数不传,我们也想创建一个四行五列,并且背景颜色,各行换色的表格,这时候我们就可以使用表格来创建
案例:创建一个带默认参数的函数function tab(row,color='pink',color2='gray'){ document.write('<table border="1" width="500">'); for(var index = 0; index < row; index++){ if(index%2 == 1){ document.write('<tr bgcolor="'+color+'"><td>'+index +'</td><td>1</td><td>1</td><td>1</td><td>1</td></tr>'); }else{ document.write('<tr bgcolor="'+color2+'"><td>'+index +'</td><td>1</td><td>1</td><td>1</td><td>1</td></tr>'); } } document.write('</table>'); } tab(10,'gray','orange');
函数的返回值
return语句并不是必须的
默认情况下,函数的返回值为undefined
在使用 return 语句时,函数会停止执行,并返回指定的值,return后面的代码不再执行
什么情况下添加return:
如果函数中的变量要在函数外进行调用
函数体的结果需要在函数外进行使用
变量的作用域
全局变量:
在函数外声明的的变量为全局,在整个JS文档中生效
局部变量:
在函数内用var声明的变量为局部变量,只能在函数内部使用。
全局变局部
全局变量可以在局部的任意位置使用
局部变全局
局部变量不能在全局使用,如果想要在全局使用,可以去除前边的var或者将该值使用return返回到全局
块级作用域【ES6中新增的内容】
什么是作用域链【了解】
只要在js中创建变量,就会存在作用域【全局作用域】
写在函数内部的被称为局部作用域
如果函数中还有函数,那么在这个作用域中就又可以诞生一个新的作用域
在函数中如果在当前作用域中没有查到值,就会向上级作用域去查,直到查到全局作用域,这样一个查找过程形成的链条就叫做作用域链。
默认情况下:内部环境可以通过作用域链访问所有外部环境,但外部环境不能访问内部环境的任何变量和函数var n = 10; function outer(){ function inner(){ function center(){ console.log(n); } center(); } inner(); var n = 15; } outer(); //=> undefined
预解析
预解析,又称之为变量提升,在js代码真正执行之前,进行提前加载,把所有带有var和function的关键字进行预解析
JavaScipt代码是由浏览器中的JavaScript解析器来执行的
JavaScript解析器在运行JavaScript代码的时候分为两步:预解析和代码执行
预解析分为变量预解析(变量提升)和函数预解析(函数提升)
代码执行是按代码的书写顺序从上到下执行的
对于带有var和function关键字在预解释的时候操作
var :只声明不定义
function:既声明又定义
注:私有作用域下也要进行预解析
预解析只发生在当前的作用域下
就是当文档加载的时候,开始只对window进行预解析,函数执行的时候才会对里面的代码进行预解析console.log(a); // 注意:预解析的问题,如果同时有变量和函数的预解析,那么函数的优先级高 var a = 'hello'; function a(){ console.log(123); } // 优先执行栈内存中的内容 // function a(){ // console.log(123); // } // var a = 'hello'; // console.log(a); // hello