javascript入门一

来源：互联网发布：淘宝买东西到国外编辑：程序博客网时间：2024/05/16 13:05

JavaScript 语言基础

编程准备

编程术语

Token(语言符号) 、Literal(常量) 、Identifer(标识符) 、Operator(运算符) 、Expression(表达式) 、Statement(语句) 、Keyword(关键字) 、Reserved(保留字)

脚本执行顺序

JavaScript 脚本解释器将按照程序代码出现的顺序来解释程序语句，因此可以将函数定义和变量声明放在<head>和</head>之间，此时与函数体相关的操作不会被立即执行。

大小写敏感

JavaScript 脚本程序对大小写敏感，相同的字母，大小写不同，代表的意义也不同。

空白字符

空白字符包括空格、制表符和换行符等，在编写脚本代码时占据一定的空间，但脚本被浏览器解释执行时无任何作用。

分号

在编写脚本语句时，用分号作为当前语句的结束符。

块

在定义函数时，使用大括号“{}”将函数体封装起来。

在使用循环语句时，使用大括号“{}”将循环体封装起来。

从本质上讲，使用大括号“{}”将某段代码封装起来后，构成“块”的概念，JavaScript脚本代码中的块，即为实现特定功能的多句（也可为空或一句）脚本代码构成的整体。

数值类型

整型和浮点数值

avaScript 允许使用整数类型和浮点类型两种数值，其中整数类型包含正整数、0 和负整数；而浮点数则可以是包含小数点的实数，也可以是用科学计数法表示的实数。

var age = 32； //整数型
var num = 32.18; //包含小数点的浮点型
var num = 3.7E-2; //科学计数法表示的浮点型

八进制和十六进制

在整数类型的数值中，数制可使用十进制、八进制以及十六进制

var age = 32; //十进制
var num = 010; //八进制
var num = C33; //十六进制

变量

变量标识符

JavaScript 脚本语言使用关键字var 作为其唯一的变量标识符，其用法为在关键字var 后面加上变量名

var age;

变量申明

JavaScript 脚本语言允许开发者不首先声明变量就直接使用，而在变量赋值时自动申明该变量。

变量赋值和变量声明可以同时进行，例如下面的代码声明名为age 的变量，同时给该变量赋初值25，var age = 25;

当然，可在一句JavaScript 脚本代码中同时声明两个以上的变量，例如：var age , name;

同时初始化两个以上的变量也是允许的，例如：var age = 35 , name = “tom”;

变量作用域

要讨论变量的作用域，首先要清楚全局变量和局部变量的联系和区别：

全局变量：可以在脚本中的任何位置被调用，全局变量的作用域是当前文档中整个脚本区域。

局部变量：只能在此变量声明语句所属的函数内部使用，局部变量的作用域仅为该函数体。

声明变量时，要根据编程的目的决定将变量声明为全局变量还是局部变量。一般而言，保存全局信息（如表格的原始大小、下拉框包含选项对应的字符串数组等）的变量需声明为全局变量，而保存临时信息（如待输出的格式字符串、数学运算中间变量等）的变量则声明为局部变量。

弱类型

JavaScript 脚本语言是弱类型语言，在变量声明时不需显式地指定其数据类型，变量的数据类型将根据变量的具体内容推导出来，且根据变量内容的改变而自动更改，而强类型语在变量声明时必须显式地指定其数据类型。

变量声明时不需显式指定其数据类型既是 JavaScript 脚本语言的优点也是缺点

优点是编写脚本代码时不需要指明数据类型，使变量声明过程简单明了；

缺点就是有可能造成因微妙的拼写不当而引起致命的错误。

基本数据类型

JavaScript 脚本语言支持的基本数据类型包括Number 型、String 型、Boolean 型、Undefined 型、Null 型和Function 型，分别对应于不同的存储空间

Number 型

Number 型数据即为数值型数据，包括整数型和浮点型，整数型数制可以使用十进制、八进制以及十六进制标识，而浮点型为包含小数点的实数，且可用科学计数法来表示。一般来说，Number 型数据为不在括号内的数字

String 型

String 型数据表示字符型数据。JavaScript 不区分单个字符和字符串，任何字符或字符串都可以用双引号或单引号引起来。

Boolean 型

Boolean 型数据表示的是布尔型数据，取值为ture 或false，分别表示逻辑真和假，且任何时刻都只能使用两种状态中的一种，不能同时出现。

Undefined 型

Undefined 型即为未定义类型，用于不存在或者没有被赋初始值的变量或对象的属性

