JavaScript是一种描述性脚本语言,它可以嵌入HTML中并在客户端执行,是动态Web设计的最佳选择,也是浏览器普遍支持的脚本语言。
6.1 JavaScript背景知识
JavaScript是一种解释性的、基于对象的脚本语言。HTML网页在互动性方面能力较弱。JavaScript是一种嵌入到HTML中的描述性语言,它并不编译产生机器代码,只是由浏览器的解释器将其动态地处理成可执行的代码。JavaScript起源于LiveScript语言。当初,使用HTML表单与用户的交互,成了制约网络发展的重大瓶颈。于是Netscape公司推出了LiveScript语言,并最终定名为JavaScript,如今,已经成为Web浏览器中不可缺少的技术。
JavaScript的特点:
它是一种脚本编程语言,采用小程序段的方式实现编程,是一片解释性语言,提供了一个简易的开发过程,与HTML结合在一起,方便用户使用操作;
它是一种基于对象的语言,许多功能可以来自于脚本环境中对象的方法与脚本的相互作用;
它具有简单性,它的基本语句和控制流设计简单而紧凑,它的变量类型采用弱类型;
它是一种安全性语言,不允许任何人访问本地硬盘,不能将数据存放到服务器上,不允许对网络文档进行删除和修改,只能通过浏览器实现信息浏览与互动,从而有效地防止数据丢失。
它是动态的,可以直接对用户的输入作出响应,无须经过Web服务程序。它对用户的反应采用事件驱动的方式。
它具有跨平台性。它依赖于浏览器本身,与操作环境无关。
6.2 JavaScript的描述方法
1、内部引用
在
通常Javascript文件可以使用script标签加载到网页的任何一个地方,但是标准的方式是加载在head标签内。
◎6-1内部引用script.html
2、外部调用文件
将脚本文件保存在外部,通过
一般认为,大量的Javascript代码不应内嵌在HTML文件中,理由如下:
如果怀有恶意的开发者查看了源代码,可能会发现安全漏洞,危及站点安全;
如果代码散布于多个页面,维护将变得非学麻烦;
浏览器会根据特定的设置缓存所有外部链接的文件,加快下载速度。
◎6-2外部调用script.html
3、内嵌在HTML标签中
如:
◎6-3内嵌script.html
6.3数据类型与变量
6.3.1 数据类型
四种基本类型:数值(整数和实数)、字符串型、布尔型和空值。
1、字符串型
字符串是存储字符的变量,可以表示一串字符,可以是引号中的任意文本,可以使用单引号或双引号。
基本语法:
var str=”字符串”;
var str=’字符串’;
可以通过length属性获得字符串的长度。如:
var sStr=”How are you”;
alert(sStr.length);
2、数值型数据
数值类型表示一个数字,可以是二进制、八进制或十六进制,极大或极小的数值,可以用科学计数法表示。
基本语法:
var num1=10.00;
var num2=5;
var x=12e5;
3、布尔型数据
布尔型数值只包含两个值,真(true)和假(false)。它用于判断表达式的逻辑条件。每个关系表达式都会返回一个布尔值。
基本语法:
var x=true;
4、undefined和null类型
undefined和null都具有“空值”含义,实际上二者具有完全不同的含义。null是一个类型为null的对象,可以通过将变量的值设为null来清空变量。而undefined表示变量不含有值。
如果定义的变量准备在将来用于保存对象,那么,最好将该变量初始化为null,而不是其他值。这样一来,只要直接检测null值就可以知道相应的变量是否已经保存了一个对象的引用了,如:
if(car != null) {
//对car对象执行某些操作
}
undefined值是派生自null值的,ECMA-262规定对它们的相等性测试要返回true。
6.3.2 变量
变量是存取数字、提供存放信息的容器。
1、变量的定义
两种方法:
1)使用var关键字定义变量。如:
var my=5;
var site=”baidu”;
2)不使用var关键字,而是直接通过赋值方式定义变量。如:
param=”hello”;
◎6-4变量的定义方式.html
2、变量的作用范围
变量有全局变量和局部变量之分。全局变量是定义在所有函数体之外的,其作用范围是整个函数;局部变量是定义在函数体之内,只对该函数是可见的,而对其他函数是不可见的。
◎6-5变量的作用域.html
6.4 表达式与运算符
6.4.1 表达式
表达式是变量、常量以及运算符的组合,可以完成赋值、计算等一系列操作。表达式可分为算术表达式、字符串表达式、赋值表达式和布尔表达式。
6.4.2 运算符
运算符是表示数据处理方式的一种符号,包括算术运算符、等同运算符、全同运算符、比较运算符、字符串运算符、逻辑运算符、逐位运算符、赋值运算符、条件运算符、typeof运算符、创建对象运算符new、delete运算符、void运算符和逗号运算符。
算术运算符:+、-、*、/、%、++、--
等同运算符:==、!==
全同运算符:===、!===
比较运算符:<、>、<=、>=
字符串运算符:<、>、<=、>=、=、+
逻辑运算符:&&、||、!
赋值运算符:=、+=、-=、*=、/=
相等运算符(==)是先进行类型转换,再测试是否相等,如果相等,则返回true,否则返回false。类似地,不等运算符(!=)是比较两个操作数是否不相等。如:
var a = “10”;
var b = 10;
var c = 11;
if(a == b) {
document.write(“a等于b
”);
} else {
document.write(“a不等于b
”);
}
if(b == c) {
document.write(“b等于c
”);
} else {
document.write(“b不等于c
”);
}
等同运算符(===)也可以比较两个操作数是否相等,但它不进行类型转换,而直接进行测试是否相等,如果相等,则返回true,否则返回false。类似地,不等同运算符(!==)是比较两个操作数是否不相等。如:
var a = “10”;
var b = 10;
var c = 10;
if(a === b) {
document.write(“a等于b
”);
} else {
document.write(“a不等于b
”);
}
if(b === c) {
document.write(“b等于c
”);
} else {
document.write(“b不等于c
”);
}
字符串运算符除了比较操作符,还有连接运算符(+),它会将两个字符串连接在一起,并返回连接的结果。
6.5 流程控制与函数
6.5.1 选择语句
选择语句就是通过判断条件来选择执行的代码块。JavaScript中选择语句有if语句和switch语句两种。
1、if选择语句
基本语法:
if(条件) {
执行的代码
}
◎6-6 if选择语句.html
2、if…else选择语句
基本语法:
if(条件) {
条件成立时执行的代码
} else {
条件不成立时执行的代码
}
◎6-7 if-else选择语句.html
3、if…else if…else选择语句
基本语法:
if(条件1) {
条件1成立时执行的代码
} else if(条件2) {
条件2成立时执行的代码
} else {
条件1和2不成立时执行的代码
}
◎6-8 if-else if-else选择语句.html
4、switch选择语句
基本语法:
switch(表达式) {
case 常量1:代码块1; break;
case 常量2:代码块2; break;
case 常量3:代码块3; break;
case 常量4:代码块4; break;
case 常量5:代码块5; break;
……
default:代码块n; break;
}