一,JavaScript的函数
函数:代码块或者语句的集合叫函数。
函数包括:自定义函数,系统函数
1,定义函数 关键字:function
语法:
function 函数名(形式参数1,形式参数2,…, 形式参数n){
语句
}
例:width,height使用此函数时,要传递所求的长方形的宽度和高度
functiongetArea(width,height){
varresult=width*height;
document.write("面积为:"+result);
}
2,调用函数
方法:使用函数名称,并且在函数名后用括号包含所需要传入的参数值。
例:宽度3,高度4,长方形面积
<div>
宽度:3,高度:4 的长方形面积:
<scripttype="text/javascript">getArea(3,4)</script>
</div>
效果:
宽度:3,高度:4 的长方形面积: 面积为:12
3,函数的参数
解释:参数是一种变量,但这种变量只能被函数体内的语句使用,并在函数被调用时赋值,通常称为形式参数。
JavaScript中函数参数的特殊性
(1)函数声明了参数,调用时也可以不传递参数,这在C#中是会出现编译错误的。
(2)不管函数声明时有多少个参数,调用函数时可以传递若干个参数值给函数,并且实际传递的参数值还可以在函数内获得。
例:显示各公司的人数和总工资
functiongetTotal(){
varcount;//人数
varsum=0;//总工资
count=arguments.length;
for(vari=0;i<arguments.length;i++){
sum+=arguments[i];
}
document.write("总人数:"+count+",总工资:"+sum);
}
<div>
A公司:
<scripttype="text/javascript">getTotal(2000,4000,1200)</script>
</div>
<div>
B公司:
<scripttype="text/javascript">getTotal(24000,11000)</script>
</div>
效果:
A公司: 总人数:3,总工资:7200
B公司: 总人数:2,总工资:35000
4,函数的返回值
解释:函数的参数是外部语句对函数内部语句的信息传递,函数的返回值刚好相反,能够将一个结果返回给外部语句使用。实现函数返回值的语句是return
语法: return 返回值;
解释:以上语句在函数体内需要返回值时使用,执行到return这条语句后,函数就会停止执行。
语句:var result=函数(参数);
例
// 创建有返回值的函数
functiongetArea(width,height){
varresult=width*height;
returnresult;
}
<div>
调用有返回值的函数
<scripttext/javascript>
vararea=getArea(3,4);
document.write(area);
</script>
</div>
效果:
调用有返回值的函数 12
5,匿名函数
解释:匿名函数就是没有名字的函数,也成为拉姆达函数。
例:使用匿名函数求长方形的面积
<scripttype="text/javascript">
( function(width,height){
document.write("面积是:"+width*height);
})(3,4);
</script>
在JavaScript中,函数也是一种数据类型,成为function类型。
例:
<scripttype="text/javascript">
vararea=function(width,height){
document.write("面积是:"+width*height);
};
area(3,5);
</script>
6,变量的作用域
变量的作用域主要分为全局和局部两种。
全局变量是在函数体外部声明的,可以在任何地方包括函数内部使用。
局部变量是在函数体内声明的,只能在函数体内使用。
局部变量随着函数的结束而消失。
注:如果全局变量和局部变量出现重名的情况,局部变量优先,即无论局部变量的值怎么改变,全局变量的值不会受到影响。
7,系统函数
(1)parseInt
parseInt函数将字符串转化为整数。
它从字符串的开头开始解析,在第一个非整数位置停止解析并返回前面读到的所有整数。
如果字符串不是以整数开头,将返回NaN
parseInt | |
字符串 | 结果 |
“150cats” | 150 |
“cata” | NaN |
“6” | 6 |
“-6” | -6 |
“6.67” | 6 |
(2)parseFloat
parseFloat()函数与parseInt()函数类似,但其返回一个浮点数
ParseFloat | |
字符串 | 结果 |
“ats12” | NaN |
“22cata” | 22 |
“6” | 6 |
“6.56” | 6.56 |
“.67” | 0.67 |
(3)isNaN
isNaN()函数用于判断参数是否为NaN(不是数字)
如果是NaN,isNaN()函数返回true
如果不是NaN,isNaN()函数返回false
IsNaN | |
字符串 | 结果 |
‘123’ | false |
‘2a12’ | true |
‘2.34’ | false |
‘ ’(空格) | false |
‘wh’ | true |
(4)eval()
运行以字符串形式表示的javascript代码串,并返回执行代码串后的结果
例:计算机用户输入在文本框表达式的计算结果
<scripttype="text/javascript">
functioncalc(){
varexpress=document.getElementById("info").value;
varresule=eval(express);
alert("输入文本框表达式的结果是:"+resule);
}
</script>
<body>
<inputtype="text"id="info">
<inputtype="button"id="btn"value="计算"onclick="calc()">
</body>
例:计算输入两个文本框的数字之和。
<scripttype="text/javascript">
functioncalc(){
//根据id属性获取文本后框后,使用其value属性进一步得到内容
varnum1=document.getElementById("txt_1").value;
varnum2=document.getElementById("txt_2").value;
//trim()修剪空格
if(num1.trim() !=""&&num2.trim() !=""){
if(!isNaN(num1) &&!isNaN(num2)){
document.getElementById("resule").value=parseFloat(num1)+parseFloat(num2);
}else{
alert("请输入正确的数值");//弹出消息框
}
}else{
alert("请输入两个操作数");
}
}
</script>
<body>
<inputtype="text"id="txt_1">
+
<inputtype="text"id="txt_2">
=
<inputtype="text"id="resule">
<inputtype="button"value="计算"onclick="calc()"/>
</body>