JavaScript 总结笔记.docx

JavaScript 总结笔记.docx

《JavaScript 总结笔记.docx》由会员分享，可在线阅读，更多相关《JavaScript 总结笔记.docx（38页珍藏版）》请在冰点文库上搜索。

JavaScript总结笔记

JavaScript基础

JavaScript是一种描述式语言，它与HTML结合起来，用于增强功能，并提高与最终用户之间的交互性能。

由Netscape公司利用Sun的Java开发，它是与Java完全不同的一种语言。

虽然在结构和语法上与Java类似，但是，它只是函数式的语言。

客户端的JavaScript必须要有浏览器的支持，与一些编译性语言不同，JavaScript是一种解释性语言，其源码不经过编译，而直接在运行时被“翻译”，因而，被成为“脚本式”语言。

一个完整的JavaScript实现是由以下3个不同部分组成的：

核心（ECMAScript）

文档对象模型（DOM）

浏览器对象模型（BOM）

在网页中加入JavaScript

通过在网页中加入标记JavaScript的开始和结束，将JavaScript代码放到之间；

也可以引入一个外部的JavaScript文件，这个JavaScript文件一般以.js作为扩展名；

原则上，放在之间。

但视情况可以放在网页的任何部分；

一个页面可以有几个，不同部分的方法和变量，可以共享。

1.在中使用

可以出现在HTML文件中的之间，也可以出现在中的任何位置。

在一个HTML文档中，可以使用多个标签对，嵌入多段JavaScript代码，并且各段代码之间可以相互访问，如同将所有代码放在一对标签之中效果相同。

【注意】

有些浏览器不能很好地支持JavaScript，在这些浏览器中，需要将JavaScript代码屏蔽，否则，浏览器会把JavaScript代码与Web页面的其他内容一起显示在屏幕上，可以将标签对中的内容用HTML的注释标记

--和//-->括起来，这样，支持标签对中的HTML注释符，会继续执行注释符之间的脚本程序。

2.在单独文件中使用

可以将脚本代码放置在一个单独的文件中，该文件以js为扩展名，称为JavaScript脚本文件。

在HTML文件中引用JavaScript脚本文件，与将该脚本文件直接插入到一对标签对中的效果相同。

【注意】

（1）.js文件中只写js代码，不能写入

3.作为属性值使用

HTML中的超链接标签的href属性值，除了可以使用http和mailto等协议外，还可以使用JavaScript，使用方式如下：

window.external

.AddFavorite（'http:

//localhost:

8080/CityInfo','都市供求信息网'）"style="color:

gray">收藏本页-

123@***"style="color:

gray">联系我们

JavaScript基本语法—概述

执行顺序：

JavaScript程序是按照其在HTML文件中出现的顺序逐行执行的。

如果需要在整个HTML文件中执行，最好将其放在HTML文件的中。

某些代码，比如函数体内的代码，不会被立即执行，只有当所在的函数被其他程序调用时，该代码才会被执行。

大小写敏感：

JavaScript是大小写敏感的，区分大小写。

空白符与换行符：

JavaScript会忽略关键字、变量名、数字、函数名或其他各种元素实体之间的空格或换行符，除非这些空格是字符串常量的一部分。

语句与分隔符：

分号（;）标识着一个语句的结束。

块：

大括号{}通常用来括起一行或多行语句。

注释：

JavaScript提供了两种注释符号：

“//”

“/*…*/”

JavaScript基本语法—数据类型

JavaScript的数据类型分为基本数据类型和复合数据类型，复合数据类型主要有对象、数组和函数。

简单数据类型

JavaScript的基本数据类型有数值型、字符型、逻辑型，以及两个特殊的数据类型。

1.普通数值型

与C、C++、Java等语言不同，JavaScript中的数值包含整数和浮点数。

2.特殊数值型

特殊数值型包括Infinity和NAN。

Infinity表示值超出了可表示的最大值的范围，而NAN是“notanumber”的缩写形式，表示undefined表达式结果为数值型数据。

3.字符型

在JavaScript中，字符串是一组被引号（单引号或双引号）括起来的文本。

注：

JavaScript不对字符和字符串加以区分。

字母、数字与标点可以放在字符串内，但诸如换行符等符号，若要在字符串中使用，必须用到转义字符。

【常用的转义字符如下】

【注意】

由于字符串是用单引号或双引号括起来的，所以当字符串中出现引号时，必须进行转义，但若单引号内出现双引号或双引号内出现单引号时，则无需转义。

4.Boolean布尔型（trueorfalse）

特殊数据类型

在JavaScript中，有一些是没有任何类型的变量，称为undefined，还有一种空值数据类型。

1.无定义数据类型（undefined）

undefinded用来表示不存在的值，或者尚未赋值的变量。

如果只声明了m，而没有为其赋值，此时判断m的类型，就是undefined。

如果赋予一个不存在的属性值，系统也会认为是undefined。

2.空值（null）

null表示空值，是一个“什么都没有”的占位符。

