JavaScript教程.docx

Sample1

class

class是CSS的内容，是用来控制对象的位置、尺寸、段落、字体、颜色等。

学习JavaScript重点就是要控制这些内容。

.title{

font-size:

medium;

margin:

0;

padding:

0.3em;

color:

#ffffff;

background-color:

#000000；

}

动态页面

动态页面是指用JavaScript对Html文（即页面）的对象的CSS属性值进行控制，从而达到页面能动态地变化的效果。

方法和属性

属性和方法相当于谜题和函数，变量和函数是对整个程序而言，方法和属性是对对象而言。

属性和方法被引用时，前面要加对象。

当所处的位置正是该对象内时，对象吸以省略。

window.alert（"Hello"）;//对话框

navigator.appName//浏览器的名称

03章运算符

JavaScript的运算符与Java基本相同，因为是Script，在数据类型的限制方面要松散的多。

赋值、加减乘除、余除

“=、+、-、*、/、%”分别代表“赋值、加减乘除、余除”

xx=3+2;//xx的值为5

xx=3-2;//xx的值为:

1

xx=3*2;//xx的值为:

6

xx=3/2;//xx的值为:

1.5

xx=3%2;//xx的值为:

1

增1减1

“++a、a++、--a、a--”分别代表“前增1、后增1、前减1、后减1”

a=5;b=a++;//a的值为:

6、b的值为:

5

a=5;b=++a;//a的值为:

6、b的值为:

6

a=5;b=a--;//a的值为:

4、b的值为:

5

a=5;b=--a;//a的值为:

4、b的值为:

4

字符串运算

作为运算符只有“+”来连接2个字符串，至于查找、截取等功能要用字符串类的各种方法实现。

注意：

字符串与其它类型相加时，其它类型将被自动转换为字符串类型，再相加。

xx="abcd"+"xyz"//xx的值为:

"abcdxyz"

xx="1234"+56//xx的值为:

"123456"

vardd=newDate（1999,11,31）;

xx="今天是="+dd//xx的值为:

"今天是=FriDec3100:

00:

00UTC+09001999"

逻辑运算符

“&&、||、!

”分别表示“与、或、非”

if（（1<=mon）&&（mon<=12））{

alert（"xxisbetween1and12."）;

}

if（（xx=="ABC"）||（xx=="abc"））{

alert（"xxisABC."）;

}

if（!

（xx==5））{

alert（"xxisnotfive."）;

}

位运算符

“&、|、^、~”分别表示“与、或、异或、取反”

xx=0x87654321&0xffff0000;//xx的值为0x87650000

xx=0x87654321|0xffff0000;//xx的值为0xffff4321

xx=0xffff0000^0xff00ff00;//xx的值为0x00ffff00

xx=~0xffff0000;//xx的值为0x0000ffff

“<<、>>、>>>”分别表示“左移、右移、补0右移”

xx=0x12345678<<8;//xx的值为0x34567800

xx=0x12345678>>8;//xx的值为0x00123456

xx=0x87654321>>8;//xx的值为0xff876543

xx=0x87654321>>>8;//xx的值为0x00876543

比较运算符

相等（==）、不等（--）、大于（>）、小于（<）、大于等于（>=）、小于等于（<=）

if（xx==5）{

alert（"xxisfive."）;

}

if（yy!

="ABC"）{

alert（"yyisnotABC."）;

}

if（xx==null）{

alert（"xxisNull."）;

}

if（yy!

=null）{

alert（"yyisnotNull."）;

}

if（xx<123）{

alert（"xxissmallerthan123"）;

}

当类型不一致时，将被自动转换为字符串类型。

如果不需要自动转换，可以用“===和!

==”来代替“==”和“!

=”。

if（123==123）{...}//true（真）

if（"123"=="123"）{...}//true（真）

if（"123"==123）{...}//true（真）

if（123=="123"）{...}//true（真）

if（123===123）{...}//true（真）

if（"123"==="123"）{...}//true（真）

if（"123"===123）{...}//false（假）

if（123==="123"）{...}//false（假）

复合运算符

加减乘除并赋值（+=、-=、*=、/=、%=、&=、|=、^=、<<=、>>=、>>>=）

xx+=5;//xx=xx+5;

