第3讲 JavaScript编程基础

对象的组成 属性——数据 方法——函数 分类 内建对象——包含了浏览器的各成分描述 用户对象——根据用户需要创建，扩大 JavaScript的应用范围
对象的引用

引用JavaScript内建对象 由浏览器环境提供，引用浏览器对象 创建用户对象 引用对象必须存在
自定义对象

示例


示例1 JavaScript1.html 示例2 JavaScript2.html Sample.js(被JavaScript2.html调用)
注意事项


JavaScript要区分大小写 换行符是一个完整的语句结束标志，若要将 几行放在一行中，语句之间用分号隔开 注释方法是//或者/*……*/
流程控制（3）



for循环语句 for(循环变量初始值；循环条件；循环变 量增量) {循环体语句} continue和break continue——结束本次循环，进入下次循 环 break——结束整个循环 示例 见函数部分示例
函数


语法 function 函数名（形参表） { 函数体； return 表达式或者return ； } 如果使用return ;表示函数不返回任何 值，对应于C语言或Java语言中函数的 类型为void 示例三 function1.htm


计算过程: Setval：将用户按键数字连接到输入串 的尾部，并判断这是第几个数，存入相 应变量 SetOpr：将用户按键的运算符连接到 输入串的尾部 Compute：利用系统函数eval()计算 表达式的值 Clear：清除输入框内容 示例ex14.htm
对象的基本概念


事件示例





示例一 Ex9.htm（单击事件） 示例二 Ex10.htm（加载和释放事件） 示例三 Ex11.htm(鼠标事件) 示例四 Ex12.htm(焦点事件) 示例五 Ex13.htm(Change事件)
综合示例

设计一个简单计算器 数字键<input type=button value=“1” onClick=“SetVal(„1‟)”> 功能键:<input type=button value=“+” onClick=“SetOpr(„+‟)”> 显示结果的文本框:<input type=text value=“” name=OutText>
第3讲
JavaScript编程基础
本讲内容



脚本语言 概念 编程基础 运算符 流程 函数 事件 对象 概念 自定义对象
基本概念

JavaScript 嵌入在HTML文件中的脚本语言，基于对 象和事件驱动，能对用户事件做出反应并 进行处理

特点 简单性——高度简化了的JAVA语言 基于对象(无类和继承) 可移植性——可以在大多数浏览器上不需 修改直接运行 动态性——是DHTML的一个十分重要的部 分，是设计交互式动态、特别是“客户端 动态”页面的重要工具
事件处理

概念 事件(Events)——对计算机进行一定的操 作得到的结果 事件驱动(Event Driver)——由鼠标或热 键引发的一连串程序的动作 事件处理程序(Event Handker)——对事 件处理的程序或函数
常用事件
事件名 Click Load UnLoad MouseOver MouseOut MouseMov e submit Blur Focus Select Change 引发事件的对象 button,radio,checkbox,l ink等元素 HTML的body元素 HTML的body元素 Link Link Link form text text Radio,checkbox,select Text,select等 说明 单击了表单元素或超链接 在浏览器中加载页面 退出当前页面 鼠标移到超链接上 鼠标移离开链接上 鼠标移在超链接上移动 用户提交了表单 失去输入焦点 获得输入焦点 用户在表单上进行了选择 用户选择发生改变 事件处理名 OnClick OnLoad onUnload OnMouseOver OnMouseOut OnMouseMove OnSubmit OnBlur OnFocus OnSelect OnChange

步骤 定义对象的方法成员 定义对象的构造函数 包含每个属性成员的定义和初始化


构造函数 函数名就是对象名 使用关键字this为对象的属性成员和方法 成员初始化 每个对象都必须定义构造函数 示例 Ex15.htm(定义对象)
使用对象

步骤 用new创建对象实例 var 对象实例名=new 对象名(实参表); 如： var book1=new book(“语文”,”集体 编”,“清华”,”1999”,1000) ; 注意：实参表与形参表的对应关系 引用对象。引用格式是 对象实例名.属性成员名；//引用属性成员 对象实例名.方法成员名；//引用方法成员 如： book_name=; book1.print();
class
else for in new return this var
const
extends function instanceof null short throw void
continue
false goto int package static throws while
default
final if inteface private super transient with
数据类型

数值型 整数:八进制以0开头，十六进制以0X开头 浮点数

逻辑型 true——真 ,false——假

字符型 用单引号’’或双引号””括起来的任意 长度的字符串 “\”是转义字符 \n——换行符 \t——水平制表符 \r——回车符 \b——退格符
常量和变量
Do
Finally Implements Long Protected Switch True
运算符（算术）

算术运算符
运算 符 + 操 作 加 法 示例
* / %
减 法
乘 法 除 法 求 余 3./2=1.5,3/2=1.5 4%3=1,4.%3=(错误，只有整数相除才有 余数)
运算符(二)


将JavaScript程序嵌入HTML程序的方法
在HTML程序中用: <script language=“JavaScript”> 脚本内容 </script> 将JavaScript程序以”.js”单独存放，在HTML中 用 <script src=“JavaScript 文件名”> </script> 有利于多个HTML文件共享JavaScript程序

while循环语句 循环变量初始化； while(循环条件) {循环体语句体；循环变量增量}
流程控制(2)

Switch语句 语法 Switch(一般是整形常量) { Case 常量1:语句体1;break; Case 常量2:语句体2;break; …… Case 常量n:语句体n;break; Default:语句体n }




在函数内用var定义的是局部变量 在函数外用var定义的是全局变量 在函数内没有用var定义的是全局变量 在函数内用var定义变量与全局变量同名时， 当作两个完全不同的变量 示例五 Function3.htm
流程控制的示例



示例六 Function4.htm(使用if语句猜数字) 示例七 Function5.htm（用for循环找数字） 示例八 Function6.htm(switch语句的使用)
赋值运算符 关系运算符 逻辑运算符

如果有a=1,b=2,c=3 则a<b<c=1,c>b>a=0 因此，要表达b在a和c之间，只能写成 a<b&&b<c

位运算符 这些运算符的操作与C语言或Java语言中是完全一 样的。
流程控制（1）

条件控制语句 if(条件) {语句体1} else {语句体2}

变量命名规则 必须以字母开头 只能由字母、数字、下划线组成 长度不能超过1行 不能使用保留字 字母区分大小写
javaScript的保留字
abstract boolean break byte case Catch
char
double float import native public synchronize d try
JavaScript与Java的区别
Java是Sun公司推出的新一代完全面向对 象的程序设计语言，支持类和继承，主要 应用于网络程序设计 JavaScript只是基于对象，主要用于编 写网页中的脚本 Java程序是编译后以类的形式存放在服务 器上，浏览器下载后用Java虚拟机去执行 JavaScript的源代码无须编译，由能处 理JavaScript语言的浏览器对网页中的 JavaScript源代码进行识别、解释并执 行
注意事项



函数定义的位置 最好在HTML文件的头部 ，也可以在任何 位置 函数参数 可以有多个形参，不必有相同多的实参(使 用默认参数) JavaScript中的系统变量 arguments.length保存了调用者给出的 实参个数 示例四 Function2.htm
变量作用域