2.1 JavaScript基础语法
1. 注释
JavaScript的代码语句由一行中的一个或多个项和符号组成。分号是JavaScript的终止字符，大括号括起来的一组JavaScript语句称为一个语句块。单行的JavaScript注释用“//”开始或者以“<!--”开始、“-->”结束。多行注释以“/*”开始、以“*/”结束。例如：
alert("这是第一个JavaScript例子!"); //弹出一个对话框，并显示“这是第一个JavaScript例子!”
<Script Language ="JavaScript"> /*弹出对话框，分别显示alert后()里的内容*/
alert("这是第一个JavaScript例子!");
alert("欢迎你进入JavaScript世界!");
alert("今后将共同学习JavaScript知识！");
</Script>
显示的效果如图2-1所示。
图2-1 欢迎示例
2. 数据类型
JavaScript有六种数据类型，主要的类型有number、string、object以及Boolean，其他两种类型为null和undefined。下面是一些简单的例子：
var str = "Hello, world";//字符串 var i = 10;//整型数 var f = 2.3;//浮点数 var b = true;//布尔值
还有一种类型是对象类型，对象类型是一种复合的数据类型，其基本元素由基本数据类型组成，当然不限于基本类型，比如对象类型中的值可以是其他的对象类型实例。
3. 常量
在程序运行过程中，其值不能被改变的量称为常量。常量可根据不同类型分为整型常量、实型常量、字符型常量等。
整型常量由整数表示，如123、-2000，也可以使用十六进制、八进制表示其值。实型常量是由整数部分加小数部分表示的，如123.45。
4. 变量
在JavaScript中，变量用来存放运行中的值。在使用变量之前，先使用var语句进行声明。
下面是变量声明的代码示例：
var F = true; // F中存储的值为Boolean类型。
JavaScript是一种区分大小写的语言，因此将一个变量命名为Name和将其命名为name是不一样的。另外，变量的名称长度可以是任意，但必须遵循以下规则：
■ 第一个字符必须是一个字母（大小写均可）、一个下画线（_）或一个美元符号（$）。
■ 后续的字符可以是字母、数字、下画线或美元符号。
■ 变量名称不能是保留字。
5. 运算符
JavaScript运算符包括算术、逻辑、位以及赋值运算符。
■ 算术运算符：-（负值）、++（递增）、--（递减）、*（乘法）、/（除法）、%（取模运算）、+（加法）、-（减法）。
■ 逻辑运算符：!（逻辑非）、<（小于）、>（大于）、<=（小于等于）、>=（大于等于）、==（等于）、!= （不等于）、&&（逻辑与）、||（逻辑或）、?: （条件“三元运算符”）、，（逗号）、===（恒等）、！==（不恒等）。
■ 位运算符：~（按位取反）、<<（按位左移）、>>（按位右移）、>>>（无符号右移）、&（按位与）、^ （按位异或）、|（按位或）。
6. 程序流程控制
程序经常在不同的情况下完成不同的事情，JavaScript也为各种可行性提供了解决方案，包括条件语句、多分支语句、循环语句。
■ if条件选择语句
if(条件语句)
{
执行语句
}
例2-1
<script language="javascript">
var x=2
if(x<3 && x>0 && x!=1)
{
alert("对");
}
</script>
效果如图2-2所示。
图2-2 条件语句
例2-2
格式1：变量 = 布尔表达式?语句1:语句2;
<script language="javascript">
var x=3
{
x=x>5?'答对了,真聪明!':'答错了,你真笨!';
alert(x);
}
</script>
效果如图2-3所示。
图2-3 布尔表达式
格式2：
if(条件语句)
{
执行语句块1
}
else
{
执行语句块2
}
例2-3
<script language="javascript">
var x=2
if(x<3 && x>0 && x!=1)
{
alert("对");
}
else
{
alert("错");
}
</script>
效果如图2-2所示。
例2-4
<script language="javascript">
var x //体会一下"x"为空（或等于"0"）和赋值后的区别
if(x)
{
x=-x;
alert(x);
}
else
{
alert("晕,空的!!")
}
</script>
效果如图2-4所示。
图2-4 条件语句（否）
格式3：
if(条件语句)
{
执行语句块1
}
else if(条件语句2)
{
执行语句块2
}
...
else if(条件语句n)
{
执行语句块n
}
else
{
执行语句块n+1
}
例2-5
<script language="javascript">
var x=5
if(x>0 && x<10)
{
alert("x大于0并且x小于10");
}
else if(x<0 && x>-10)
{
alert("x小于0并且x大于-10");
}
else if(x<100 && x>10)
{
alert("x小于100并且x大于10");
}
else
{
alert("都不对");
}
</script>
效果如图2-5所示。
图2-5 多条件语句
格式4：if语句的嵌套
例2-6
<script language="javascript">
var x=0,y=5
if(x<1)
{
if(y==1)
alert("x<1,y==1");
else
alert("x<1,!=1");
}
else if(x>10)
{
if(y==1)
alert("x>10,y==1");
else
alert("x>10,y!=1");
}
</script>
效果如图2-6所示。
图2-6 条件语句嵌套
■ switch选择语句
switch(表达式)
{
case取值1:
语句块1
break;
...
case取值n:
语句块n
break;
default:
语句块n+1
break;
}
例2-7
<script language="javascript">
var x=2
switch(x)
{
case 1:
alert("星期一");
break;
case 2:
alert("星期二");
break;
case 3:
alert("星期三");
break;
default:
alert("不好意思,我不知道!");
}
</script>
效果如图2-7所示。
图2-7 多分支语句（一）
例2-8
<script language="javascript">
var x=5
switch(x)
{
case 1:
case 2:
case 3:
case 4:
case 5:
alert("工作日,不休息.");
break;
default:
alert("休息日,太好了!");
}
</script>
效果如图2-8所示。
图2-8 多分支语句（二）
■ while循环（判断）语句
while(条件表达式语句)
{
执行语句块
}
例2-9
<script language="javascript">
var x=1
while(x < 3) //这里不可加";"，否则将作为整个while语句的从句部分，成为空语句死循环
{
alert("x=" + x);
x++;
}
</script>
效果如图2-9所示。
图2-9 while循环语句
■ do-while语句
do
{
执行语句块
}while(条件表达式语句)
例2-10
<script language="javascript">
var y=5;
do
{
alert("y=" + y); //虽然不成立，但还是要执行一次
y++;
}
while(y<3) //上面执行完，然后再来检测对错
</script>
效果如图2-10所示。
图2-10 do-while循环语句
■ for循环语句
for(初始化表达式;循环条件表达式;循环后的操作表达式)
{
执行语句块
}
例2-11
<script language="javascript">
var output = "";
for(var x=1; x<10; x++)
{
output = output +" x=" + x; //等同于写法:output+="x="+x;
}
alert(output);
</script>
效果如图2-11所示。
图2-11 for循环语句
例2-12
<script language="javascript">
var output = "";
var x=1;
for(; ; ) //这样就成为无限循环语句（等效于while(true)），需用下面的“break”跳出
{
if(x>=10)
break; //用于跳出上面的无限循环
output+=" x="+x;
x++;
}
alert(output);
</script>
效果如图2-11所示。
■ break与continue语句
break语句：
例2-13
st:while(true)
{
while(true)
{
break st; //使用"st"可以退出标记指定的循环，不用标记则只退出里层循环
}
}
执行例2-13，使用“st”可以退出标记指定的循环，不用标记则只退出里层循环。
continue语句：
例2-14
<script language="javascript">
var output="";
for(var x=1; x<10; x++)
{
if(x%2==0) //如需输出偶数，可写成if(x%2!=0)
continue;
output=output + " x=" + x; //或写成:output+= " x=" + x;
}
alert(output);
</script>
显示效果如图2-12所示。
图2-12 continue语句
从上面的知识点可以看出，JavaScript的语法相当简单，对于一些有编程基础的人来说，学习JavaScript真是一件非常轻松愉快的事。下面可以根据这些基本的语法写一个跑马灯效果的脚本。
<html>
<head>
<script Language="javascript">
var msg="这是一个跑马灯效果的JavaScript文档";
var interval = 100;
var spacelen = 120;
var space10=" ";
var seq=0;
function Scroll() {
len = msg.length;
window.status = msg.substring(0, seq+1);
seq++;
if ( seq >= len ) {
seq = spacelen;
window.setTimeout("Scroll2();", interval );
}
else
window.setTimeout("Scroll();", interval );
}
function Scroll2() {
var out="";
for (i=1; i<=spacelen/space10.length; i++) out +=
space10;
out = out + msg;
len=out.length;
window.status=out.substring(seq, len);
seq++;
if ( seq >= len ) { seq = 0; };
window.setTimeout("Scroll2();", interval);
}
Scroll();
</script>
<body>
</body>
</html>
将以上代码存为HTML文档后，用网页的方式打开，在页面最下方会以走马灯效果的方式显示“这是一个跑马灯效果的JavaScript文档”，如图2-13所示。
图2-13 跑马灯效果