JavaScript 基本语法

来源：互联网发布：贪吃飒淘宝小店网址编辑：程序博客网时间：2024/05/29 08:26

第一个 JavaScript 程序

在学习一门新语言的时候，大家都喜欢用“hello world”作为第一个程序，那么现在我们写一个 JavaScript 版本的：

<html><head></head><body><script>alert("hello world!");</script></body></html>

JavaScript 代码放在 <script>……</script> 标签里，这段代码的效果是，弹出一个小框，显示“hello world!”。

JavaScript 放在哪里？

刚才我们编写了第一个 JavaScript 程序，强调过 JavaScript 代码必须放置在 <script>……</script> 标签里。

head 中的 JavaScript

我们除了可以把包含代码的 <script> 标签放在 <body>……</body> 标签里，还可以把它放在 <head>……</head> 标签里，比如这样：

<html><head><h1> JavaScript in head. </h1><script>alert("hello word!");</script></head><body></body></html>

这个程序的执行结果和刚才的没什么不同，但其实把 JavaScript 代码放在 <head></head> 和放在 <body></body> 里是有区别的：

简单地说，放在 <head></head> 里的会比放在 <body></body> 先执行。head 标签里的代码会在页面还未开始绘制之前被解析，而在 body 里的代码则会在页面渲染的同时在读取到这段代码的时候才被执行。

外部的 JavaScript

除了直接把 JavaScript 代码写在 HTML 里，我们还可以把 JavaScript 的代码写在一个 js 文件中，在 HTML 里调用这个 js 文件。我们还是以“hello world”举例。

在实验楼环境中，把以下代码保存并命名为“out.js”，放在桌面上：

alert("hello word!");

把以下代码保存并命名为“test2.html”，放在桌面：

<html><head><h1> my JavaScript code in "out.js" </h1></head><body><script src="out.js"></script></body></html>

同样，双击桌面上的“test2.html”文件，调用浏览器运行，你会发现运行效果和前两个程序也没什么区别。

其实，前两种方式都是直接把 JavaScript 代码放在 HTML 中，在页面加载的同时，那些 JavaScript 的代码就被解析了。而把 JavaScript 代码放在外部文件中，只有在事件被触发，需要该段 JavaScript 代码时，才调用执行。

这样做有个好处，当页面比较复杂的时候，把大量的 JavaScript 代码放到外部文件，只有在需要的时候才执行，那么会明显地加快页面加载速度。

什么是变量

从字面上看，变量是可变的量；从编程角度讲，变量是用于存储数据的存储器，每个变量都有其独有的名字，每个变量都占有一段内存。

在程序当中，直接使用数据值或直接使用数据值的内存地址都不够方便，所以我们用变量的名字来表示对应的数据。

每个变量都有它的变量名，变量类型，变量的作用域。

JavaScript 中的变量

JavaScript 中的变量规则和其它如 C、Java 等语言类似，建议的变量命名规则：

1.由字母、数字、下划线组成，区分大小写
2.以字母开头
3.变量名不能有空格
4.不能使用 JavaScript 中的关键字做变量名

变量的声明

在 JavaScript 中，变量用 Var 命令做声明：

var test ;    // 声明了一个名为 test 的变量。var test_2 = "shiyanlou" ;  // 声明一个名为 test_2 的变量，并赋值为“shiyanlou”。

在 JavaScript 中，变量也可以不作声明，而在使用时再根据数据的类型来确其变量的类型，如：

x = 100 ;     // 变量 x 为整数y = "hello" ; // 变量 y 为字符串z = True ;    // 变量 z 为布尔型cars=["Audi","BMW","Volvo"]; // cars 是一个数组

作用域

与其他语言一样，JavaScript 中的变量同样有全局变量和局部变量之分。

全局变量是定义在所有函数之外的，其作用范围是整段 JavaScript 代码；

而局部变量是定义在函数体之内，只对其该函数是可见，而对其它函数则是不可见的。

数据类型

字符串

字符串是存储字符（比如 "shiyanlou"）的变量。

字符串可以是引号中的任意文本，您可以使用单引号或双引号，也可以在字符串中使用引号，只要不匹配包围字符串的引号即可：