如下列语句定义变量name 为Undefined 型：var name

定义Undefined 型变量后，可在后续的脚本代码中对其进行赋值操作，从而自动获得由其值决定的数据类型。

Null 型

Null 型数据表示空值，作用是表明数据空缺的值，一般在设定已存在的变量（或对象的属性）为空时较为常用。区分Undefined 型和Null 型数据比较麻烦，一般将Undefined 型和Null 型等同对待。

Function 型

Function 型表示函数，可以通过new 操作符和构造函数Function()来动态创建所需功能的函数，并为其添加函数体。例如：var myFuntion = new Function(){staments;};

组合类型

数组Array 型和对象Object 型

Array 型

Array 型即为数组，数组是包含基本和组合数据的序列。在JavaScript 脚本语言中，每一种数据类型对应一种对象，数组本质上即为Array 对象。

var score = [56,34,23,76,45];

上述语句创建数组score，中括号“[]”内的成员为数组元素。由于JavaScript 是弱类型语言，因此不要求目标数组中各元素的数据类型均相同

由于数组本质上为Array 对象，则可用运算符new 来创建新的数组，例如：var score=new Array(56,34,”23”,76,”45”);

访问数组中特定元素可通过该元素的索引位置index 来实现，如下列语句声明变量m 返回数组score 中第四个元素：var m = score [3];

数组作为Array 对象，具有最重要的属性length，用来保存该数组的长度

Object 型

对象为可包含基本和组合数据的组合类型，且对象的成员作为对象的属性，对象的成员函数作为对象的方法。在JavaScript 脚本语言中，可通过在对象后面加句点“.”并加上对象
属性（或方法）的名称来访问对象的属性（或方法）

运算符

JavaScript脚本语言支持的运算符包括：赋值运算符、基本数学运算符、位运算符、位移运算符、高级赋值语句、自加和自减、比较运算符、逻辑运算符、逗号运算符、空运算符、?...:…运算符、对象运算符以及typedof 运算符等

赋值运算符

JavaScript 脚本语言的赋值运算符包含“=”、“+=”、“—=”、“*=”、“/=”、“%=”、“&=”、“^=”等

基本数学运算符

JavaScript 脚本语言中基本的数学运算包括加、减、乘、除以及取余等，其对应的数学运算符分别为“+”、“-”、“*”、“/”和“%”等

位运算符

JavaScript 脚本语言支持的基本位运算符包括：“&”、“|”、“^”和“~”等。脚本代码执行位运算时先将操作数转换为二进制数，操作完成后将返回值转换为十进制。

位移运算符

位移运算符用于将目标数据往指定方向移动指定的位数。JavaScript 脚本语言支持“<<”、“>>”和“>>>”等位移运算符

自加和自减

自加运算符为“++”和自减运算符为“--”分别将操作数加1 或减1。值得注意的是，自加和自减运算符放置在操作数的前面和后面含义不同。运算符写在变量名前面，则返回值为自加或自减前的值；而写在后面，则返回值为自加或自减后的值。

若自加（或自减）运算符放置在操作数之后，执行该自加（或自减）操作时，先将操作数的值赋值给运算符前面的变量，然后操作数自加（或自减）；
若自加（或自减）运算符放置在操作数之前，执行该自加（或自减）操作时，操作数先进行自加（或自减），然后将操作数的值赋值给运算符前面的变量。

比较运算符

JavaScript 脚本语言中用于比较两个数据的运算符称为比较运算符，包括“= =”、“!=”、“>”、“<”、“<=”、“>=”等

逻辑运算符

JavaScript 脚本语言的逻辑运算符包括“&&”、“||”和“!”等，用于两个逻辑型数据之间的操作，返回值的数据类型为布尔型。

逗号运算符

编写JavaScript 脚本代码时，可使用逗号“,”将多个语句连在一起，浏览器载入该代码时，将其作为一个完整的语句来调用，但语句的返回值是最右边的语句。

使用长语句赋值时，返回值为赋值语句最右边变量的值，为养成良好的编程习惯，建议不是用该方法。逗号“,”一般用于在函数定义和调用时分隔多个参数

空运算符

空运算符对应的关键字为“void”，其作用是定义一个表达式，但该表达式并不返回任何值。

?...:运算符

在JavaScript 脚本语言中，“?...:”运算符用于创建条件分支。在动作较为简单的情况下，较之if…else 语句更加简便，其语法结构如下：

(condition)?statementA:statementB;

载入上述语句后，首先判断条件condition，若结果为真则执行语句statementA，否则执行语句statementB。

