第2讲_JavaScript简要教程

重邮软件学院技能教育中心JavaScript简要教程解绍词[e-mail]重邮软件学院技能教育中心课程内容JavaScript基本语法基于对象的JavaScript语言使用内部对象系统窗口及输入输出Web页面信息交互51234重邮软件学院技能教育中心1JavaScript基本语法JavaScript背景概述JavaScript加入Web的方式JavaScript基本数据类型JavaScript程序构成1.11.21.31.4重邮软件学院技能教育中心1.1JavaScript背景概述Javascript是一种由Netscape的LiveScript发展而来的脚本语言，主要目的是为了解决服务器端语言，比如Perl，遗留的速度问题。当时服务端需要对数据进行验证，由于网络速度相当缓慢,只有28.8kbps，验证步骤浪费的时间太多。于是Netscape的浏览器Navigator加入了Javascript，提供了在客户端进行数据验证的基本功能。重邮软件学院技能教育中心1.1JavaScript背景概述归纳来讲，JavaScript是一种基于对象和事件驱动并具有安全性能的跨平台脚本语言，由Web浏览器解释执行。使用它的目的是与HTML语言一起实现与Web客户交互作用，从而可以开发客户端的应用程序等。它是通过嵌入或调入在标准的HTML语言中实现的。它的出现弥补了HTML语言的缺陷。重邮软件学院技能教育中心1.1JavaScript背景概述一般来讲，JavaScript属于网站前台设计人员的技术。网站前台设计的人员一般还熟悉HTML、CSS等网页展示、布局等相关技术。近年来，Ajax（AsynchronousJavaScriptAndXML）技术被广泛使用，它改进了传统的Web应用，给浏览者一种更连续的体验。其中，JavaScript是Ajax技术的编程脚本，充当了非常重要的角色。重邮软件学院技能教育中心1.2JavaScript加入Web的方式Javascript加入网页有两种方法：1、直接加入HTML文档这是最常用的方法，大部分含有Javascript的网页都采用这种方法，如：scriptlanguage=Javascriptalert(这是第一个JavaScript例子!);/script重邮软件学院技能教育中心1.2JavaScript加入Web的方式2、引用方式如果已经存在一个Javascript源文件（以js为扩展名），则可以采用这种引用的方式，以提高程序代码的利用率。其基本格式如下：scriptsrc=urllanguage=Javascript/script其中的url就是程序文件的地址。同样的，这样的语句可以放在HTML文档头部或主体的任何部分。重邮软件学院技能教育中心1.3JavaScript基本数据类型1、常量（1）整型常量JavaScript的常量通常又称字面常量，它是不能改变的数据。其整型常量可以使用十六进制、八进制和十进制表示其值。（2）实型常量实型常量是由整数部分加小数部分表示，如12.32、193.98。可以使用科学或标准方法表示：5E7、4e5等。重邮软件学院技能教育中心1.3JavaScript基本数据类型（3）布尔值布尔常量只有两种状态：true或false。它主要用来说明或代表一种状态或标志，以说明操作流程。（4）字符型常量使用单引号（‘）或双引号（“）括起来的一个或几个字符。如ThisisabookofJavaScript、3245、ewrt234234等。重邮软件学院技能教育中心1.3JavaScript基本数据类型（5）空值JavaScript中有一个空值null,表示什么也没有。如试图引用没有定义的变量,则返回一个null值。（6）特殊字符同Ｃ语言一样，JavaScript中同样以有些以反斜杠（／）开头的不可显示的特殊字符。通常称为控制字符。重邮软件学院技能教育中心1.3JavaScript基本数据类型2、变量（1）变量的命名JavaScript中的变量命名同其计算机语言非常相似，这里要注意以下两点：Ａ、必须是一个有效的变量，即变量以字母开头，中间可以出现数字如test1、text2等。除下划线_作为连字符外，变量名称不能有空格、＋、－、,或其它符号。重邮软件学院技能教育中心1.3JavaScript基本数据类型Ｂ、不能使用JavaScript中的关键字作为变量。在JavaScript中定义了40多个类键字，这些关键是JavaScript内部使用的，不能作为变量的名称。如var、int、double、true不能作为变量的名称。在对变量命名时，最好把变量的意义与其代表的意思对应起来，以免出现错误。重邮软件学院技能教育中心1.3JavaScript基本数据类型（2）变量的类型与赋值在JavaScript中，变量可以用命令var作声明并赋值：varmytest=”Thisisabook”;变量以可以不作声明，而在使用时再根据数据的类型来确其变量的类型。如：x=100;y=“125”;重邮软件学院技能教育中心1.3JavaScript基本数据类型3、运算符（1）算术运算符双目运算符：+（加）、-（减）、*（乘）、/（除）、%（取模）、|（按位或）、&(按位与)、（左移）、（右移）、（右移，零填充）单目运算符：-（取反）、～（取补）、++（递加1）、--（递减1）重邮软件学院技能教育中心1.3JavaScript基本数据类型（2）比较运算符比较运算符它的基本操作过程是，首先对它的操作数进行比较，尔后再返回一个true或False值，有８个比较运算符:(小于)、(大于)、=(小于等于)、=(大于等于)、==(等于)、!=(不等于)重邮软件学院技能教育中心1.3JavaScript基本数据类型（3）布尔逻辑运算符!（取反)、&&（逻辑与）、||（逻辑或）、^（逻辑异或）重邮软件学院技能教育中心1.4JavaScript程序构成1、程序控制流（1）if条件语句基本格式：if（表述式）语句段１；else语句段２；.....重邮软件学院技能教育中心1.4JavaScript程序构成（2）for循环语句基本格式：for（初始化；条件；增量）语句集；如：for(x=1;x10;x++){…..}重邮软件学院技能教育中心1.4JavaScript程序构成（3）while循环语句基本格式：while（条件）语句集；如：x=1;while(x10){…..}重邮软件学院技能教育中心1.4JavaScript程序构成（4）break和continue语句break语句可以跳出所处的循环体，continue可以跳出本次循环，进入下一次循环。重邮软件学院技能教育中心1.4JavaScript程序构成2、函数通常在进行一个复杂的程序设计时，总是根据所要完成的功能，将程序划分为一些相对独立的部分，每部分编写一个函数。从而使各部分充分独立，任务单一，程序清晰，易懂、易读、易维护。JavaScript函数可以封装那些在程序中可能要多次用到的模块。并可作为事件驱动的结果而调用的程序，从而实现一个函数把它与事件驱动相关联。这是与其它语言不一样的地方。重邮软件学院技能教育中心1.4JavaScript程序构成（1）JavaScript函数定义function函数名（参数,变元）{函数体;return表达式;}重邮软件学院技能教育中心1.4JavaScript程序构成说明：函数由关键字function定义。参数表，是传递给函数使用或操作的值，其值可以是常量，变量或其它表达式。使用return将值返回。函数名对大小写是敏感的。重邮软件学院技能教育中心1.4JavaScript程序构成（2）函数中的形式参数在函数的定义中，我们看到函数名后有参数表，这些参数变量可能是一个或几个。那么怎样才能确定参数变量的个数呢？在JavaScript中可通过arguments.Length来检查参数的个数。例：functionfunction_Name(exp1,exp2,exp3,exp4)Number=function_Name.arguments.length;重邮软件学院技能教育中心1.4JavaScript程序构成3、事件驱动及事件处理（1）基本概念JavaScript是采用事件驱动(event-driven)的语言。它是在图形界面的环境下，使得一切输入变化简单化。通常鼠标或热键的动作我们称之为事件（Event），而由鼠标或热键引发的一连串程序的动作，称之为事件驱动（EventDriver）。而对事件进行处理程序或函数，我们称之为事件处理程序（EventHandler）。重邮软件学院技能教育中心1.4JavaScript程序构成（2）事件处理程序在JavaScript中对象事件的处理通常由函数(Function)担任。其基本格式与函数全部一样，可以将前面所介绍的所有函数作为事件处理程序。重邮软件学院技能教育中心1.4JavaScript程序构成（3）事件驱动JavaScript事件驱动中的事件是通过鼠标或热键的动作引发的。它主要有以下几个事件：1）单击事件onClick当用户单击鼠标按钮时，产生onClick事件。同时onClick指定的事件处理程序或代码将被调用执行。重邮软件学院技能教育中心1.4JavaScript程序构成通常在下列基本对象中产生：button（按钮对象）、checkbox（复选框）或（检查列表框）、radio（单选钮）、resetbuttons（重要按钮）、submitbuttons（提交按钮）。见onclick_test.htm。重邮软件学院技能教育中心1.4JavaScript程序构成2）onChange改变事件当利用text或texturea元素输入字符值改变时发该事件，同时当在select表格项中一个选项状态改变后也会引发该事件。见onchange_test.htm。重邮软件学院技能教育中心1.4JavaScript程序构成3）选中事件onSelect当Text或Textarea对象中的文字被加亮后，引发该事件。4）获得焦点事件onFocus当用户单击Text或textarea以及select对象时，产生该事件。此时该对象成为前台对象。重邮软件学院技能教育中心1.4JavaScript程序构成5）失去焦点onBlur当text对象或textarea对象以及select对象不再拥有焦点、而退到后台时，引发该文件，他与onFocas事件是一个对应的关系。6）载入页面onLoad当页面载入时，产生该事件。onLoad一个作用就是在首次载入一个文档时检测cookie的值，并用一个变量为其赋值，使它可以被源代码使用。重邮软件学院技能教育中心1.4JavaScript程序构成7）页面退出onUnload当Web页面退出时引发onUnload事件，并可更新Cookie的状态。重邮软件学院技能教育中心2基于对象的JavaScript语言JavaScript对象的基础知识常用对象简介JavaScript的系统函数2.12.22.3重邮软件学院技能教育中心2.1JavaScript对象的基础知识JavaScript语言是基于对象的（Object-Based），而不是面向对象的（object-oriented）。之所以说它是一门基于对象的语言，主要是因为它没有提供象抽象、继承、重载等有关面向对象语言的许多功能。而是把其它语言所创建的复杂对象统一起来，从而形成一个非常强大的对象系统。重邮软件学院技能教育中心2.1JavaScript对象的基础知识1、对象的基本结构JavaScript中的对象是由属性(properties)和方法(methods)两个基本的元素的构成的。前者是对象信息的装载单位，从而与变量相关联；后者是指对象能够按照设计者的意图而被执行，从而与特定的函数相联。重邮软件学院技能教育中心2.1JavaScript对象的基础知识2、引用对象的途径一个对象要