【null与undefined的区别】

undefined表示一个变量尚未赋值；

null表示该变量被赋予了一个空值。

基本类型与合成类型

基本数据类型在内存中有固定大小，而合成类型（如对象、数组、函数等类型）则可以具有任意长度。

因此，不能将合成类型直接存储在关联每个变量的固定内存地址中，实际上存储的只是这个值的引用。

类型转换

JavaScript是一种无类型语言。

在声明变量时无需指定数据类型，这使得JavaScript具有灵活性和简单性。

在代码执行过程中，JavaScript会根据需要进行自动类型转换。

转换规则

1.转换为逻辑型数据

undefined:

false

null:

false

数值型：

若为0或NaN,则结果为false，否则为true

字符串型：

若长度为0，则结果为false，否则为true.

其他对象：

true

2.转换为数值型数据

undefined:

NaN

null:

0

逻辑型：

值为true,则结果为1,值为false，则结果为0

字符串型:

若内容为数字，则结果为相应数字，否则为NaN

其他对象：

NaN

3.转换为字符串型数据

undefined:

Undefined

null:

NaN

逻辑型：

若为true，则结果为”true”

提升基本数据为对象

每一个基本数据类型都存在一个相应的对象，这些对象提供了一些很有用的方法来处理基本数据。

例如，String对象提供了一个toLowerCase（）方法来把一个字符串转换为小写格式。

JavaScript基本语法—变量

JavaScript是一门弱类型的语言，所有的变量定义均以var来定义。

JavaScript的变量应该先定义，再使用。

虽然JavaScript可以不需定义即可直接使用变量，但不建议这么做。

类型规则

JavaScript、Java和C这样的语言之间存在一个重要的差别：

JavaScript是无类型的，即JavaScript的变量可以存放任何数据类型的值，而Java和C的变量都只能存放特定类型的数据。

与HTML不同，JavaScript区分大小写

声明变量

在JavaScript中，变量使用关键字“var”来声明。

声明变量必须遵循以下规则：

可以使用一个var同时声明多个变量。

可以在声明变量的同时对其进行赋值。

如果只是声明了变量，并未对其赋值，其值默认为undefined。

使用var多次声明同一变量也是允许的，如果重复声明的语句已有一个初始值，此时的声明就相当于对变量的重新赋值。

JavaScript基本语法—数组

数组定义

vararr=newArray（3）;

通过arr.length取得数组的长度

Javascript数组可以越界访问元素

创建一个数组有以下3种方式：

newArray（）;

newArray（len）;

newArray（[item0,[item1,[…]]]）;

【注意】

数组中的每个元素代表了一个变量，而JavaScript中的变量是没有类型的，因此数组元素也是没有类型的。

所以，可以在一个数组中存储不同类型的数据。

数组使用

使用方式：

myarray=newArray（num）

myarray=newArray（value1,value2…）

aa=newArray（3）;

aa[20]=444;

document.write（aa[20]）;

num不设定，则按数组默认的最大长度自动设定。

例如：

aa=newArray（）;

aa[20]=444;

document.write（aa.length）;

JavaScript基本语法—表达式

表达式

表达式是一个句子，用于JavaScript脚本进行运行、运算的句子。

其可以包含常量、变量、运算符等。

表达式的结果通常会通过赋值语句赋值给一个变量，或直接作为函数的参数。

JavaScript基本语法—运算符

算术运算符

运算符是在表达式中用于进行运算的一种符号。

JavaScript包括+、-、*、/、%等算术运算符。

减号（-）的特殊含义

减号（-）的另外一种用法是对数值或数值型变量求反。

赋值运算符

赋值运算符只有一个等号“=”，其作用是给变量赋值。

比较运算符

比较运算符用来连接操作数用来组成比较表达式，比较表达式的结果为逻辑值trut或false。

常用的比较运算符有：

<、<=、>、>=、!

=、==、===、!

==

补充说明

条件语句中使用=符号

在条件语句中如果误将“=”用于“==”，程序将不会报错，但运行结果错误。

比较运算符的自动转换

在比较过程中，“!

=”和“==”会进行自动类型转换，而“!

==”和“===”则不转换。

【注意】

进行相等比较时，如果不希望进行类型自动转换，则应使用“===”。

逻辑运算符

常用的逻辑运算符：

&&、||、!

位运算符

常用的位运算符有：

&、|、^（异或）、~

其他运算符

递增（++）、递减（--）运算符

？

:

运算符

?

:

是构造快速条件分支的运算符，可以看做是“if…else”语句的间歇形式。

逗号（,）运算符

逗号（,）用来将多个表达式连接为一个表达式，新表达式的值为最后一个表达式的值。

void运算符

void运算符用来指明一个表达式无返回结果。

typeof运算符

typeof运算符返回一个字符串，指明其操作数的数据类型。

typeof返回值有六种可能：

number、string、boolean、object、function、undefined

JavaScript基本语法—运算符

字符串运算符

连接运算：

+

取子集：

