动态网页脚本语言JavaScript课件PPT.ppt
《动态网页脚本语言JavaScript课件PPT.ppt》由会员分享,可在线阅读,更多相关《动态网页脚本语言JavaScript课件PPT.ppt(133页珍藏版)》请在冰豆网上搜索。
![动态网页脚本语言JavaScript课件PPT.ppt](https://file1.bdocx.com/fileroot1/2022-10/6/c8c79a5e-9959-496b-9521-cd626e3ae9a6/c8c79a5e-9959-496b-9521-cd626e3ae9a61.gif)
1,动态网页脚本语言JavaScript,主要内容概述编程基础面向对象的基本概念内置对象浏览器窗口对象,1,2,JavaScript是由Netscape公司开发的一种跨平台,面向对象(object-oriented)的网页脚本语言(WebScriptLanguage),是目前流行的网页特效设计语言。
JavaScript代码可直接嵌入HTML文件中,随网页一起传送到客户端浏览器,然后通过浏览器来解释执行。
JavaScript概述,2,3,什么是JavaScript脚本语言?
(1)脚本语言(ScriptingLanguage)?
由ASCII码构成,可直接用任何的文本编辑器开发完成。
是一种不必事先编译,只要利用适当的解释器(Interpreter)就可以执行的简单的解释式程序。
(2)JavaScript?
JavaScript是由Netscape公司开发的一种跨平台,纯面向对象(object-oriented)式的网页式脚本语言(WebScriptLanguage)。
JavaScript代码可直接嵌入HTML文件中,随网页一起传送到客户端浏览器,然后通过浏览器的解释器来解释执行。
JavaScript概述,3,4,脚本编写语言基于对象的语言简单性动态性跨平台,2.JavaScript的特点,JavaScript概述,4,5,制作网页特效提供表单前端验证窗口动态操作提高系统工作效率,3.JavaScript的功能,JavaScript概述,5,6,在HTML标记中直接写入JavaScript代码例:
鼠标移过来运行,4.在HTML文档中嵌入JavaScript代码,JavaScript概述,6,7,将JavaScript代码放入标记符中例如:
document.write(欢迎您学习JavaScript!
);运行,4.在HTML文档中嵌入JavaScript代码,JavaScript概述,7,8,将代码独立存储为以.js为扩展名的文件,利用SRC属性将该文件调入例如:
welcome.js文件内容如下:
document.write(欢迎您学习JavaScript!
);,4.在HTML文档中嵌入JavaScript代码,JavaScript概述,举例,8,9,document.write();varA=UppercaseA;document.write(A);document.write(UppercaseA);document.write();document.write(gv=+A+);,9,10,为避免某些浏览器不完全支持JavaScript,而造成错误,可将JavaScript代码用注释语句括起来例如:
4.在HTML文档中嵌入JavaScript代码,JavaScript概述,10,11,数值型(Number):
包含整数或浮点数。
布尔型(Logical):
取值为true或false。
1,0字符型(String):
用单引号或双引号括起来的零个或多个的字符或数字所组成。
空类型(null):
表示没有值,取唯一值”null”,大小写敏感。
注:
null不能写成Null或NULL。
null既不等于“0”,也不等于“空字符串”。
因为“0”是数值,“空字符串”是字符串。
1.数据类型,JavaScript编程基础,11,12,自动数据类型转换如果表达式中用(+)运算符,且其中一个操作数为字符串,另一个操作数为数值时,JavaScript自动将数值转成字符串。
例如:
varx=”我今年”+18;结果:
x=“我今年18”varx=”15”+8结果:
x=158vary=15+8;结果:
y=23如果表达式中用了其它运算符,JavaScript自动将字符串转成数值。
例如:
varx=”30”/5;结果:
x=6vary=”15”-“8”;结果:
y=7举例,2.数据类型转换,JavaScript编程基础,12,13,数据类型转换函数eval(字符串):
将字符串参数转换成相应的数值,例如:
y=eval(“15”)+8;结果:
y=23parseInt(字符串,底数):
将字符串转换成指定底数的数值。
parseFloat(字符串):
将字符串转换成浮点数值。
举例,2.数据类型转换,JavaScript编程基础,13,14,3.变量,JavaScript编程基础,变量命名以字母或下划线开头(不能以数字开头),后面接数字、字母或下划线。
变量名区分大小写。
不能用系统保留字和特殊符号作为变量例:
varA=UppercaseA;vara=Lowercasea;document.write(A);document.write();document.write(a);,14,15,3.变量,JavaScript编程基础,变量的声明变量声明时,不必定义类型,所有类型均由小写的var声明。
例如:
varname;(JavaScript自动给出一个未定义值)varname,sex;(JavaScript自动给出一个未定义值)varname=”张永”,sex=”女生”;(二变量均为字符串),15,16,3.变量,JavaScript编程基础,变量的作用域:
全局变量(Globalvariable)局部变量(Localvariable)vargv=JavaScript;/gv是全局变量functiontest()varlv=VBScript;/lv是局部变量document.write(gv=+gv+);document.write(lv=+lv+);test();document.write(document的输出:
);document.write(gv=+gv+);document.write(lv=+lv+);举例,16,17,4.常量,JavaScript编程基础,字符串常量:
(StringLiterals)一般字符串常量:
,“”特殊字符的字符串常量布尔常量:
(BooleanLiterals):
true或false1,0数值型:
整数常量(IntegersLiterals)浮点常量(Floating-PointLiterals),17,18,5.运算符与表达式,JavaScript编程基础,赋值运算符,x+=y等价于x=x+yx%=y等价于x=x%y,18,19,5.运算符与表达式,JavaScript编程基础,比较运算符举例,19,20,5.运算符与表达式,JavaScript编程基础,算术运算符举例,20,21,5.运算符与表达式,JavaScript编程基础,逻辑运算符a&b:
逻辑与(AND),若a,b都是ture,则结果为ture。
a|b:
逻辑或(OR),若a,b任一是ture,则结果为ture。
!
a:
逻辑非(NOT),若a是ture,则结果为false。
21,22,5.运算符与表达式,JavaScript编程基础,字符串运算符(Stringoperators)f)条件运算符(?
)格式:
条件表达式?
值1:
值2如果条件表达式的结果是ture,返回值1,否则返回值2。
vara,b;max=ab?
a:
b,举例,22,23,5.运算符与表达式,JavaScript编程基础,g)typeof:
用来判断操作数的类型格式:
typeof操作数或typeof(操作数)举例,23,24,属性对象类型:
方法对象实例对象实例名.属性对象实例名.方法如:
窗口p102,JavaScript编程基础,24,25,5.运算符与表达式,JavaScript编程基础,h)new:
定义对象实例。
语法:
对象实例名=new对象类型(参数)例如:
myArray=newArray(3)this:
代表当前对象,因此用在不同的地方,就有不同的结果。
this.属性this.方法举例,25,26,6.程序控制流程,JavaScript编程基础,选择结构,if语句else语句,if语句组else语句组,if语句组elseif语句组else语句组,举例,26,27,6.程序控制流程,JavaScript编程基础,b)Switch结构,switch()case:
;break;case:
;break;default:
;,27,28,6.程序控制流程,JavaScript编程基础,循环结构,while()语句组,vari=5;while(i0)document.write(i=i);i-;例,28,29,6.程序控制流程,JavaScript编程基础,循环结构,vari=5;dodocument.write(i=,i,);i-;while(i0)例,do语句或语句组while(),29,30,6.程序控制流程,JavaScript编程基础,循环结构,for(初始值;条件;增量),for(vari=5;i0;i-)document.write(i=,i,);,30,31,6.程序控制流程,JavaScript编程基础,循环结构,for(iinar)document.write(,ari,);例1,for(变量in对象),31,32,6.程序控制流程,JavaScript编程基础,C)With语句,with(),document.write(限时抢购物品:
);document.write(ViewSonic17显示器。
);document.write(EPSON打印机。
);,with(document)write(限时抢购物品:
);write(ViewSonic17显示器。
);write(EPSON打印机。
);例1,32,33,6.程序控制流程,JavaScript编程基础,注释语句,/*/,33,34,JavaScript包含两类函数:
系统函数用户自定义函数,7.JavaScript函数,JavaScript编程基础,34,35,1)编码函数功能:
将字符串中非文字、数字字符(如&,%,#,空格符)转成相对应的ASCII值。
语法:
escape(字符串)2)译码函数功能:
与escape()相反,将ASCII值转回ASCII字符.语法:
unescape(ASCII值)3)求值函数功能:
通常有两个用途,一个用作字符串的运算,另一个用来指出操作对象。
语法:
eval(字符串表达式),JavaScript编程基础,35,36,4)数值判断函数功能:
判断变量的值是否为数值,“NaN”代表“NotaNumber”,若返回值为true,则表示自变量不是数值。
语法:
isNaN(测试值)举例:
varx=15,y=黄雅玲;document.write(x不是数值吗?
isNaN(x);document.write(y不是数值吗?
isNaN(y);执行结果:
x不是数值吗?
falsey不是数值吗?
True,JavaScript编程基础,举例,36,37,5)转成整数函数功能:
将字符串转换成指定底数的数值。
格式:
parseInt(字符串,底数)举例:
x=parseInt(“27”,8),JavaScript编程基础,37,38,6)转成浮点函数功能:
将字符串转成浮点数值。
格式:
parseFloat(字符串)举例:
document.write(parseFloat(3.123456),);,JavaScript编程基础,举例,38,39,7)用户自定义函数,function函数名(参数1,参数2,)return,定义函数的注意事项:
易于识别功能模块化放置在程序开始部分例1例2,JavaScript编程基础,39,40,函数定义的一般形式,定义无参函数的一般形式为:
类型标识符函数名()声明部分语句部分函数名();,40,41,定义有参函数的一般形式为:
类型标识符函数名(形式参数表列)声明部分语句部分函数名(实际参数表列);,41,42,函数参数和函数的值,形式参数和实际参数,形式参数:
函数名后面括号中的变量名称为“形式参数”