当前位置:文档之家› javascript高级程序设计

javascript高级程序设计

javascript高级程序设计
javascript高级程序设计

构成javascript完整实现的各个部分:

>javascript的核心ECMAScript描述了该语言的语法和基本对象;

>DOM描述了处理页面内容的方法和接口;

>BOM描述了与浏览器进行交互的方法和接口;

原始值和引用值

在ECMAScript中,变量可以存放两种类型的值,即原始值和引用值。

原始值是存储在栈中的简单数据段,也就是说,它们的值直接存储在变量访问的位置。

引用值是存储在堆中的对象,也就是说,存储在变量处的值是一个指针,指向存储对象的内存处。

为变量赋值时,ECMAScript的解释程序必须判断该值是原始类型的,还是引用类型的。要实现这一点,解释程序则需尝试判断该值是否为ECMAScript的原始类型之一。由于这些原始类型占据的空间是固定的,所以可将它们存储在较小的内存区域----栈中。

ECMAScript有5种原始类型,即underfined 、null、boolean 、number、string

ECMAScript提供了typeof运算来判断一个值是否在某种类型的范围内。

注意:对变量或值调用typeof运算符的时候返回object---的变量是一种引用类型或null类型。

String类型的独特之处在于,它是唯一没有固定大小的原始类型。

转换成字符串:

ECMAScript的boolean值、数字、字符串的原始值得有趣之处在于它们是伪对象,这意味着它们实际上具有属性和方法。这3中主要的原始值都有toString()方法,可以把它们的雾值转换成字符串。

注意:

ECMAScript定义所有对象都有toString()方法,无论它是伪对象,还是真的对象。

转换成数字:

ECMAScript提供了两种把非数字的原始值转换成数字的方法,即parseInt()以及parseFloat()。

强制类型转换:ECMAscript中可用的3中强制类型转换

Boolean(value)

Number(value)

String(value)

引用类型:

引用类型通常叫作类,也就是说,遇到引用值时,所处理的就是对象。

对象是由new运算符加上要实例化的类的名字创建的。

var o = new Object();或者 var o = new Object;

Object类:对象.属性

Object类中所有属性和方法都会出现在其他类中。引用就相当于指针。

对象的函数、对象本身(原型)、对象的属性、创建对象的函数。Constructor:对创建对象的函数的引用。

Prototype:对该对象的对象原型的引用。

HasOwnProperty(property):判断对象是否有某个特定的属性。

IsPrototypeOf(obejct):判断该对象是否为另一个对象的原型。PropertyIsEnumerable(property):

ToString():返回对象的原始字符串表示;

ValueOf():返回该对象的原始值,也就是最初赋的那个值。

Boolean类:

ValueOf()方法,返回原始值,即为true或false。

建议:最好还是使用Boolean原始值。

Var ss = new Boolean(true);

Var oo = new Number(666);

Var si = new String(“hello world”);

String类:

String类的属性length:输出字符个数

chartAt()和charCodeAt()都是访问字符串中的单个字符。字符与字符代码concat():用于把一个或多个字符串连接到String对象的原始值上--后接

var o = new String(“hello”);

var sResult = o.concat(“world”);==o+”world”都输出hello world。

indexOf()和LastIndexOf()方法返回的都是指定字串在另一个字符串的位置。如果没有找到返回-1;这两个方法不同在于,检索相反。

LocalCompare()对字符串进行排序,该方法有一个参数—要进行比较的字符串,返回的是下列3个值之一:

如果String对象按照字母顺序在参数中的字符串之前,返回负数。

如果String对象等于参数中的字符串,返回0。

如果String对象按照字母顺序排在参数中的字符串之后,返回正数。

Var oString = new String(“yellow”);

