第一章概述和基本语法_第1页
第一章概述和基本语法_第2页
第一章概述和基本语法_第3页
第一章概述和基本语法_第4页
第一章概述和基本语法_第5页
已阅读5页,还剩49页未读 继续免费阅读

付费下载

下载本文档

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

OracleJavaEE实训教材系列之三JavaScript网页开发技术课程目标掌握JavaScript的语法、程序控制结构熟练使用JavaScript内置基本对象熟悉JavaScript调用DHTML元素掌握用JavaScript编写客户端脚本程序的技能能使用JavaScript创建功能强大的互动网页课程内容第1章:JavaScript概述和基础语法第2章:JavaScript内置对象:String,Array,Date,Math,RegExp对象第3张:JavaScript类、继承、闭包、回调函数第4章:JavaScriptDHTML对象:Window对象、对话框及定时器第5章:Document对象,事件处理:Document对象及事件处理第一章JavaScript概述

和基础语法本章内容JavaScript介绍JavaScript基本语法JavaScript数据类型数据类型分类数字类型字符串类型类型转换JavaScript运算符JavaScript变量与函数JavaScript控制语句概念及发展历史JavaScript是一种网页编程技术,大部分使用者将它用于创建动态交互网页JavaScript是一种基于对象和事件驱动的解释性脚本语言,具有与Java和C语言类似的语法JavaScript是一种使用简单,功能强大的编程语言发展历史网景公司在Netscape2.0首先推出了JavaScript微软公司从IE3.0开始提供对客户端JavaScript的支持,并另取名为JScript微软公司从IIS3.0开始提供对服务器端JScript的支持微软推出JScript.NET,基于.NET框架的JScript具备了和C#.NET和VB.NET一样强大的功能入门案例展示本练习主要针对事件驱动和基于对象,该例子在网页的一个按钮中设置了onclick属性,当鼠标单击该按钮时,将会弹出一个窗口,浏览google搜索网站window是客户端JavaScript中浏览器对象之一,open是window对象的一个方法,意思是打开窗口,在参数中设置好网址,就可以打开指定的网站。在将来学习DHTML的时候将会详细讲解window对象的使用方法打开记事本,将以下代码输入,保存为D:\hello.htm<html><body><inputtype="button"onclick=“window.open('')”value="浏览Google网站"></body></html>保存好以后双击该文件打开,试一试单击按钮后运行的结果特点简单易用简洁易用,与Java有类似的语法可以使用任何文本编辑工具编写只需要浏览器就可以执行程序解释执行事先不编译逐行执行无需进行严格的变量声明基于对象内置大量现成对象,编写少量程序可以完成目标使用范围适合做哪些事情客户端数据计算客户端表单合法性验证浏览器对象的调用浏览器事件的触发网页特殊显示效果制作不适合做哪些事情大型应用程序图像、多媒体处理网络实时通讯应用JavaScript与Java的区别JavaScript与Java运行方式不一样JavaScript是解释执行Java是编译执行JavaScript不是Java的简化版本逻辑运算符、语句结构类似变量申明、对象调用等不同JavaScript和Java功能实现不一样JavaScript通过浏览器实现程序功能Java通过Java虚拟机实现程序功能<scripttype=“text/javascript”><!--/*程序功能:书写方法说明开始和结束的标志的书写方法单行和多行JavaScript注释的写法*/functionsayhello(){ //在HTML文档中显示hello document.write("hello");}sayhello();--></script>直接嵌入式在网页中直接嵌入JavaScript脚本开始声明HTML注释JavaScript多行注释JavaScript单行注释脚本结束声明语句结尾文件调用式在网页中调用独立JavaScript文件<scripttype=“text/javascript”src="test1-3.js"></script><!--functionsayhello(){ //在HTML文档中显示hello document.write("hellofromjs");}sayhello();-->JS脚本文件中不需要脚本开始和结束声明HTML文件,建议使用type(新)而非language(旧)JavaScript运行环境的介绍在Windows、Linux、Unix操作系统都可以运行JavaScript,只要安装了支持JavaScript的浏览器不同的浏览器甚至同一浏览器的不同版本对JavaScript的支持程度都不一样大部分常见的浏览器都对JavaScript提供支持,在本教程中以IE作为主要的调试运行环境大小写敏感性在HTML中大小写是不敏感的,但是在JavaScript程序中大小写是敏感的HTML都是大小写不敏感的标准的JavaScript语法定义中是区分大小写<inputtype=buttonid="HelloBtn"value="play"onClick="myclick()"><scripttype=“text/javascript”>functionmyclick(){