substring（index1,index2）

JavaScript基本语法—控制语句

if语句

if（条件）{

}elseif（条件1）{

}else

…

}

switch语句

switch（i）

casei1:

…

casei2:

…

default:

…

while语句

while（条件）{

…

}

JavaScript基本语法—循环语句

for（vari=0;i<20;i++）

do{

…

}while（条件）;

循环控制：

continue

break

JavaScript基本语法—函数

函数的定义：

利用function来定义一个函数

传入参数

传出值（需要return语句）

定义函数使用function关键字，语法规则如下：

function函数名（[参数列表]）{

程序语句；

…

}

函数调用：

全局变量与局部变量

全局变量是在所有函数之外的脚本中定义的变量，其作用范围是该变量定义后的所有语句，包括其后定义的函数中的代码，以及其后的标签对中的代码。

局部变量是定义在函数代码之内的变量，只有在该函数中、且位于该变量定义之后的程序代码，才可以使用这个变量。

局部变量对其后的其他函数和脚本代码来说，都是不可见的。

函数的参数传递：

preloadTreeImages（"1.gif","2.gif","3.gif"）;

functionpreloadTreeImages（）{

for（vari=0;i

varimg=

document.createElement（"img"）;

img.src=arguments[i];

div1.appendChild（img）;

}

}

JavaScript事件

可将在浏览器中发生的事件分为以下几种类型：

鼠标事件：

用户使用鼠标进行特定操作时触发

键盘事件：

用户在键盘上敲击、输入时触发

HTML事件：

窗口发生变动或者发生特定的客户端－服务器端交互时触发。

1、鼠标事件：

鼠标事件是Web上最常见的事件类型。

其中包含以下事件：

onclick：

点击鼠标左键时触发（如果鼠标右键也按下则不会触发）。

当用户的焦点在按钮上，并按了回车键，同样会触发该事件

ondblclick：

双击鼠标左键响应（如果鼠标右键也按下则不会触发）

onmousedown：

点击任意一个鼠标按钮时触发

onmouseup：

松开任意一个鼠标按钮时触发

onmouseout：

鼠标指针在某个元素上，且用户正要将鼠标移出元素的边界时触发

onmouseover：

鼠标移出某个元素到另一个元素上时触发

onmousemove：

鼠标在某个元素上移动时持续触发

鼠标事件的属性

每个鼠标事件都会给以下event对象的属性填入值：

坐标属性（如：

clientX和clientY等）

type属性：

事件名称

shiftKey：

true表示按下Shift键;否则为false

ctrlKey：

true表示按下Ctrl键;否则为false

altKey：

true表示按下Alt键;否则为false

鼠标事件的执行顺序

onclick事件触发前，会先发生onmousedown事件，然后发生onmouseup事件。

onmousedown

onmouseup

onclick

类似地，要触发ondblclick事件，在同一个目标上要按顺序发生以下事件：

onmousedown

onmouseup

onclick

ondblclick

移动鼠标从一个对象进入另一个对象时，先发生的事件是onmouseout（发生在鼠标移出的那个对象）。

接着，在这两个对象上都触发onmousemove事件。

最后，在鼠标进入的那个对象上触发onmouseover事件。

2、键盘事件：

键盘事件由用户对键盘的动作触发，有以下键盘事件：

onkeydown：

用户在键盘上按下某按键时触发。

一直按差某键，它则会不断触发（Opera浏览器除外）。

onkeypress：

用户按下键盘上的一个按键，并产生一个字符时触发（也就是不管类似Shift、Alt之类的按键）。

一直按下按键时，它则会持续触发。

onkeyup：

用户释放按着的按键时触发。

尽管所有的元素都支持键盘事件，但在文本框中输入文字时，是最容易触发这些事件的。

键盘事件的属性

对每个键盘事件，会填入以下的事件属性：

keyCode属性：

对于onkeypress事件，表示按下按键的Unicode码;对于onkeydown/onkeyup事件，表示按下按键的数字代码

charCode属性：

按下按键的Unicode值。

shiftKey：

true表示按下Shift键;否则为false

ctrlKey：

true表示按下Ctrl键;否则为false

altKey：

true表示按下Alt键;否则为false

键盘事件的执行顺序

用户按一次某字符按键时，会按以下顺序触发事件：

onkeydown

onkeypress

onkeyup

如果用户按一次某非字符按键（如：

shift），会按以下顺序触发事件：

onkeydown

onkeyup

如果用户按下一个字符按键且不放，onkeydown和onkeypress事件将逐个持续触发，直到松开按键;如果用户按下非字符按键且不放，将只有onkeydown事件持续触发。

3、HTML事件处理：

onblur：

任何元素或窗口本身失去焦点时触发。

onfocus：

任何元素或者窗口本身获取焦点时（用户点击它、Tab键切换到它或者任何其他与它交互的手段）触发。

onload：

页面完全载入后，在window对象上触发;所有的框架载入后，在框架集上触发;完全载入后，在其上触发;或者