项目17—JAVASCRIPT设计案例

教学方法教学目标教学重点教学难点教学过程项目十七JAVASCRIPT程序设计案例教学目标1、掌握JavaScript变量、表达式和运算符的使用2、掌握JavaScript对话框的使用3、掌握JavaScript函数的定义及调用4、掌握JavaScript分支结构程序设计5、掌握JavaScript循环结构程序设计下一页上一页教学方法教学目标教学重点教学难点教学过程项目十七JAVASCRIPT程序设计案例教学重点1、掌握JavaScript函数的定义及调用2、掌握JavaScript分支结构程序设计3、掌握JavaScript循环结构程序设计下一页上一页教学方法教学目标教学重点教学难点教学过程项目十七JAVASCRIPT程序设计案例教学难点1、掌握JavaScript分支结构程序设计2、掌握JavaScript循环结构程序设计下一页上一页教学方法教学目标教学重点教学难点教学过程项目十七JAVASCRIPT程序设计案例教学方法1、项目工程互动式教学法2、“讲、学、观察”相结合下一页上一页教学方法教学目标教学重点教学难点教学过程项目十七JAVASCRIPT程序设计案例一、JavaScript变量、表达式和运算符1、程序案例1－显示年龄scriptlanguage=javascriptvarname;//声明变量namevarage;//声明变量agename=张三;//把字符串张三存储到变量name中age=20;//把整数20存储到变量age中document.write(name);//将变量name的值显示在页面上document.write(的年龄是:);//在页面上输出的年龄是:document.write(age);//将变量age的值显示在页面上/script下一页上一页变量的主要作用是存取数据、提供存放信息的容器。变量命名：以字母开头，中间可以出现数字及下划线。在JavaScript中有四种基本的数据类型：数值、字符串型、布尔型和空值。教学方法教学目标教学重点教学难点教学过程项目十七JAVASCRIPT程序设计案例2、程序案例2－税额计算scriptlanguage=javascriptvarlist,rate=0.05,paid=105,tax;//list:标价;rate:税率;paid:付款额;tax:税额list=paid/(1+rate);//标价=付款额/(1+税率)tax=paid-list;document.writeln(标价=+list);document.writeln(税额=+tax);/script下一页上一页JavaScript表达式其实就是变量、常量和运算符的集合，分为算术表达、赋值表达式以及布尔表达式等。运算符是完成操作的一系列符号，在JavaScript中有算术运算符、比较运算符、逻辑布尔运算符、字符串运算等。教学方法教学目标教学重点教学难点教学过程项目十七JAVASCRIPT程序设计案例二、JavaScript对话框1、警示对话框程序案例scriptlanguage=javascriptalert(欢迎浏览本页面！);/script下一页上一页alert函数：显示一个警告对话框，包括一个OK按钮。教学方法教学目标教学重点教学难点教学过程项目十七JAVASCRIPT程序设计案例2、确认对话框程序案例scriptlanguage=javascriptvarvisited,show_text;visited=confirm(您来过湖北职院吗？);show_text=visited?您也认为湖北职院很美吧！:欢迎您有机会来湖北职院参观!;document.write(show_text);/script下一页上一页confirm函数：显示一个确认对话框，包括“确定”、“取消”按钮。当按下”确定”按钮，返回“true”，按下“取消”按钮，返回“false”。教学方法教学目标教学重点教学难点教学过程项目十七JAVASCRIPT程序设计案例3、提示对话框程序案例scriptlanguage=javascriptvarname;name=prompt(请输入您的姓名:,);document.write(尊敬的+name+：欢迎您进入我的主页！);/script下一页上一页prompt函数：显示一个输入对话框，提示等待用户输入。教学方法教学目标教学重点教学难点教学过程项目十七JAVASCRIPT程序设计案例三、JavaScript函数的定义及调用1、程序案例1－素数判断scriptlanguage=javascriptfunctionIsPrime(p){if(p1)returnfalse;vari;for(i=2;ip;i++)if(p%i==0)returnfalse;returntrue;}varx;x=parseInt(prompt(请输入1-100之间的数字,1));alert(该数是否为素数：+IsPrime(x));/script下一页上一页通常在进行一个复杂的程序设计时，总是根据所要完成的功能，将程序划分为一些相对独立的部分，每部分编写一个函数。JavaScript函数定义格式：Function函数名（参数,变元）{函数体;.Return表达式;}教学方法教学目标教学重点教学难点教学过程项目十七JAVASCRIPT程序设计案例2、程序案例2－局部变量和全局变量scriptlanguage=javascriptfunctionfirst(p,q){p=p*2;b=b+1;varc=100;document.writeln(P的值为：,p,br);document.writeln(a的值为：,a,br);document.writeln(b的值为：,b,br);document.writeln(c的值为：,c,br);}vara=1,b=2,c=3;first(a,b);document.writeln(a的值为：,a,br);document.writeln(b的值为：,b,br);document.writeln(c的值为：,c,br);/script下一页上一页在JavaScript中同样有全局变量和局部变量。全局变量是定义在所有函数体之外，其作用范围是整个函数；而局部变量是定义在函数体之内，只对其该函数是可见的，而对其它函数则是不可见的教学方法教学目标教学重点教学难点教学过程项目十七JAVASCRIPT程序设计案例四：JavaScript分支结构程序设计1、分支结构程序案例1－两个数排序scriptlanguage=javascriptvarx,y,temp;x=parseFloat(prompt(请输入x的值：,0));y=parseFloat(prompt(请输入y的值：,0));if(xy){temp=x;x=y;y=temp;}document.writeln(排序后,x=+x+;y=+y);/script下一页上一页分支结构：用来指明两种程序流方向，在程序中创建一个交叉点（像岔路）。若表达式为true，则执行if语句内部程序段；否则不执行内部程序段，执行if语句后面的语句。教学方法教学目标教学重点教学难点教学过程项目十七JAVASCRIPT程序设计案例2、分支结构程序案例2－常识问答scriptlanguage=javascriptvaranswer;answer=prompt(中国的首都在哪个城市?\nA.香港\tB.广州\tC.北京\tD.上海,E);switch(answer){caseA:alert(错！香港是中国的特别特政区);break;caseB:alert(错！广州是中国南部的大都市);break;caseC:alert(对！北京是中国的首都，在中国北方);break;caseD:alert(错！上海是中国东部的大都市);break;default:alert(选择错误!只能选填字母A、B、C或D);break;}/script下一页上一页从第一个case子句开始，判断case标签和(控制表达式)的值是否匹配，如果匹配则运行该case子句的语句段，然后break。随后，switch语句将结束。假如任何一个(控制表达式)值都不等于case标签的值，就运行可选标签default之下的语句。教学方法教学目标教学重点教学难点教学过程项目十七JAVASCRIPT程序设计案例五、JavaScript循环结构程序设计1、循环结构程序案例1－求1+2+3+…+100的累计和scriptlanguage=javascriptvari,sum=0;for(i=1;i=100;i++){sum+=i;}document.write(1+2+3+...+100=+sum);/script下一页上一页使用循环结构来指明当某些条件保持为真时要重复的动作。当控制语句的条件得到满足时（通常在某些迭代的特定数字后），控制跳过循环结构传递到下条语句For循环语句基本格式：for（初始化；条件；增量）{语句集；}教学方法教学目标教学重点教学难点教学过程项目十七JAVASCRIPT程序设计案例2、循环结构程序案例2－二位整数相加的测试程序scriptlanguage=javascriptvargo_on,x,y,result,answer;do{x=Math.floor(Math.random()*90)+10;y=Math.floor(Math.random()*90)+10;result=x+y;answer=parseFloat(prompt(x+++y+=,0));go_on=confirm(((answer==result)?答对:答错)+！\t继续测试吗?)}while(go_on)/script下一页上一页do…while循环基本格式：do{语句集；}while（条件）先运行一次循环体内的语句，再判断条件是否为真，如果为真则重复循环体，否则退出循环。该语句适合事先不知道循环次数的情况。教学方法教学目标教学重点教学难点教学过程项目十七JAVASCRIPT程序设计案例【小结】通过这次课的学习，同学们熟悉了JavaScript变量、表达式和运算符，理解了JavaScript对话框的使用，掌握了JavaScript函数的定义及调用，掌握了分支结构的JavaScript程序设计，掌握了循环结构的JavaScript程序设计。【作业】课后习题第1、4题下一页上一页谢谢！