Alert(oString.localeCompare(“brick”); //outputs”1”

LocalCompare()对字符串的头字母进行排序。LocalCompare()是区分大小写的,

大写字母在字母顺序上排在小写字母之后。

ECMAScript提供了两种方法从子串创建字符串值,即slice()和substring()。这两个方法都接受一个或两个参数。就是对一个字符串进行截取操作。不同的是,它们都有负数的处理方式稍有不同。

对于String(),参数为负数为转换为0;

对于slice(),参数为负数的时候,转换为:字符串的总长度加上该负数。

有4中方法用于执行大小写转换,即toLowerCase()、toLocaleLowerCase()、toUpperCase()、toLocaleUpperCase()。

对于toLowerCase()和toUpperCase()方法时原始的,toLocalLowerCase()和toLocalUpperCase()方法时基于特定的区域实现的—使用区域特定的方法才能进行正确的转换。

一般说来,如果不知道在以哪种编码运行一种语言,则使用区域特定的方法比较安全。ToLocalLowerCase()与toLocalUpperCase()会根据本地的编码进行大小转换。

Instanceof运算符:

在使用typeof运算符时采用引用类型存储值会出现一个问题---无论引用的是什么类型的对象,返回的都是”object”类型。Instanceof方法却可以明确对象为某特定类型。

运算符:

一元运算符—只有一个参数,即要操作的对象或值。包括delete、void、前增量/前减量运算符(++/--)、后增量/后减量运算符(++/--)、一元加法和一元减法。

对于delete运算符是删除对以前定义的对象属性或方法的引用(仅为开发人员为对象定义的属性或方法)。

对于void运算符对任何值都返回undefined。该运算符通常用于避免输出不应该输出的值。如:

Click Me

点击链接之后,会在创建的新窗口上,输出该open返回的obejct对象。

Click Me 对于前后增量运算符,就是在数值上加1,对于前后减量,就是在数值减-1;

对于一元加法和一元减法,本质上对数字无任何影响,但会把字符串转换成数字。

位运算符:--以二进制数字进行运算

1 重温整数。ECMAScript整数有两种类型,即有符号整数(允许用整数和负数)和无符号整数(只允许用整数)。在ECMAScript中,所有整数字面量默认都是有符号整数。

有符号整数使用前31位表示整数的数值,用第32为表示整数的符号,0表示正数,1表示负数。数值的范围从-2147483648到2147483647。

Var iNum =10;

Alert(iNum.toString(2)); //outputs”10010”

负数也存储为二进制代码,不过采用的形式是二进制补码。计算数字二进制补码的步骤有三步:

1 确定该数字的非负版本的二进制表示。

2 求得二进制反码,即要把0替换为1,把1替换为0;

3 在二进制反码上加1;

注意:有趣的是,ECMAScript并不以二进制补码的形式显示,而是用数字绝对值的标准的二进制代码前加负号的形式输出。--ECMAScript的简单处理的方式。 Var iNum = -18;

Alert(iNum.toString(2)); //outputs”-10010”

另一方面,无符号整数把最后一位作为另一个数位处理。在这种模式中,第32位不表示数字的负号,而是值2的31幂。无符号整数的数值范围为0到4294967295。

注意,所有整数字面量都默认存储有符号整数。只有用ECMAScript的位运算符才能创建无符号整数。

位运算NOT(~),位运算NOT是三步的处理过程:

1 把运算数转换成32为数字;

2 把二进制形式转换成它的二进制反码。

3 把二进制反码转换成运算数形式。

位运算NOT实质上是对数字求负,然后减1;

位运算AND(&),直接对运算数的二进制形式进行运算。把它们的二进制数字对齐。正正>正1 、负负>负0;正负>负0、负正>负0;再把二进制数字转换成运算数形式。

位运算OR(|) ,直接对运算数的二进制形式进行运算。把它们的二进制数字对齐。正正>正1、负负>负0、正负>正1、负正>正1;再把二进制数字转换成运算数形式。

位运算XOR(^) ,直接对二进制数字进行运算。当运算中的两个二进制数字,只

有一个数位存的是1,它才返回1。

左移运算(”<<”),直接对运算数的二进制数字操作,如运算数2,的二进制数为00010,左移5位结果为64 二进制中为1000000。

有符号右移运算(“>>”) ,将把32位数字中的所有数位整体右移,同时保留该数的符号。有符号右移运算恰好与左移运算相反。

无符号右移运算(>>>),对于整数的操作与有符号右移运算一样,对于负数有所不同。(无符号不存在负数)。

Var iUnsigned64 = -64 >>> 0;

Alert(iUnsigned64.toString(2));----outputs”1111111111111111111111110 000000”,即由符号整数-64的二进制补码表示,不过它的等于无符号整数4294967232。出于这种原因。使用无符号右移运算符要小心。

Boolean运算符:--运算的结果为boolean值

Boolean运算符有三种,逻辑NOT(!) 、逻辑AND(&&)和OR(||).

逻辑NOT运算符的行为如下:

1 如果运算数是对象,返回false

2 如果运算数是数字0,返回true

3 如果运算数是0以外的数字,返回false

4 如果运算数是null,返回true

5 如果运算数是NaN,返回true

6 如果运算数是undefined,发生错误。

逻辑AND运算并不一定返回Boolean值:

1 如果一个运算数是对象,另一个是Boolean值,返回该对象。

2 如果两个运算数都是对象,返回第二个对象。

3 如果某个运算数是null,返回null

4 如果某个运算数是NaN,返回NaN

5 如果某个运算数是undefined,发生错误。

逻辑OR(||)的运算行为与AND的差异是:

1 如果两个运算数都是对象,返回第一个对象。

2 如果第一个运算数为true,就不再计算第二个运算数。

乘性运算符:

乘(*)除(/) (%)

加性运算符:加(+)减(-)

关系运算符:

小于< 、大于 > 、小于等于 <= 、大于等于 >=

等性运算符:

判断两个变量是否相等是程序设计中非常重要的运算。在处理原始值时,这种运算相当简单。但涉及对象,任务就稍有点复杂。

ECMAScript提供了两套运算符处理这个问题,等号和非等号用于处理原始值,全等号和非全等号用于处理对象。

对于等号(==)和非等号(!=),操作原始值。执行类型转换的基本规则如下:1 如果一个运算数是Boolean值,在检查相等性之前,把转换成数字值,false 转换为0,true转换成1,。

2 如果一个运算数是字符串,另一个是数字,在检查相等性之前,要尝试把字符串转换成数字。

3 如果一个运算数是对象,另一个字符串,在检查相等性之前,要尝试把对象转换成字符串。

4 如果一个运算数是对象,另一个数字,在检查相等性之前,要尝试把对象转换成数字。

对于全等号和非全等号在比较时,不尝试进行任何类型转换。

条件运算符:

Variable = boolean_expression? Ture_value:false_value;

赋值运算符:

简单的赋值运算(=)。

Var iNum =10; iNum = iNum + 10; 等价于:

Var iNum = 10 ; iNum += 10;

函数:要执行的标示

函数是一组可以随时随地运行的语句,函数是由关键字function、函数名加一组参数以及置于括号中要执行的代码声明的。

方法定义:

Function say(sName,sMessage){alert(“Hello”+name”,”+sMessage);}

方法调用:

Say(“nusss“,”how are you today?”)

函数say()未声明返回值,不过不必专门声明它。同样的,即使函数确实有返回值,也不必明确地声明它。该函数只需要使用return。另一个重要的概念是,函数在执行过return语句后停止执行代码。

一个函数中可以有多个return语句。

Function diff(iNum1,iNum2){

If(iNum1>iNum2){ return iNum1-iNum2;}

Else{ return iNum2-iNum1;}

}

如果函数无返回值,那么可以调用没有参数的return运算符,随时推出函数。

无重载:

ECMAScript可用相同的名字在同一个作用域中定义两个函数,而不会引发错误,但真正使用的是后一个函数。如:

Function doAdd(iNum){alert(iNum+100);}

Function doAdd(iNum){alert(iNum+10);}

doAdd(10); //outputs”20”;

arguments对象:

在函数代码中,使用特殊对象arguments,开发者无需明确指出参数名,就能方位它们。还可用arguments对象检测专递给函数的参数个数,引用属性arguments.length即可。那么如果把方法的参数看对一个对象,这个对象就用arguments来表示。

与其他程序设计语言不同,ECMAScript不会验证传递给函数的参数个数是否等于函数定义的参数个数。

用arguments对象判断传递给函数的参数个数,即可模拟函数重载:

Function doAdd(){

If(arguments.length==1){alert(arguments[0]+10);

}else if(arguments.length==2){alert(arguments[0]+arguments[1]);} }

doAdd(10);

doAdd(30,20);

Function类:

ECMAScript最令人感兴趣的可能莫过于函数实际上是功能完整的对象。Function类可以表示开发者定义的任何函数。如果函数看成一个对象的话,那么这个对象的名字为Function。

用Function类直接创建函数的语法如下:

Var function_name =new Function(argument1…,argumentN,function_body);

doAdd =new Function(“iNum”,”alert(iNum+100)”);

doAdd =new Function(“iNum”,”alert(iNum+10)”);

doAdd(10);

观察这段代码,很显然,doAdd的值被改成了指向不同对象的指针。函数名只是指向函数对象的引用值,行为就像其他指针一样。甚至可以使两个变量指向同一个函数:

Var doAdd = new Function(“iNum”,”alert(iNum+10)”);

Var alsoDoAdd =doAdd;

doAdd(10); //outputs:20

alsoDoAdd(10); //outputs:20

对象基础:

介绍过一切都是对象的概念。本章的重点是如何操作以及使用这些对象,以及如何创建自己的对象,以根据需要增加专用的功能。

每个对象都由类定义,可以把类看作对象的配方。类不仅要定义对象的接口,还要定义对象的内部工作。编译器和解释程序都根据类的说明构建对象。

程序使用类创建对象时,生成的对象叫做类的实例。对类生成的对象的个数的唯一限制来自于运行代码的机器的物理内存。每个实例的行为相同,但实例处理一组独立的数据。

对象定义存放在一个函数---构造函数中。构造函数不是一种特殊函数,它只不过是用于创建对象的常规函数。

面向对象语言的要求:

一种面向对象语言需要想开发者提供四种基本能力:

1 封装—把相关的信息(无论数据或方法)存储在对象中的能力

2 聚集—把一个对象存储在另一个对象内的能力

3 继承—由另一个类(或多个类)得来类的属性和方法的能力。

4 多态—编写能以多种方法运行的函数或方法的能力。

在ECMAScript中,对象由特性构成,特性可以是原始值,也可以是引用值。如果特性存放的是函数,它将被看作对象的方法,否则该特性被看作属性。

对象应用:

1 声明和实例化对象是用关键字new后跟要实例化的类的名字创建的:

Var oObject = new Object();

Var oStringObject = new String();

第一行代码创建了Object类的一个实例,并把它存储在变量oObject中。第二行代码创建了String类的一个实例,把它存储在变量oStringObject中。如果构造函数无参数,括号则不是必需的。

Var oObject = new Object; //实例化Object对象,且将对象存放在oObject 中。

对象引用:

在ECMAScript中,不能访问对象的物理表示,只能访问对象的引用。每次创建对象,存储在变量中的都是该对象的引用,而不是对象本身。

对象废除:

把对象的所有引用都设置为null,可以强制性的废除对象。

早绑定和晚绑定:

所谓绑定,即把对象的接口与对象实例结合在一起的方法。

早绑定是指在实例化对象之前定义它的特性和方法,这样编译器或解释器程序就能提前转换机器代码。

另一方面,晚绑定指的是编译器或解释器程序在运行前,不知道对象的类型。使用晚绑定,无需检查对象的类型,只需要检查对象是否支持特性和方法即可。ECMAScript中的所有变量都采用晚绑定方法,这样就允许执行大量的对象操作。

对象的类型:

在ECMAScript中,所有对象并非同等创建的。一般说来,可以创建并使用的对象有三种:[本地对象、内置对象、宿主对象]

一:本地对象,独立于宿主环境的ECMAScript实现提供的对象。简单说来,本地对象就是ECMA-262定义的类(引用类型)

Array string date number regexp referenceError …….

Array类:

使用这两个方法,一点要使用括号:

Var aColors = new Array();

aColors[0] = “red”;

aColors[1] = “green”;

aColors[2] = “blue”;

这里创建了一个数组,并定于了三个数组项。每增加一个数组项,数组的大小就动态地增长。

Var aColors = new Array(“red”,”green”,”blue”);

数组可以根据需要增大或减少。最多可以存放4294967295项。

Function的toString()方法返回以字符串形式该方法内容。

Array对象覆盖了toString()方法和valueOf()方法,返回特殊的字符串。

Date类:

Aar d = new Date();

toDateString()—以实现的特定的格式显示Date的日期部分;

toTimeString()—以实现的特点的格式显示Date的时间部分;

toLocalString()—以地点特点的格式显示Date的日期和时间;

内置对象:由ESMAScript实现提供的、独立于宿主环境的所有对象,在ECMAScript程序开始执行时出现。只定义两个内置对象,即Global和Math(它们也是本地对象,根据定义,每个内置对象都是本地对象)。

Global对象:

Global对象是ECMAScript中最特别的对象,因为实际上它根本不存在。如果尝试编写下面的代码,讲得到错误:

Var pointer = Global;

错误消息显示Global不是对象。这里需要理解的主要概念是,在ECMAScript 中,不存在独立的函数,所有函数都必须是某个对象的方法。如isNaN()、isFinite()、parseInt()和parseFloat()等。它们都是Global对象的方法。

JavaScript入门教程(初学者不可多得的优秀入门教材,通俗易懂,专业术语通俗化)

第 1 章 JavaScript 语言入门 1 为什么学习 JavaScript
提要:Javascript 是学习脚本语言的首选。她兼容性好,绝大多数浏览器均支持 Javascript,而且她功能强大,实现简单方便,入门简单,即使是程序设计新手也可以非常 快速容易地使用 JavaScript 进行简单的编程。
Javascript 是由 Netscape 公司创造的一种脚本语言。为便于推广,被定为 javascript,但 是 javascript 与 java 是两门不相干的语言, 作用也不一样。 作为一门独立的编程语言, javascript 可以做很多的事情,但它最主流的应用还是在 Web 上——创建动态网页(即网页特效)。 Javascript 在网络上应用广泛, 几乎所有的动态网页里都能找到它的身影。 目前流行的 AJAX 也是依赖于 Javascript 而存在的。 Javascript 与 Jscript 也不是一门相同的语言, Jscript 和 vbscript 是微软开发的两种脚本语 言,微软,Netscape 公司以及其他语言开发商为减少 web 开发者的兼容麻烦,所以成立 ECMA , 该组 织 专 门制定 脚 本 语 言的 标 准 和规范 。 ECMA 制 定 的标 准脚 本 语 言 叫做 ECMAScript,Javascript 符合 ECMA 的标准,其实 Javascript 也可以叫做 ECMAScript. Jscript 也 ECMA 的标准, 但用户较少。vbscript 仅局限在微软的用户, Netscape 不支持。 概括地说,JavaScript 就是一种基于对象和事件驱动,并具有安全性能的脚本语言,脚 本语言简单理解就是在客户端的浏览器就可以互动响应处理程序的语言, 而不需要服务器的 处理和响应,当然 JavaScript 也可以做到与服务器的交互响应,而且功能也很强大。而相对 的服务器语言像 asp https://www.doczj.com/doc/9918252251.html, php jsp 等需要将命令上传服务器,由服务器处理后回传处理结 果。对象和事件是 JavaScript 的两个核心。 JavaScript 可以被嵌入到 HTML 文件中,不需要经过 Web 服务器就可以对用户操作作 出响应,使网页更好地与用户交互;在利用客户端个人电脑性能资源的同时,适当减小服务 器端的压力,并减少用户等待时间。
2 将 JavaScript 插入网页的方法
与在网页中插入 CSS 的方式相似,使用
language="javascript"表示使用 JavaScript 脚本语言,脚本语言还有 vbscript、 jsscript 等,如果没有 language 属性,表示默认使用 JavaScript 脚本。其中的...就是代 码的内容。例如:

javascript课程设计

潍坊科技学院 JavaScript课程设计 报告书 设计题目基于javascript的电子商务网站开发 专业班级11软件一 学生姓名江京翔 学号201101080002 指导教师陈凤萍 日期2012.12.24~2012.1.11 成绩

课程设计任务书 院系:软件学院专业:软件技术班级:11软1 学号:201101080002 一、课程设计时间 2012年12月24日至2013年1月11日,共计3周。 二、课程设计内容 使用html+javascript+css 完成以下任务: 1、能够熟练使用css结合html实现网页布局。 2、熟练使用文档对象模型和事件驱动,能够很好的实现web表单的交互式操作。 3、熟练使用javascrip中的对象,实现网页的动态效果。 三、课程设计要求 1. 课程设计质量: ?贯彻事件驱动的程序设计思想,熟练使用javascript中的对象,实现网页特效。 ?网页设计布局合理,色彩搭配合理,网页操作方便。 ?设计过程中充分考虑浏览器兼容等问题,并做适当处理。 ?代码应适当缩进,并给出必要的注释,以增强程序的可读性。 2. 课程设计说明书: 课程结束后,上交课程设计报告书和相关的网页。课程设计报告书的格式和内容参见提供的模板。 四、指导教师和学生签字 指导教师:学生签名:江京翔 五、教师评语:

基于javascript的电子商务网站开发 摘要 JavaScript是开发WEB应用程序不可或缺的一种语言,无论是为web页面增加交互性还是创建整个应用程序,如果没有Javascript,今天的web就不是现在这个样子了。JavaScript是具有正式规范的基于标准语言;然而,正如任何一个web开发人员所告诉你的那样,几乎每个web浏览器对这个规范的解释都不同。 本网站充分的结合了HTML与CSS的结合充分显示了网站的动态效果,是客户与网站能够充分的结合,进行信息的交换信息不断的进行更新。 基于新闻管理网站,国外新闻页面更具有代表性,是网站最标准型之一,通过Javascript 脚本的交互式该页面更好与其他的页面相互结合。 同时通常页面的下载是按照代码的排列顺序,而表格布局代码的排列代表从上向下,从左到右,无法改变。而通过CSS控制,您可以任意改变代码的排列顺序,比如将重要的右边内容先加载出来。 关键字:节假日、日历、Javascript脚本

Javascript基础教程

Javascript简介 (2) Javascript简介 (2) 简单的Javascript入门示例 (4) 编写Javascript 代码 (5) 语句(Statements) (5) 语句块(Blocks) (6) 注释(Comments) (7) 表达式(Expressions) (8) 赋值和等于(Assignments and Equality) (9) Javascript常用运算符(Operators) (10) 算术运算符 (10) 逻辑运算符 (11) 赋值运算符 (12) Javascript 循环语句(Javascript Loop Statements) (12) 使用for 循环语句 (13) 使用for...in 循环语句 . (15) 使用while 和do...while 循环语句 (17) 使用break 和continue 语句 (20) Javascript写在哪里 (23) Javascript在之间 (23)

Javascript在之间 (24) Javascript放在外部文件里 (25) Javascript变量(Javascript Variables) (26) 什么是变量? (26) 变量的声明(Declaring Variables) (26) 变量的命名规则 (27) Javascript条件语句(Javascript Conditional Statements) (27) 单项条件结构(if条件语句) (28) 双向条件结构(if...else条件语句) (29) 多项条件结构(switch条件语句) (31) Javascript保留字(Javascript Reserved Words) (32) Javascript未来保留字(Javascript Future Reserved Words) (33) Javascript简介 Javascript简介

javascript高级程序设计 公选课作业答案

题目要求 1、新建一个网页页面,将网页分成上下两部分,上面部分是一个表单,用户可以输入:姓名、家庭住址、身份证号、毕业学校、所学专业等信息。然后,点击提交按钮,把用户提交的信息在网页的下半部分来显示出来。要求姓名不能为空且只能输入字符,家庭住址只能输入字符,身份证号只能输入18位数字,毕业学校和专业只能输入字符,通过js验证表单。(40分) 2、在网页上设计5个按钮超连接,点击相应按钮的时候,链接到按钮上显示的网址上去。用JavaScript 来实现。(20分) 3、在网页上自己设计一个计数器,有按钮来控制计数器的开始和停止。每隔一秒钟,计数器就加1。每过60秒向分钟位进一位。准备三幅图片,在一个图片框中每过5秒钟显示下一张图片,循环显示。(40分) 题目答案 1.第一题: 表单提交 习题2: 让用户输入一个名字的列表,并将名字保存在数组中。在程序中循环地提示用户输入一个名字,直到用户输入为空。然后按升序顺序排列名字,并把名字输出在页面上,每个名字占一行。 实验内容二: JavaScript 对话框 4 、思考题: 设计密码检测程序,密码输入正确,显示“ 欢迎访问” ,不正确显示“ 密码不正确,好好想哟” 。

实验内容三: JavaScript 函数的定义及调用 教师演示 JavaScript 函数的定义及调用的程序案例,学生按照教师的操作步骤,自己动手编写该程序,并完成教师布置的思考题。 1 、程序案例 1 -素数判断 实验内容四: JavaScript 分支结构程序设计 1 、分支结构程序案例 1 -两个数排序