一.JavaScript中的函数
1.函数的概念:函数是重复执行的代码块或是由事件驱动重复执行的代码块
2.函数的定义:语法格式:fuction 函数的名称(){函数体}
(1)匿名函数的定义及调用:注意:如果我们只定义函数,并没有调用函数,则函数本身是不会执行的
(自己调用)
<script type="text/javascript">
// (1)匿名函数
// Function(参数 1,参数 2,......,参数 n){函数的主体语句}
var myFunction=function(){
// 定义函数
document.write('这是一个没有名称的匿名函数');
}
// 调用函数
myFunction();//----调用函数的正确方式
alert(myFunction());//----该方式先获取到unifined,再输出内容
alert(myFunction);//----该方法错误,直接输出了函数的整体内容
alert(typeof myFunction);//----该方法直接输出了该函数的数据类型为Function
</script>
匿名函数的调用;(事件驱动方式)
<body>
<button id="btn">点击1</button>
<script type="text/javascript">
var btn1=document.getElementById('btn');
btn1.onclick=btn;
btn1.onclick=function(){//点击事件驱动匿名函数执行
alert('你调用了匿名函数');
}
</script>
</body>
(2) 有名称的函数及调用方式
自己调用
<script type="text/javascript">
function myFunction(){
document.write('这是一个有名称的函数');
}
myFunction();//----自己调用
</script>
事件驱动调用
<body>
<button id="btn">点击1</button>
<script type="text/javascript">
//通过事件驱动调用有名称的函数
var btn1=document.getElementById('btn');
btn1.onclick=btn; //直接调用函数的名称就行,不需要添加括号
function btn(){ //创建了一个触发点击事件后要执行的行为(函数)
alert('你调用了有名称的函数');
}
</script>
</body>
二.JavaScript中的参数
(2) 带有参数的函数调用方式
参数分为形参和实参:[定义函数时的参数叫做形参; 调用函数时的参数叫做实参]
1,定义一个带有参数的函数
语法格式:function 函数名称(参数1,参数2....){函数体}
案例1
<script type="text/javascript">
//1,定义一个带有参数的函数
// function 函数名称(参数1,参数2....){函数体}
function num1(a){//定义一个函数----形参
document.write(a);
}
num1(6);//实参
function num(a,b){
document.write(a+b);
}
num(2,5);
document.write('<br/>')
num('2','5');
</script>
案例2: 用户手动输入两个数字,判断两个数字的大小,如果a>b,则返回1,否则返回-1,相等返回0 使用函数解决问题
<script type="text/javascript">
var mess1=prompt('请输入第一个数');
var mess2=prompt('请输入第二个数');
var num1=parseFloat(mess1);
var num2=parseFloat(mess2);
function NumberBJ(num1,num2){
if(num1>num2){
document.write(1);
}else if(num1==num2){
document.write(0);
}else{
document.write(-1);
}
}
NumberBJ(num1,num2);
</script>
1,定义一个带有返回值的函数
案例1
<script type="text/javascript">
var a=2,b=3;
function test(a1,b1){
return a+b;
}
// var sum=(a+b);
var sum=test(a,b);
alert(sum);
</script>
案例2 比较两个数字的大小,a>b返回1,否则返回-1,相等则返回0
<script type="text/javascript">
var mess1=prompt('请输入第一个数字');
var mess2=prompt('请输入第二个数字');
var a=parseFloat(mess1);
var b=parseFloat(mess2);
function bj(a,b){
if(a>b){
return 1;
}else if(a<b){
return -1;
}else{
return 0;
}
}
var end=bj(a,b);
alert(end);
</script>
二.JavaScript中的变量:
1.全局变量:
案例
<script type="text/javascript">
window.onload=function(){
var name='李xx';
var age=18;
var add='西安'
function mymess1(){
document.write('我是第一个全局变量name为'+name);
}
mymess1();
function mymess2(name1){
document.write('我是第二个全局变量name'+name);
}
document.write('<br/>');
mymess2(name);
function mymess3(name2){
document.write('我是第三个全局变量name'+name);
}
document.write('<br/>');
mymess3(name);
function mymess4(name3){
document.write('我是第四个全局变量age'+age);
}
document.write('<br/>');
mymess4(age);
function mymess5(name4){
document.write('我是第四个全局变量age'+age);
}
document.write('<br/>');
mymess5(age);
function mymess6(mess5){
document.write('我是第五个全局变量add'+add);
}
document.write('<br/>');
mymess6(add);
}
</script>
2.局部变量:涉及全局变量和局部变量.在一个函数体中将一个局部变量转换为全局变量 只需要将这个函数体中的定义变量的关键字var去掉
案例1:输出结果为:使用test2函数访问test1函数中的变量num10
<script type="text/javascript">
window.onload=function(){
function test1(){
// var num=10;
num=10;//在一个函数体中将一个局部变量转换为全局变量 只需要将这个函数体中的定义变脸搞得关键字var去掉
}
function test2(){
document.write('使用test2函数访问test1函数中的变量num'+num);
}
test1();
test2();
}
</script>
案例2:直接定义一个全局变量
<script type="text/javascript">
window.onload=function(){
var num1;
function test1(){
num1=10;
}
function test2(){
document.write('使用test2函数访问test1函数中的变量num'+num1);
}
test1();
test2();
}
</script>