HelloBtn.value="pause";}</script>大小写须一致换行与空格换行、分号空格、TABa=1;b=2;a=1b=2{a=1;b=2;}{ a=1; b=2;}==有换行,分号允许不加提倡加上空格或TAB增强程序可读性a=1;b=2;=推荐加上分号减少错误和歧义的发生常量与标识符常量直接在程序中出现的数据值标识符由不以数字开头的字母、数字、下划线(_)、美元符号($)组成常用于表示函数、变量等的名称例如:_abc,$abc,abc,abc123是标识符,而1abc不是JavaScript语言中代表特定含义的词称为保留字,不允许程序再定义为标识符常量与标识符ECMAv3标准保留的JavaScript的关键字breakcasecatchcontinuedefaultdeletedoelsefalsefinallyforfunctionifininstanceofnewnullreturnswitchthisthrowtruetrytypeofvarvoidwhilewith常量与标识符使用范例<scripttype=“text/javascript”><!--function

SayHello(){

varhellostr="您好"; document.write(hellostr);}SayHello();--></script>function、var是保留字SayHello是自定义标识符字符串常量数据类型分类JavaScript数据类型基本类型特殊类型组合类型Number:数字String:字符串Boolean:布尔Null:空Undefined:未定义Array:数组Object:对象数字类型简介最基本的数据类型不区分整型数值和浮点型数值所有数字都采用64位浮点格式存储,相当于Java和C语言中的double格式能表示的最大值是±1.7976931348623157x10308

能表示的最小值是±5x10-324

数字类型整数在JavaScript中10进制的整数由数字的序列组成精确表达的范围是

-9007199254740992(-253)到9007199254740992(253)超出范围的整数,精确度将受影响浮点数使用小数点记录数据例如:3.4,5.6使用指数记录数据例如:4.3e23=4.3x1023数字类型16进制和8进制数的表达16进制数据前面加上0x,八进制前面加016进制数是由0-9,A-F等16个字符组成8进制数由0-7等8个数字组成16进制和8进制与2进制的换算16进制:0xF3D410进制:624202进制:

11110011110101008进制:01717242进制:1111001111010100String数据类型简介是由Unicode字符、数字、标点符号组成的序列字符串常量首尾由单引号或双引号括起JavaScript中没有字符类型常用特殊字符在字符串中的表达字符串中部分特殊字符必须加上右划线\常用的转义字符换行单引号双引号右划线\n\'\"\\String数据类型//测试特殊字符的书写varaa="\u4f60\u597d\n欢迎来到\"JavaScript世界\"";alert(aa);

String数据类型的使用特殊字符的使用方法和效果Unicode的插入方法你好换行Boolean数据类型简介Boolean类型仅有两个值:true和false,也代表1和0,实际运算中true=1,false=0布尔值也可以看作1/0对应true/falseBoolean值主要用于JavaScript的控制语句,例如:if(x==1){ y=y+1;}else{ y=y-1;}Null、Undefined简介Null在程序中代表变量没有值

或者不是一个对象Undefined代表变量的值尚未指定

或者对象属性根本不存在Null、Undefined有趣的比较比较结果null与空字符串不相等,null代表什么也没有,空字符串则代表一个为空的字符串null与false不相等,但是!null等于truenull与0不相等,但是在C++等其他语言中是相等的null与undefined相等,但是null与undefined并不相同数据类型转换JavaScript属于松散类型的程序语言变量在声明的时候并不需要指定数据类型变量只有在赋值的时候才会确定数据类型表达式中包含不同类型数据则在计算过程中会强制进行类别转换数字+字符串:数字转换为字符串数字+布尔值:true转换为1,false转换为0字符串+布尔值:布尔值转换为字符串true或false数据类型转换强制类型转换函数函数parseInt:强制转换成整数例如parseInt("6.12")=6函数parseFloat:强制转换成浮点数例如parseFloat("6.12")=6.12函数eval:将字符串强制转换为表达式并返回结果例如eval("1+1")=2,eval("1<2")=true数据类型转换类型查询函数函数typeof:查询数值当前类型

(string/number/boolean/object)例如typeof("test"+3)="string",typeof(null)="object"算术运算符加(+)、减(-)、乘(*)、除(/)、余数(%)加、减、乘、除、余数和数学中的运算方法一样例如:9/2=4.5,4*5=20,9%2=1-除了可以表示减号还可以表示负号例如:x=-y+除了可以表示加法运算还可以用于字符串的连接例如:"abc"+"def"="abcdef"算术运算符递增(++)、递减(--)假如x=2,那么x++表达式执行后的值为3,x--表达式执行后的值为1i++相当于i=i+1,i--相当于i=i-1递增和递减可以放在变量前也可以放在变量后逻辑运算符等于(==)、不等于(!=)、大于(>)、小于(<)