值得注意的是，由于JavaScript 脚本解释器将分号“;”作为语句的结束符，statementA 和statementB 语句均必须为单个脚本代码，若使用多个语句会报错

对象运算符

JavaScript 脚本语言主要支持四种对象运算符，包括点号运算符、new 运算符、delete运算符以及（）运算符

对象包含属性和方法，点号运算符用来访问对象的属性和方法。其用法是将对象名称与对象的属性（或方法）用点号隔开var myColor=document.bgColor;

可使用双引号“[]”来访问对象的属性var myColor=document[" bgColor "];

new 运算符可以创建程序员自定义的对象，以可以创建JavaScript 内建对象的实例。

delete 运算符主要用于删除数组的特定元素，也可用来删除对象的属性、方法等

var myClassmate=new Array("JHX","LJY","QZY","HZF");
delete myClassmate[2];

typeof 运算符

typeof 运算符用于表明操作数的数据类型，返回数值类型为一个字符串。

运算符优先级

进行表达式求值时，先执行优先级脚高的运算符，再执行优先级较低的运算符；若优先级相同则按照从左至右的顺序执行

核心语句

在 JavaScript 脚本语言中，语句的基本格式为：

<statement>;

分号为语句结束标志符，为养成良好的编程习惯，在编程中应使用分号。

值得注意的是，JavaScript 脚本支持符号匹配，如双引号、单引号等。若分号嵌套在上述匹配符号内，脚本解释器搜索匹配的符号：

若存在匹配符，则将其中的分号作为普通符号而不是作为语句结束符对待。例如：var msg="语句 : var myData;";

若不存在匹配符，则提示脚本出现语法错误。例如：var msg="语句 : var myData;

基本语句构成代码段

基本处理流程

基本处理流程就是对数据结构的处理流程，在JavaScript 里，基本的处理流程包含三种结构，即顺序结构、选择结构和循环结构。

顺序结构即按照语句出现的先后顺序依次执行，为JavaScript 脚本程序中最基本的结构

选择结构即按照给定的逻辑条件来决定执行顺序，可以分为单向选择、双向选择和多向选择。但无论是单向还是多向选择，程序在执行过程中都只能执行其中一条分支。单向选择和双向选择结构

循环结构即根据代码的逻辑条件来判断是否重复执行某一段程序。若逻辑条件为true,则重复执行，即进入循环，否则结束循环。循环结构可分为条件循环和计数循环

if 条件假设语句

if 条件假设语句是比较简单的一种选择结构语句，若给定的逻辑条件表达式为真，则执行一组给定的语句

if(conditions)
{
statements;
}

if 后面可增加else 进行扩展，即组成if…else 语句，其基本结构

if(conditions)
{
statement1;
}
else
{
statement2;
}

switch 流程控制语句

switch (a)
{
case a1:
statement 1;
[break;]
case a2:
statement 2;
[break];
……
default:
[statement n;]
}

for 循环语句

for 循环语句是循环结构语句，按照指定的循环次数，循环执行循环体内语句（或语句块）

for(initial condition; test condition; alter condition)
{
statements;
}

循环控制代码（即小括号内代码）内各参数的含义如下：
initial condition 表示循环变量初始值；
test condition 为控制循环结束与否的条件表达式，程序每执行完一次循环体内语句（或语句块），均要计算该表达式是否为真，若结果为真，则继续运行下一次循环体内语句（或语句块）；若结果为假，则跳出循环体。
alter condition 指循环变量更新的方式，程序每执行完一次循环体内语句（或语句块），均需要更新循环变量

while 和do-while 循环语句

while 语句与if 语句相似，均有条件地控制语句（或语句块）的执行

while(conditions)
{
statements;
}

while 语句与if 语句的不同之处在于：在if 条件假设语句中，若逻辑条件表达式为真，则运行statements 语句（或语句块），且仅运行一次；while 循环语句则是在逻辑条件表达式为真的情况下，反复执行循环体内包含的语句（或语句块）。

使用break 和continue 进行循坏控制

在循环语句中，某些情况下需要跳出循环或者跳过循环体内剩余语句，而直接执行下一次循环，此时需要通过break 和continue 语句来实现。break 语句的作用是立即跳出循环，continue 语句的作用是停止正在进行的循环，而直接进入下一次循环。

with 对象操作语句

在编写JavaScript 脚本过程中，经常需引用同一对象的多个属性或方法，正常的对象属性或方法的引用途径能达到既定的目的，但代码显得尤为复杂。JavaScript 脚本语言提供with操作语句来简化对象属性和方法的引用过程，