xx-=5;//xx=xx-5;

xx*=5;//xx=xx*5;

xx/=5;//xx=xx/5;

xx%=5;//xx=xx%5;

xx&=0xff;//xx=xx&0xff;

xx|=0xff;//xx=xx|0xff;

xx^=0xff;//xx=xx^0xff;

xx<<=8;//xx=xx<<8;

xx>>=8;//xx=xx>>8;

xx>>>=8;//xx=xx>>>8;

条件运算符

“exp1?

exp2:

exp3”这和Ifelse语句相同功能但用法不同，这是运算符。

yy=（xx>=5）?

"big":

"small";//若xx>5，则yy的值为:

"big"；若xx<=5，则yy的值为:

"small"

逗号分隔符

主要用于函数的参数之间分隔，for循环语句中也用来分隔语句。

for（i=0,j=0;i<10;i++）{

......

}

null时注意

当对象为null时，该对象的方法和属性都不能使用，要特别注意。

运算符的优先顺序

优先顺序

运算符

↑

高

低

↓

数组（[]）括弧（（））

増1減1（++--）负号（-）取反（~）非（!

）

乗除余（*/%）

加減（+-）文字列连接（+）

位移（<<>><<<）

比较（<<=>=>）

比较（==!

====!

==）

AND（&）

XOR（^）

OR（|）

与（&&）

或（||）

条件（?

:

）

赋值（=）复合（+=等）

逗号（,）

04章基本语法

JavaScript的流程控制语法基本与Java类似。

当控制语句部分只有一句时，{}可以省略。

条件分支（if...else...）

if（条件）{

......

}elseif（条件）{

......

}else{

......

}

if（n<10）{

alert（"SMALL"）;

}

if（n<10）{

alert（"SMALL"）;

}else{

alert（"BIG"）;

}

if（n<10）{

alert（"SMALL"）;

}elseif（n>20）{

alert（"BIG"）;

}else{

alert（"NORMAL"）;

}

条件分支（switch）

switch（表达式）{

case表达式的值1:

...

break;

case表达式的值2:

...

break;

default:

...

break;

}

switch（xx）{

case1:

alert（"ONE"）;

break;

case2:

alert（"TWO"）;

break;

case3:

case4:

alert（"THREEorFOUR"）;

break;

default:

alert（"OTHER"）;

break;

}

循环（while）

while（条件）{

......

}

n=0;

while（n<10）{

document.write（n）;

n++;

}

循环（do）

do{

......

}while（条件）

n=0;

do{

document.write（n）;

n++;

}while（n<10）;

循环（for）

for（初始条件;终止条件;条件改变语句）{

......

}

for（i=0;i<10;i++）{

document.write（i）;

}

for（variableinarray）{//数组的情况下，也可这样使用

......

}

xx=newArray（3）;

xx[0]="A";

xx[1]="B";

xx[2]="C";

for（iinxx）{

document.write（xx[i]）;

}

中断（break）

break;//跳到循环结束之后

breaklabel;//跳到循环外的某个标签处

for（i=0;i<10;i++）{

if（i==5）{

break;

}

document.write（i）;

}

abc:

for（i=0;i<10;i++）{

for（j=0;j<10;j++）{

xx=i*10+j;

if（xx>20）{

breakabc;

}

document.write（xx+"
"）;

}

}

继续下一轮循环（continue）

continue;//跳到循环内的开始处

continuelabel;//跳到某个标签处（循环内外都可以）

for（i=0;i<10;i++）{

if（i==5）{

continue;

}

document.write（i）;

}

abc:

for（i=0;i<10;i++）{

for（j=0;j<10;j++）{

xx=i*10+j;

if（xx>20）{

continueabc;

}

document.write（xx+"
"）;

}

}

对象操作（with）

with（对象）{

......

}

with（document）{

write（bgColor）;write（fgColor）;

}

05章数据类型

虽然JavaScript没有明确地区分类型，我们仍要搞清楚以下几点：

数值型和字符串型是最常见的基本类型、字符串同时作为对象处理的。

日期型也是作为对象来处理的。

布尔型一向简单，而数组需要重点掌握。

数值型

JJavaScript的数值型包括10进制、8进制、16进制、实数、小数、整数等都可以使用。