大于等于(>=)、小于等于(<=)与(&&)、或(||)、非(!)运算规则与或

1&&1=11||1=1 !1=01&&0=01||0=1 !0=10&&0=00||0=0位运算符左移(<<)、 右移(>>)3<<2=12左移2位后补01100001112>>1=6右移1位前补000110110位运算符位与(&)、位或(|)、异或(^)1&2=0位与运算1000010000001|2=3位或运算1000010011001^2=2异或运算010000000100指定运算符赋值=JavaScript中=代表赋值,两个等号==表示相等例如,x=1表示给x赋值为1if(x==1){...}程序表示当x与1相等时配合其他运算符形成的简化表达式oP=

例如i+=1相当于i=i+1,x&=y相当于x=x&y运算符优先顺序按照右表从上到下的优先顺序执行运算符描述()括号++、--、-、~、!一元运算符*、/、%乘法、除法、取模+、-、+加法、减法、字符串连接<<、>>、>>>移位<、<=、>、>=小于、小于等于、大于、大于等于==、!=、===、!==等于、不等于、恒等、不恒等&按位与^按位异或|按位或&&逻辑与||逻辑或?:条件运算符=、oP=赋值、运算赋值变量的声明与使用变量申明语句vara;varx,y;变量赋值语句a=1;x="hello,howareyou!";y=x;变量的调用…alert(a);document.write("Tom,"+x);…允许一次定义多个变量不需要指定变量类型赋值为数值赋值为字符串赋值为另一个变量函数的声明与使用函数的定义

function函数名(参数){

函数体; return返回值;}功能说明可以使用变量、常量或表达式作为函数调用的参数函数由关键字function定义函数名的定义规则与标识符一致,大小写是敏感的返回值必须使用return函数的声明与使用使用范例<scripttype=“text/javascript”>/*Sayhello是定义的函数名,前面必须加上function和空格*/functionSayHello(){ varhellostr; varmyname=prompt("请问您贵姓?","陈"); hellostr="您好,"+myname+'先生,欢迎进入"探索之旅"!'; alert(hellostr); document.write(hellostr);}//这里是对前面定义的函数进行调用SayHello();</script>在调用函数的时候要注意函数的大小写,如果写成sayhello或sayHello都会出错if选择控制语句if-else基本格式if(表达式){语句1;......}else{语句2;.....}功能说明如果表达式的值为true则执行语句1,否则执行语句2表达式语句1truefalse语句2if选择控制语句程序范例varx=(newDate()).getDay();//获取今天的星期值,0为星期天vary;if((x==6)||(x==0)){ y="周末";}else{ y="工作日";}alert(y);if语句允许不使用else子句y="工作日";if((x==6)||(x==0)){ y="周末";}等价于if选择控制语句if语句嵌套格式if(表达式1){

语句1;}elseif(表达式2){

语句2;}elseif(表达式3){

语句3;}else{

语句4;}功能说明执行顺序参见右图表达式1表达式2表达式3语句1语句2语句3语句4truetruetruefalsefalsefalseif选择控制语句程序范例对变量x的值进行判断,采用if语句嵌套转换成相应的星期名称if(x==1){ y="星期一";}elseif(x==2){ y="星期二";...}elseif(x==6){ y="星期六";}elseif(x==0){ y="星期日";}else{ y="未定义";}if语句允许进行嵌套switch选择控制语句switch基本格式switch(表达式){ case值1:语句1;break; case值2:语句2;break; case值3:语句3;break; default:语句4;}功能说明详细的计算过程参考右图case值1case值2语句1语句2truetruefalse表达式case值2语句3truefalse语句4falseswitch选择控制语句程序范例对变量x的值进行判断,采用switch转换成相应的星期名称switch(x){case1:y="星期一";break;case2:y="星期二";break;case3:y="星期三";break;case4:y="星期四";break;case5:y="星期五";break;case6:y="星期六";break;case7:y="星期日";break;default:y="未定义";}swith比elseif结构更加简洁清晰for循环控制语句for循环基本格式for(初始化;条件;增量){

语句1; ...}功能说明实现条件循环,当条件成立时,执行语句1,否则跳出循环体条件语句1增量falsetrue初始化for循环控制语句程序范例for(vari=1;i<=7;i++){ document.write("<H"+i+">hello</H"+i+">

"); document.write("<br>");}//循环输出H1到H7的字体大小while循环控制语句while循环基本格式while(条件){语句1;...}功能说明运行功能和for类似,当条件成立循环执行语句花括号{}内的语句,否则跳出循环条件语句1falsetrue初始化while循环控制语句程序范例vari=1;while(i<=7){ document.write("<H"+i+">hell

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论