with (objct)
{
statements;
}

例如下列连续引用document 对象的write()方法的语句：
document.write("Welcome to China");
document.write("Welcome to Beijing");
document.write("Welcome to Shanghai");
可以使用with 语句简化为：
with(document)
{
write("Welcome to China");
write("Welcome to Beijing");
write("Welcome to Shanghai");
}

使用for…in 进行对象循坏

使用for…in 循环语句可以对指定对象的属性和方法进行遍历，其语法结构如下：

for (变量名 in 对象名)
{
statements;
}

含标签的语句

经常在循环标志前加上标签文本来引用该循环，其使用方法是标识符后面加冒号“:”。在使用break 和continue 语句配合使用控制循环语句时，可使用break 或continue 加上标识
符的形式使循环跳转到指定的位置。

函数

函数的基本组成

函数由函数定义和函数调用两部分组成，应首先定义函数，然后再进行调用，以养成良好的编程习惯。

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

function funcName ([parameters])
{
statements;
[return 表达式;]
}

函数的各部分含义如下：

funcName 为函数名，函数名可由开发者自行定义，与变量的命名规则基本相同；

parameters 为函数的参数，在调用目标函数时，需将实际数据传递给参数列表以完成函数特定的功能。参数列表中可定义一个或多个参数，各参数之间加逗号“,”分隔开来，当然，参数列表也可为空；

statements 是函数体，规定了函数的功能，本质上相当于一个脚本程序；

return 指定函数的返回值，为可选参数。

全局函数与局部函数

JavaScript 脚本语言提供了很多全局（内建）函数，在脚本编程过程中可直接调用，在此介绍四种简单的全局函数：parseInt()、parseFloat()、escape()和unescape()。

parseInt()函数的作用是将字符串转换为整数，

parseFloat()函数的作用是将字符串转换为浮点数；

escape()函数的作用是将一些特殊字符转换成ASCII 码，

而unescape()函数的作用是将ASCII 码转换成字符。

是部函数，即定义在某特定函数内部，并仅能在其内使用的函数

作为对象的函数

JavaScript 脚本语言中所有的数据类型、数组等均可作为对象对待，函数也不例外。可以使用new 操作符和Function 对象的构造函数Function()来生成指定规则的函数，其基本语法如下

var funcName = new Function (arguments,statements;);

值得注意的是，上述的构造函数Function()首字母必须为大写，同时函数的参数列表与操作代码之间使用逗号隔开。

函数递归调用

函数的递归调用即函数在定义时调用自身

函数递归调用能使代码显得紧凑、简练，但也存在执行效率并低、容易出错、资源耗费较多等问题，推荐在递归调用次数较少的情况下使用该方法，其余情况尽量使用其余方法来代替。

语言注释语句

一般使用双反斜杠“//”作为每行解释语句的开头，必须在每行注释语句前均加上双反斜杠“//”

对于多行的解释语句，可以在解释语句开头加上“/*”，末尾加上*/，不须在每行开头加上双反斜杠“//”。

JavaScript 脚本语言中，还允许使用HTML 风格的语言注释，即用“<!--”来代替双反斜杠“//”。为养成良好的编程习惯，最好不用 HTML 风格的语言注释语句

函数应用注意事项

定义函数的位置：如果函数代码较为复杂，函数之间相互调用较多，应将所有函数的定义部分放在HTML 文档的<head>和</head>标记对之间，既可保证所有的函数在调用之前均已定义，又可使开发者后期的维护工作更为简便；

函数的命名：函数的命名原则与变量的命名原则相同，但尽量不要将函数和变量取同一个名字。如因实际情况需要将函数和变量定义相近的名字，也应给函数加上可以清楚辨认的字符（如前缀func 等）以示区别；

函数返回值：在函数定义代码结束时，应使用return 语句返回，即使函数不需要返回任何值；

变量的作用域：区分函数中使用的变量是全局变量还是局部变量，避免调用过程中出现难以检查的错误；

函数注释：在编写脚本代码时，应在适当的地方给代码的特定行添加注释语句，例如将函数的参数数量、数据类型、返回值、功能等注释清楚，既方便开发者对程序的后期维护，也方便其他人阅读和使用该函数，便于模块化编程；

函数参数传递：由于 JavaScript 是弱类型语言，使用变量时并不检查其数据类型，导致一个潜在的威胁，即开发者调用函数时，传递给函数的参数数量或数据类型不满足要求而导致错误的出现。

在函数调用时，应仔细检查传递给目标函数的参数变量的数量和数据类型。

0 0