O开头的整数是8进制，0x开头的整数是16进制。

12345//10进制的12345

1.23//实数的1.23

1.23e4//1.23×10的4次方

1.23E4//1.23×10的4次方

012//8进制的12（10进制的10）

0x1b//16进制的1B（10进制的27）

字符串型

字符串的内容很多，专门作为一章来学习。

这儿简单一提。

str="这是字符串"；

布尔型

布尔型只有2个值：

true和false。

True、TRUE、False、FALSE等都是错误的写法。

作为条件比较时要特别注意：

 ◆数值的0和-0，特殊变量的null、false、NaN、undefined、空字符串（""）都作为false处理

 ◆其它都作为true处理

xx=（3=4）;//xx的值为:

false

xx=（100>50）;//xx的值为:

true

日期型

日期型的内容也较多,专门作为一章来学习。

这儿简单一提。

dd=newDate（1999,11,31,23,59,59,999）;

数组型

严格地说数组不能算基本数据类型,数组在任何语言中都是必须掌握的。

xx=newArray（3）;

xx[0]="Sun";

xx[1]="Mon";

xx[6]="Sat";

yy=newArray（"Sun","Mon","Thu"）;

对象类

用java的思想来说，一切都是类。

事实上数值型和布尔型也都封装了相应的类，即Number和Boolean。

因过于简单，不用也罢。

xx=newNumber（123）;//等价于:

xx=123;

xx=newNumber（"123"）;//等价于:

xx=palseInt（"123"）;

xx.toString（）;//转换成字符串，事实上，在使用时JavaScript会自动转换。

xx.toString（16）;//转换成16进制的字符串:

7B

yy=newBoolean（true）;//等价于:

yy=true;

另外，Number类中封装了一些可以直接使用的常数。

Number.NaN//不正确的数值

Number.MAX_VALUE//JavaScript可用的最大数

Number.MIN_VALUE//JavaScript可用的最小数

Number.POSITIVE_INFINITY//JavaScript正数无穷大

Number.NEGATIVE_INFINITY//JavaScript负数无穷小

常量

null       空

undefined  未定义

NaN        非数值

Infinity   无穷大数值 

JavaScript将所有整数和小数都转换为浮点小数，当用不正确的类型数据进行数学运算时就转换成NaN

正数大到JavaScript无法表示时，便转换成PositiveInfinity

负数小到JavaScript无法表示时，便转换成NegativeInfinity

avaScript是区分正0和负0的。

null不属于任何一种数据类型，表示“没有值”。

你可以将null赋给某一变量，

这等于删除这个变量的值，但却保留这个变量的定义。

。

当null参于运算时便产生undefined结果。

06章字符串类型

字符串类型在在在论何语言都是很重要的，JavaScript中的字符串替换功能要用到正则表达式，必须熟练掌握。

新建字符串

几乎所有类型都自动转换为字符串。

字符串既可以用String类来生成，也可以用各种类型的对象的toString（）方法来转换。

xx="abc";

xx=newString（"abd"）;//String类

yy=123;

xx=yy.toString（）;//Integer类的toString（）方法

yy=newDate（2004,11,25）;

xx=yy.toString（）;//Date类的toString（）方法

xx="abc"+123+"xyz";//123自动转换为字符串

转意字符

以下的转意字符要注意。

例：

在对话框中输出2行文字：

alert（'你好！

\n欢迎光临。

'）; 

\n-换行

\r-回车

\f-フォームフィード

\b-退格字符

\t-Tab字符

\'-单引号（'）

\"-双引号（"）

\\-反斜杠（\）

\nnn-8进制（例"A"写成：

"\101"）

\xnn-16进制（例"A"写成：

\x41"）

\unnnn-Unicode字符（例"あ"写成：

"\u3042"）

字符串的长度

string.length//取字符串的长度，汉字和英数字都作为1个Unicode字符。

xx="abc五笔字型".length;//xx的值为:

7

xx="abc\n五笔字型".length;//xx的值为:

8

取字符串的部分内容

string.charAt（n）//取第n个字符

xx="abcd".charAt

（2）//xx的值为:

"c"

xx="静坐常思自己过".charAt

（2）//xx的值为:

"常