《JavaScript与jQuery网页前端开发与设计-第2版》 教案 第3--5章 JavaScript数据类型与运算符； JavaScript语句与函数； JavaScript BOM和DOM.doc

《JavaScript与jQuery网页前端开发与设计-第2版》教案

第3章JavaScript数据类型与运算符

一、教学目标：

掌握JavaScript的基本数据类型与对象类型；

掌握JavaScript类型转换方法；

掌握JavaScript运算符的使用。

二、教学重点和难点：

重点：JavaScript的基本数据类型与对象类型；

难点：JavaScript类型转换方法。

三、教学方法与手段：

采取互动式教学方法，理论教学使用多媒体投影教室。

四、课程简介：

本章主要内容是JavaScript基础知识，包括JavaScript的使用、语法、变量等内容。基本数据类型、对象、类型转换、运算符、条件和循环语句、函数、DOM与BOM的用法。

五、教学基本内容：

3.1JavaScript基本数据类型

JavaScript有五种原始类型分别是：Number（数字）、Boolean（布尔值）、String（字符串）、Null（空值）和Undefined（未定义）。

JavaScript提供了typeof方法用于检测变量的数据类型，该方法会根据变量本身的数据类型给出对应名称的返回值。语法格式如下：

typeof变量名称

对于指定的变量使用typeof方法，其返回值是提示数据类型的文本内容。常见有5种情况如表3-1所示。

表3-SEQ表4-\*ARABIC1typeof方法的常见返回值一览表

返回值

示例

解释

undefined

varx;

alert(x);

该变量未赋值。

boolean

varx=true;

alert(x);

该变量为布尔值。

string

varx=Hello;

alert(x);

该变量为字符串。

number

varx=3.14;

alert(x);

该变量为数值。

object

varx=null;

alert(x);

该变量为空值null或对象。

3.1.1Undefined类型

所有Undefined类型的输出值都是undefined。当需要输出的变量从未声明过，或者使用关键词var声明过但是从未进行赋值时会显示undefined字样。例如：

alert(y);//返回值为undefined，因为变量y之前从未使用关键词var进行声明

或

varx;

alert(x);//返回值也是undefined，因为未给变量x进行赋值

【例3-1】JavaScript基础数据类型Undefined的简单应用

【代码说明】

本示例使用关键词var声明了变量msg，但未对其进行初始赋值就直接使用alert(msg)方法要求在对话框中显示该变量内容。由图可见，此时显示出来的结果为undefined。

3.1.2Null类型

null值表示变量的内容为空，可用于初始化变量，或者清空已经赋值的变量。例如：

varx=99;

x=null;

alert(x);//此时返回值是null而不是99

【例3-2】JavaScript基础数据类型Null的简单应用

【代码说明】

本示例使用关键词var声明了变量msg并对其赋值为null，然后使用alert(msg)方法要求在对话框中显示该变量内容。由图可见，此时显示出来的结果为null。

3.1.3String类型

在JavaScript中String类型用于存储文本内容，又称为字符串类型。为变量进行字符串赋值时需要使用引号(单引号或双引号均可)括住文本内容。例如：

varcountry=China;

或

varcountry=China;

与JavaScript不同的是，在Java中使用单引号声明单个字符，使用双引号声明字符串。而在JavaScript中没有区分单个字符和字符串，因此两种声明方式任选一种都是有效的。

如果字符串内容本身也需要带上引号，则用于包围字符串的引号不可以和文本内容中的引号相同。例如字符串本身如果带有双引号，则使用单引号包围字符串；反之亦然。例如：

vardialog=Todayisagift,thatiswhyitiscalledPresent.;

或

vardialog=Todayisagift,thatiswhyitiscalledPresent.;

此时字符串内部的引号会默认保留字面的样式。

String对象中包含了一系列方法，常用方法如表3-2所示。

表3-SEQ表4-\*ARABIC2JavaScriptString对象常见方法一览

方法名

解释

charAt()

返回指定位置上的字符。

charCodeAt()

返回指定位置上的字符Unicode编码。

concat()

连接字符串。

index