var carname="shiyanlou";var carname='shiyanlou';var answer="I Love 'shiyanlou'";var answer='I Love "shiyanlou"';

数字

JavaScript 只有一种数字类型。数字可以带小数点，也可以不带：

var x1=34.00;      //使用小数点来写var x2=34;         //不使用小数点来写

布尔

布尔只能有两个值：true 或 false：

var x=truevar y=false

数组

创建一个名为 boys 的数组：

var boys=new Array();boys[0]="Tom";boys[1]="Jack";boys[2]="Alex";

也可以这样:

var boys=new Array("Tom","Jack","Alex");

或者这样:

var boys=["Tom","Jack","Alex"];

运算符

大多数编程语言的运算符规则都是相似的，JavaScript 与大多数人熟悉的 C、Java 等都很接近。

1.算数运算符

运算符描述示例+加x+y-减x-y*乘x*y/除x/y++累加x++--累减x--%取余数x%y

2.比较运算符

比较运算符的基本操作过程是，首先对它的操作数进行比较，再返回一个 true 或 False 值，有８个比较运算符:

< (小于)、> (大于)、<= (小于等于)、>= (大于等于)、== (等于)、!= (不等于)。

3.逻辑运算符

biaoge

JavaScript 语句

1. if/else 语句

JavaScript 中的 if/else 判断选择，你会发现，就像 C 语言。语法格式是这样的：

if (条件 1)  {  当条件 1 为 true 时执行的代码;  }else if (条件 2)  {  当条件 2 为 true 时执行的代码;  }else  {  当条件 1 和 条件 2 都不为 true 时执行的代码;  }

2. switch/case 语句

在做大量的选择判断的时候，如果依然使用 if/else 结构，那么代码有可能会变得很凌乱，于是我们采用 switch/case 结构：

switch(k){case k1:  执行代码块 1 ;  break;case k2:  执行代码块 2 ;  break;default:  默认执行（k 值没有在 case 中找到匹配时）;}

3. for 循环

for 循环是程序员进场经常用到的工具，在 JavaScript 中，for 循环的语法也十分类似 C 语言，格式是这样的：

for(变量 = 初始值 ; 循环条件 ; 变量累加方法){循环语句;}

举例说明更清楚，比如循环打印出 0～7 的数字：

<html><head></head><body><script>for(var i=0;i<8;i++){document.write("number is "+i+"<br>");}</script></body></html>

在浏览器中的效果：

0301

4. while 循环

区别于 for 循环的另一种循环方式：

while (条件)  {  需要执行的代码;  }

此外，while 循环还有一种变体，称作 do/while 循环：

do  {  需要执行的代码;  }while (条件);

而这两者的区别是，do/while 循环在检测条件之前就会执行，也就是说，即使条件为 false，do/while 也会执行一次循环代码。

5. break 和 continue 语句

有时候在循环体内，需要立即跳出循环或跳过循环体内其余代码而进行下一次循环，这便是 break 和 continue 的作用。

break 本语句放在循环体内，作用是立即跳出循环。
continue 本语句放在循环体内，作用是中止本次循环，并执行下一次循环。如果循环的条件已经不符合，就跳出循环。

比如：

for (i = 1; i < 10; i++){  if (i == 5 || i == 6) continue;  if (i == 8) break;  document.write(i);}

输出为“12347”，便是跳过了 5 和 6，然后在 i==8 的时候跳出了循环。

JavaScript 函数

在进行一个复杂的程序设计时，需要根据所要完成的功能，将程序划分为一些相对独立的部分，每部分编写一个“函数”。从而，使各部分充分独立，任务单一，程序清晰，易懂、易读、易维护。

JavaScript 的函数可以封装那些在程序中可能要多次用到的模块，并可作为事件驱动的结果而调用的程序，从而实现一个函数把它与事件驱动相关联，这是与其它语言不同的地方。

在 JavaScript 中，函数由关键词 function 定义，函数可以有多个参数。基本格式为：

function 函数名 (参数1，参数2){  函数体;  return 返回值;}

调用（使用）函数时，传入对应的参数，执行函数体中如 if/else，switch/case，for，while 等各种语句，可以实现各种复杂的功能。

0 0