文档库 最新最全的文档下载
当前位置:文档库 › javascript对象和函数

javascript对象和函数

javascript对象和函数
javascript对象和函数

Javascript中的对象、函数和继承

前一段时间在看Extjs的源代码,起初打算从他的Widget开始看起,因为想借鉴一下并应用到自己的代码中,但是看了一段时间发现很难阅读进去,主要因为对他的整体如何组织对象和事件的方式不是很清楚。所以还是耐下性子从最基础的开始看起,什么是Extjs的基础,可以说是他的Ext.extend函数,因为之后的各个wdiget的扩展都用它来实现的。但是起初发现他的内容并不是那么容易就可以看明白的,有的时候觉得自己看明白了,但是再多问自己一个为什么,可能又答不上来了。

这个时候正好碰到一本很不错的讲JS原理书,周爱民的《Javascript语言精粹与编程实践》,如获至宝,赶紧买来阅读。在阅读的过程中又在我面前蹭蹭蹭,出现了几本很不错的js书籍,在这里也向大家推荐一下,一本是有Y ahoo的js大牛Douglas Crockeord(后文称之为老道)所著,由淘宝UED的小马和秦歌翻译的《Javascript语言精粹》,一本是《Javascript 设计模式》。最早我读的这两本书都是英文版的,所以还被第二本书中的一些观点给误导了,但是幸好看到第二本书的译者很负责任,在批注中都已经修正过来了。最后一本,其实不是书,而是《ECMAScript Language Specification》,俗称ECMA-262,有两个值得看的版本,一个是第三版,一个是第五版;现在的大部分js实现都是基于第三版的规范,但是在有些问题上,第五版描述的更加清晰一些。

废话少说,进入正题。

1、Javascript中的对象

JavaScript可以说是一个基于对象的编程语言,为什么说是基于对象而不是面向对象,因为JavaScript自身只实现了封装,而没有实现继承和多态。既然他是基于对象的,那么我们就来说说js中的对象。有人说js中所有的都是对象,这句话不完全正确。正确的一方是他强调了对象在js中的重要性,对象在js中无处不在,包括可以构造对象的函数本身也是对象。但是另一方面,js中也有一些简单的数据类型,包括数字、字符串和布尔值、null值和undefined值,而这些不是对象。那为什么这些类型的值不是对象呢,毕竟他们也有方法。那让我们来看一下,JavaScript中对于对象的定义,有两种定义。

(1)JavaScript中的对象是可变的键控集合(keyed collections)(此定义来自老道的那本书的第三章)

(2)JavaScript中的对象是无序(unordered)的属性集合,这些属性可以含有简单的数据类型、对象、函数;保存在一个对象属性中的函数也被称为这个对象的方法。(来自ECMA-262 的4.3.3)(注:这里所说的属性是可以在js脚本中创建和访问的(我们称之为显性属性),不包括系统为对象自动分配的内部属性)

那为什么那个简单的数据类型不是对象呢,主要是因为这些数据类型的值中拥有的方法是不可变的,而一个对象的属性是应当可以被改变的。

2、对象中的原型链[[proto]]

JavaScript中的每个对象创建的时候系统都会自动为其分配一个原型属性[[proto]],用来连接到他的原型对象。在JavaScript中就是通过每个对象中的[[proto]]来实现对象的继承关系的。但是对象的[[proto]]属性在JavaScript是不能访问和修改的,他是作为一个内部的属性存在的,而且是在对象被创建的同时由系统自动设定的。

当访问一个对象的某一属性,如果这个属性在此对象中不存在,就在他的[[proto]]所指

的原型对象的属性中寻找,如果找到则返回,否则继续沿着[[proto]]链一直找下去,直到[[proto]]的连接为null的时候停止。

3、函数也是对象

JavaScript中的函数本身就是一个对象(所以我们经常称之为函数对象),而且可以说他是js中最重要的对象。之所以称之为最重要的对象,一方面他可以扮演像其他语言中的函数同样的角色,可以被调用,可以被传入参数;另一方面他还被作为对象的构造器(constructor)来使用,可以结合new操作符来创建对象。

既然函数就是对象,所以必然含有对象拥有的全部性质,包括对象在创建时设定的原型链[[proto]]属性。

让我们来看看函数对象和普通对象有什么区别。我们前面说过,对象就是无序的属性集合,那么函数的属性和普通对象的属性有什么不同呢。根据ECMA-262中的13.2节所述,在函数对象创建时,系统会默认为其创建两个属性[[call]]和[[constructor]],当函数对象被当做一个普通函数调用的时候(例如myFunc()),“()”操作符指明函数对象的[[call]]属性就被执行,当他被当做一个构造器被调用的时候(例如new myConst()),他的[[constructor]]属性就被执行,[[cosntructor]]的执行过程我们将在下一节中介绍。除此之外,当一个函数被创建时,系统会默认的再为其创建一个显示属性prototype,并为其赋值为

this.prototype = {constructor:this}

具体内容可以参加老道的那本书的第五章。这个函数对象的prototype属性也是为了js把函数当做构造器来实现继承是准备的,但是这个属性是可以在js脚本中访问和修改的。在这里要强调的一点是,大家一定要区分对象中的[[proto]]属性和函数对象中的prototype属性,我在刚开始学习的时候就是因为没有很好的区分这两个东西,走了很多的弯路:(

4、对象的创建

在js中有两种创建对象的方法,一种是通过字面量来实现,如

var Person = {

“first_name”:?liang?,

…last_name?:?yang?

}

另一种方法是通过构造器来创建

var my = new Person(…liang?,?yang?);

其实第一种方式的创建过程相当于调用Object构造器来实现,如下。

var Person = new Object();

Person.first_name = …liang?;

https://www.wendangku.net/doc/a114696653.html,st_name = …yang?

所以我们可以把js中所有对象的创建都合并到使用构造器来实现,下面我么来详细说明构造器创建对象的过程:

第一步,先创建一个空的对象(既没有任何属性),并将这个对象的[[proto]]指向这个构造器函数的prototype属性对象

第二步,将这个空的对象作为this指针传给构造器函数并执行

第三步,如果上面的函数返回一个对象,则返回这个对象,否则返回第一步创建的对象

第四步,把函数当做一个类来使用

由上面的步骤我们可以看出,一般来说函数对象的prototype指向的是一个普通对象,而不是一个函数对象,这个普通对象中的属在由此函数构造器创建的对象中也可以访问。由此可以如此设计我们的代码,假设一个函数就可以代表一个类,这个构造器函数生成的对象就是这个类的实例对象,那么实例对象中应有的属性和方法应该放在这个构造器函数的prototype中,这个类的静态方法就可以直接放到这个函数作为对象的属性中,最后这个函数体就是我们平时在面向对象语言中所说的构造函数(在这里我们要区分连个词“构造函数”和“构造器函数”,所谓构造函数是指普通的面向对象语言中的类的构造函数,而构造器函数是指javascript中的一个函数被当做构造器使用)。

在第3节我们说过每个函数的prototype对象中总是含有一个constructor属性,这个属性就是连接到我们的这个函数本身。再加之,有这个函数生成的每个对象的[[proto]]属性都是指向构造器函数的prototype对象,所以通过[[proto]]链,每个由构造器函数生成的对象,都有一个constructor属性,指向生成他的构造器函数,因此我们可以通过这个属性来判断这个对象是有哪个构造器函数生成的。

5、函数继承(类继承)

说了这么多,终于到了我们可以在javascript中讨论继承的时候了,我们先来考虑一下要实现类的继承我们都要做些什么,假设我们要从superClass继承到子类subClass

为了使得由subClass生成的对象中能够访问superClass生成的对象中的属性,那么可以使subClass.prototype为一个superClass构造函数生成的对象。

subclass.prototye = new superClass();

但是问题来了,根据我们在第4节说的new superClass()不仅复制了superClass.prototype中的所有方法,而且还运行了superClass()这个函数,这个函数起到的作用是类中的构造函数。我们知道应该在子类的构造函数中调用父类的构造函数来实现初始化。为此我们可以创建一个构造函数为空的,但是原型和superClass原型一致的函数,并使subClass.prototype指向这个函数生成的对象。

var F = function(){};

F.prototype = superClass.prototype;

subClass.protptype = new F();

这样我们就可以再不调用构造函数的同时完成属性复制的工作。但是还有一个问题,那就是我们修改了subClass的prototype属性,从而也就删除了其中的constructor属性,这样我们就无法知道他是哪个构造器函数生成的对象了。我们可以再次给他赋值

subClass.prototype.constructor = subClass;

这样复制属性的问题就迎刃而解了。但是新的问题又出现了,在subClass中我们无法知道他的父类是哪个构造器函数,所以就无法在构造函数中调用父类的构造函数,为此我们可以为subClass添加一个属性,指明他的父类

subClass.superClass = superClass.prototype;

这样我么就可以在子类的构造函数中使用subClass.superClass.constructor来访问父类的构造函数了。最后我们把以上的思路写成一个函数

myPro.extend = function (subClass,superClass) {

var F = function(){};

F.prototype = superClass.prototype;

subClass.protptype = new F();

subClass.prototype.constructor = subClass;

subClass.superClass = superClass.prototype;

superClass.prototype.constructor = superClass; }

大功告成。

JavaScript面向对象简介

JavaScript面向对象简介 JavaScript 的核心是支持面向对象的,同时它也提供了强大灵活的OOP 语言能力。本文从对面向对象编程的介绍开始,带您探索JavaScript 的对象模型,最后描述 JavaScript 当中面向对象编程的一些概念。 复习JavaScript 如果您对JavaScript 的概念(如变量、类型、方法和作用域等)缺乏自信,您可以在重新介绍JavaScript这篇文章里学习这些概念。您也可以查阅这篇JavaScript 1.5 核心指南。 面向对象编程 面向对象编程是用抽象方式创建基于现实世界模型的一种编程模式。它使用先前建立的范例,包括模块化,多态和封装几种技术。今天,许多流行的编程语言(如Java,JavaScript,C#,C+ +,Python,PHP,Ruby 和Objective-C)都支持面向对象编程(OOP)。 面向对象编程可以看作是使用一系列对象相互协作的软件设计,相对于传统观念,一个程序只是一些函数的集合,或简单的计算机指令列表。在OOP中,每个对象能够接收邮件,处理数据和发送消息给其他对象。每个对象都可以被看作是一个独立的小机器有不同的作用和责任。 面向对象程序设计的目的是促进更好的编程灵活性和可维护性,并在大型软件工程中广为流行。凭借其十分注重的模块化,面向对象的代码开发更简单,往后维护更容易理解,使其自身能更直接的分析,编码,理解复杂的情况和过程,比非模块化编程方法省事。1

术语 Namespace 命名空间 允许开发人员在一个专用的名称下捆绑所有功能代码的容器。 Class 类 定义对象的特征。 Object 对象 类的一个实例。 Property 属性 对象的特征,比如颜色。 Method 方法 对象的能力,比如行走。 Constructor 构造函数 实例化时调用的函数。 Inheritance 继承 一个类可以继承另一个类的特征。 Encapsulation 封装 类定义了对象的特征,方法只定义了方法如何执行。 Abstraction 抽象 结合复杂的继承,方法,属性,一个对象能够模拟现实的模型。 Polymorphism 多态 多意为‘许多’,态意为‘形态’。不同类可以定义相同的方法或属性。更多关于面向对象编程的描述,请参照维基百科的面向对象编程。 原型编程

JavaScript复习题

复习题1 一、选择题 1、写“Hello World”的正确javascript语法是 A. ("Hello World") B. "Hello World" C. ("Hello World") D. ("Hello World") 2、JS特性不包括( ) A.解释性 B.用于客户端 C.基于对象 D.面向对象 3、下列JS的判断语句中( )是正确的 (i==0)(i=0) i==0 then i=0 then 4、下列JavaScript的循环语句中( )是正确的 (i<10;i++) (i=0;i<10) i=1 to 10 (i=0;i<=10;i++) 5、下列的哪一个表达式将返回假 A.!(3<=1) B.(4>=4)&&(5<=2) C.(“a”==”a”)&&(“c”!=”d”) D.(2<3)||(3<2) 6、下列选项中,( )不是网页中的事件 7、有语句“var x=0;while(____) x+=2;”,要使while循环体执行10次,空白处的循环判定式应写为: A.x<10 B. x<=10 <20 <=20 8、JS语句 var a1=10; var a2=20; alert(“a1+a2=”+a1+a2) 将显示( )结果 +a2=30 +a2=1020+a2=a1+a2 9、将字串s中的所有字母变为小写字母的方法是( ) 、以下( )表达式产生一个0~7之间(含0,7)的随机整数. . floor()*8) 11、产生当前日期的方法是( ) (); () Date() Now() 12、如果想在网页显示后,动态地改变网页的标题( ) A.是不可能的 B.通过(“新的标题内容”) C. 通过=(“新的标题内容”) D. 通过(“新的标题内容”) 13、某网页中有一个窗体对象,其名称是mainForm,该窗体对象的第一个元素是按钮,其名称是myButton,表述该按钮对象的方法是()

javascript 内置函数和对象

实验项目三内置函数和对象 【学时数】 2 (45 分钟× 2=90 分钟) 【实验内容】 1 、JavaScript 内置函数的应用 2 、JavaScript 内置对象的应用 【实验参考】 《网页设计与制作》………………………………………………………… 重庆大学出版社 《网页标题制作技巧与实例》……………………………………………… 清华大学出版社 《javascript 入门与提高》……………………………………………… 清华大学出版社 《javascript 宝典》……………………………………………………… 电子工业出版社 【实验设备】 计算机,投影机 【实验目的与要求】 1 、掌握JavaScript 内置函数的使用方法 2 、掌握JavaScript 常用内置对象的属性和方法 【实验重点】 1 、掌握JavaScript 内置函数的使用方法 2 、掌握JavaScript 常用内置对象的属性和方法 【实验难点】 1 、掌握使用浏览器对象提供的信息来完成一定功能的网页设计。 【实验方式】 1 、项目工程互动式教学法 2 、“讲、学、练”相结合:对于javascript 内置函数和对象相关细节,大量采用演示、讲解和操作等方式。使学生在实验中加深对相关内容的理解并熟练掌握。 【实验设计】 向学生演示多个javascrip 内置函数和对象的程序案例,学生跟着教师一起完成javascript 程序的编写,同时完成教师布置的思考题,教师实施指导。 第一步:演示JavaScript 内置函数的应用,学生按照教师的操作步骤,自己动手编写该程序,并完成教师布置的思考题。(20 分钟左右)第二步:演示JavaScript 常用内置对象的应用,学生按照教师的操作步骤,自己动手编写该程序,并完成教师布置的思考题。(35 分钟左右) 【实验过程】 实验内容一:JavaScript 内置函数的应用

基于对象的JavaScript语言

基于对象的JavaScript语言 一、对象的基本结构 JavaScript中的对象是由属性(properties)和方法(methods)两个基本的元素的构成的。属性是对象在实施其所需要行为的过程中,实现信息的装载单位,从而与变量相关联;方法是指对象能够按照设计者的意图而被执行,从而与特定的函数相联。 二、引用对象的途径 一个对象要真正地被使用,可采用以下几种方式获得: 1、引用JavaScript内部对象;this window 2、由浏览器环境中提供;https://www.wendangku.net/doc/a114696653.html, 3、创建新对象。new 这就是说一个对象在被引用之前,这个对象必须存在,否则引用将毫无意义,而出现错误信息。 三、有关对象操作语句 1、For...in语句 格式如下:For(对象属性名in 已知对象名) 说明:该功能是用于对已知对象的所有属性进行操作的循环控制。它是将一个已知对象的所有属性反复置给一个变量;而不是使用计数器来实现的。它的优点是无需知道对象中属性的个数即可进行操作。 2、with语句 使用该语句的意思是:在该语句体内,任何对变量的引用被认为是这个对象的属性,以节省一些代码。with object{ ...} 所有在with语句后的花括号中的语句,都是在后面object对象的作用域的。 3、this关键字 this是对当前的引用,在JavaScript由于对象的引用是多层次,多方位的,往往一个对象的引用又需要对另一个对象的引用,而另一个对象有可能又要引用另一个对象,这样有可能造成混乱,最后自己已不知道现在引用的那一个对象,为此JavaScript提供了一个用于将对象指定当前对象的语句this。 4、New运算符可以创建一个新的对象 格式:

理解JavaScript中函数的使用

理解JavaScript中函数的使用 函数是进行模块化程序设计的基础,编写复杂的Ajax应用程序,必须对函数有更深入的了解。 JavaScript中的函数不同于其他的语言,每个函数都是作为一个对象被维护和运行的。通过函数对象的性质,可以很方便的将一个函数赋值给一个变量或者将函数作为参数传递。在继续讲述之前,先看一下函数的使用语法: function func1(…){…} var func2=function(…){…}; var func3=function func4(…){…}; var func5=new Function(); 这些都是声明函数的正确语法。它们和其他语言中常见的函数或之前介绍的函数定义方式有着很大的区别。那么在JavaScript中为什么能这么写?它所遵循的语法是什么呢?下面将介绍这些内容。 认识函数对象(Function Object) 可以用function关键字定义一个函数,并为每个函数指定一个函数名,通过函数名来进行调用。在JavaScript解释执行时,函数都是被维护为一个对象,这就是要介绍的函数对象(Function Object)。 函数对象与其他用户所定义的对象有着本质的区别,这一类对象被称之为内部对象,例如日期对象(Date)、数组对象(Array)、字符串对象(String)都属于内部对象。这些内置对象的构造器是由JavaScript本身所定义的:通过执行new Array()这样的语句返回一个对象,JavaScript内部有一套机制来初始化返回的对象,而不是由用户来指定对象的构造方式。 在JavaScript中,函数对象对应的类型是Function,正如数组对象对应的类型是Array,日期对象对应的类型是Date一样,可以通过new Function()来创建一个函数对象,也可以通过function关键字来创建一个对象。为了便于理解,我们比较函数对象的创建和数组对象的创建。先看数组对象:下面两行代码都是创建一个数组对象myArray: var myArray=[]; //等价于 var myArray=new Array();

Javascript鼠标触发事件大全

Javascript鼠标事件大全 一般事件 事件浏览器支持描述 onClick IE3|N2|O3 鼠标点击事件,多用在某个对象控制的范围内的鼠标点击 onDblClick IE4|N4|O 鼠标双击事件onMouseDown IE4|N4|O 鼠标上的按钮被按下了onMouseUp IE4|N4|O 鼠标按下后,松开时激发的事件 onMouseOver IE3|N2|O3 当鼠标移动到某对象范围的上方时触发的事件 onMouseMove IE4|N4|O 鼠标移动时触发的事件 onMouseOut IE4|N3|O3 当鼠标离开某对象范围时触发的事件 onKeyPress IE4|N4|O 当键盘上的某个键被按下并且释放时触发的事件.[注意:页面内必须有被聚焦的对象] onKeyDown IE4|N4|O 当键盘上某个按键被按下时触发的事件[注意:页面内必须有被聚焦的对象] onKeyUp IE4|N4|O 当键盘上某个按键被按放开时触发的事件[注意:页面内必须有被聚焦的对象] 页面相关事件 事件浏览器支持描述 onAbort IE4|N3|O 图片在下载时被用户中断 onBeforeUnload IE4|N|O 当前页面的内容将要被改变时触发的事件 onError IE4|N3|O 捕抓当前页面因为某种原因而出现的错误,如脚本错误与外部数据引用的错误 onLoad IE3|N2|O3 页面内空完成传送到浏览器时触发的事件,包括外部文件引入完成 onMove IE|N4|O 浏览器的窗口被移动时触发的事件onResize IE4|N4|O 当浏览器的窗口大小被改变时触发

JavaScript面向对象编程(最终版)

JavaScript面向对象编程 1、引言 JavaScript是一种解释性的,基于对象的脚本语言(an interpreted, object-based scripting language)。JavaScript 基于客户端运行,目前基本上所有的浏览器都支持JavaScript。1995年首次出现时,JavaScript的主要目的还只是处理一些输入的有效性验证,随着互联网的蓬勃发展,JavaScript的应用越来越广泛,特别是近几年AJAX技术(Asynchronous JavaScript and XML)的发展,更使JavaScript的应用达到了一个新的高度。在AJAX技术中,JavaScript是一项关键技术,请求的发送、接收、接收数据后的界面处理都需要使用JavaScript技术,这对JavaScript语言提出了新的需求,本文从JavaScript的基本特点出发,模拟出了面向对象编程的大部分特点,使JavaScript摆脱了以往脚本语言杂乱无章、难以阅读、难以维护的形象,而具有了面向对象特性,极大的方便了JavaScript的开发、维护,提高了软件开发效率。 2、JavaScript的基本特点 JavaScript是解释性的,基于对象的脚本语言。它有下面几个显著特点,这几个特点在后面的面向对象特性模拟中会反复用到,因此这里先详细说明这几个特点。 解释型语言:JavaScript是一种解释性语言,解释性语言相对于编译型语言,编译型语言必须先通过编译才能执行,而解释性语言不需要编 译,直接从上到下解释执行,一边解释一边执行,这就决定了解释性语 言的代码是有先后顺序的,需要执行的代码必须已经解释过。因此, JavaScript需要注意代码的先后顺序。

Javascript自执行匿名函数(function { }) 的原理浅析

Javascript自执行匿名函数(function { }) 的原理浅析 匿名函数就是没有函数名的函数。这篇文章主要介绍了Javascript自执行匿名函数(function { }) 的原理浅析的相关资料,需要的朋友可以参考下 函数是JavaScript中最灵活的一种对象,这里只是讲解其匿名函数的用途。匿名函数指没有指定函数名或指针的函数,自执行匿名函数只是其中一种,下文中称这种函数为:自执行函数 下面是一个最常见的自执行函数: // 传统匿名函数 (function { alert('hello'); }) ; 这段代码的执行效果就是在页面再载入时弹出:"hello" 是什么促使它自动执行的?,来看下面的代码 // 在传统写法上去掉小括号,并在前面加上运算符~,!,+,- ~function { alert('hello'); } ;

!function { alert('hello'); } ; +function { alert('hello'); } ; -function { alert('hello'); } ; 这些写法与上文所说的传统方式执行起来并无区别, 我发现,这些写法的共同点是运算符,其实传统方式的小括号也属于运算的一种,出现在:a=b*(c+d),运算符 + 传递给自生的参数 = 函数自动执行?但有些符号也不支持,比如“=,*,/”号,它自执行的原因还是很神秘,网上也找不到像样的答案 然后我发现了一个神奇的现象,这些运算符可以无限叠加。。。。。。 // function前面是特定符号可以无限叠加... ~!+-~!+-+-!~!+-~!+-+-!~!+-~!+-+-!~!+-~!+-+-!~!+-~!+ -+-!~!+-~!+-+-!~!+-~!+-+-!~!+-~!+-+-!~!+-~!+-+-!~!+ -~!+-+-!~!+-~!+-+-!~!+-~!+-+-!~!+-~!+-+-!~!+-~!+-+-

javascript键盘事件

主要分四个部分 第一部分:浏览器的按键事件 第二部分:兼容浏览器 第三部分:代码实现和优化 第四部分:总结 第一部分:浏览器的按键事件 用js实现键盘记录,要关注浏览器的三种按键事件类型,即keydown,keypress和keyup,它们分别对应onkeydown、onkeypress和onkeyup这三个事件句柄。一个典型的按键会产生所有这三种事件,依次是keydown,keypress,然后是按键释放时候的keyup。 在这3种事件类型中,keydown和keyup比较底层,而keypress比较高级。这里所谓的高级是指,当用户按下shift + 1时,keypress是对这个按键事件进行解析后返回一个可打印的“!”字符,而keydown和keyup只是记录了shift + 1这个事件。[1] 但是keypress只能针对一些可以打印出来的字符有效,而对于功能按键,如F1-F12、Backspace、Enter、Escape、PageUP、PageDown和箭头方向等,就不会产生keypress事件,但是可以产生keydown和keyup事件。然而在FireFox中,功能按键是可以产生keypress 事件的。 传递给keydown、keypress和keyup事件句柄的事件对象有一些通用的属性。如果Alt、Ctrl 或Shift和一个按键一起按下,这通过事件的altKey、ctrlKey和shiftKey属性表示,这些属性在FireFox和IE中是通用的。 第二部分:兼容浏览器 凡是涉及浏览器的js,就都要考虑浏览器兼容的问题。 目前常用的浏览器主要有基于IE和基于Mozilla两大类。Maxthon是基于IE内核的,而FireFox和Opera是基于Mozilla内核的。 2.1 事件的初始化 首先需要了解的是如何初始化该事件,基本语句如下: function keyDown(){} document.onkeydown = keyDown; 当浏览器读到这个语句时,无论按下键盘上的哪个键,都将呼叫KeyDown()函数。 2.2 FireFox和Opera的实现方法 FireFox和Opera等程序实现要比IE麻烦,所以这里先描述一下。 keyDown()函数有一个隐藏的变量--一般的,我们使用字母“e”来表示这个变量。 function keyDown(e) 变量e表示发生击键事件,寻找是哪个键被按下,要使用which这个属性: e.which

实验项目21—JAVASCRIPT内置函数和对象

实验难点 实验内容实验目的 实验重点实验步骤 实验内容 1、JavaScript 内置函数的应用 2、JavaScript 内置对象的应用 3、JavaScript 浏览器对象的应用

实验难点实验内容实验目的实验重点实验步骤 实验目的 1、掌握JavaScript 内置函数的使用方法 2、掌握JavaScript 常用内置对象的属性和方法 3、掌握JavaScript 浏览器对象的含义 4、掌握使用浏览器对象提供的信息来完成一定功能的网页设计。

实验难点 实验内容实验目的实验重点实验步骤 实验重点 1、掌握JavaScript 内置函数的使用方法 2、掌握JavaScript 常用内置对象的属性和方法 3、掌握JavaScript 浏览器对象的含义

实验难点 实验内容实验目的实验重点 实验步骤 实验难点 1、掌握使用浏览器对象提供的信息来完成一定功能的网页设计。

实验难点 实验内容 实验目的 实验重点 实验步骤实验内容一:JavaScript 内置函数的应用 1、eval( ):计算字符串表达式的值 2、parseFloat( )和parseInt( ):将字符串开头的整数或浮点数分解出来,转换为整数或浮点数 3、isNaN( ):确定一个变量是否为NaN (Not a Number ) 4、escape( ):将字符串中的非字母数字字符转换为按格式%XX 表示的数字 5、unescape( ):将字符串格式为%XX 的数字转换为字符 6、程序案例1_1:求用户在提示对话框中输入的表达式的值。 7、思考题: 判断用户输入的字符是不是数字,如果是,分别将其转换成浮点数和整数,并显示到网页上。

如何判断Javascript对象是否为空

如何判断Javascript对象是否存在 Javascript语言的设计不够严谨,很多地方一不小心就会出错。 举例来说,请考虑以下情况。 现在,我们要判断一个全局对象myObj是否存在,如果不存在,就对它进行声明。用自然语言描述的算法如下: if (myObj不存在){ 声明myObj; } 你可能会觉得,写出这段代码很容易。但是实际上,它涉及的语法问题,远比我们想象的复杂。Juriy Zaytsev指出,判断一个Javascript对象是否存在,有超过50种写法。只有对Javascript语言的实现细节非常清楚,才可能分得清它们的区别。 第一种写法 根据直觉,你可能觉得可以这样写: if (!myObj) {

myObj = { }; } 但是,运行这段代码,浏览器会直接抛出ReferenceError错误,导致运行中断。请问错在哪里? 对了,if语句判断myObj是否为空时,这个变量还不存在,所以才会报错。改成下面这样,就能正确运行了。 if (!myObj) { var myObj = { }; } 为什么加了一个var以后,就不报错了?难道这种情况下,if语句做判断时,myObj 就已经存在了吗? 要回答这个问题,就必须知道Javascript解释器的工作方式。Javascript语言是"先解析,后运行",解析时就已经完成了变量声明,所以上面的代码实际等同于:var myObj; if (!myObj) { var myObj = { };

因此,if语句做判断时,myObj确实已经存在了,所以就不报错了。这就是var 命令的"代码提升"(hoisting)作用。Javascript解释器,只"提升"var命令定义的变量,对不使用var命令、直接赋值的变量不起作用,这就是为什么不加var会报错的原因。 第二种写法 除了var命令,还可以有另一种改写,也能得到正确的结果: if (!window.myObj) { myObj = { }; } window是javascript的顶层对象,所有的全局变量都是它的属性。所以,判断myobj是否为空,等同于判断window对象是否有myobj属性,这样就可以避免因为myObj没有定义而出现ReferenceError错误。不过,从代码的规范性考虑,最好还是对第二行加上var: if (!window.myObj) { var myObj = { };

javascript函数库(全)

转载请注明出处-中国设计秀https://www.wendangku.net/doc/a114696653.html, /* -------------- 函数检索-------------- trim函数: trim() lTrim() rTrim() 校验字符串是否为空: checkIsNotEmpty(str) 校验字符串是否为整型: checkIsInteger(str) 校验整型最小值: checkIntegerMinValue(str,val) 校验整型最大值: checkIntegerMaxValue(str,val) 校验整型是否为非负数: isNotNegativeInteger(str) 校验字符串是否为浮点型: checkIsDouble(str) 校验浮点型最小值: checkDoubleMinValue(str,val) 校验浮点型最大值: checkDoubleMaxValue(str,val) 校验浮点型是否为非负数: isNotNegativeDouble(str) 校验字符串是否为日期型: checkIsValidDate(str) 校验两个日期的先后: checkDateEarlier(strStart,strEnd) 校验字符串是否为email型: checkEmail(str) 校验字符串是否为中文: checkIsChinese(str) 计算字符串的长度,一个汉字两个字符: realLength() 校验字符串是否符合自定义正则表达式: checkMask(str,pat) 得到文件的后缀名: getFilePostfix(oFile) -------------- 函数检索-------------- */ /** * added by LxcJie 2004.6.25 * 去除多余空格函数 * trim:去除两边空格lTrim:去除左空格rTrim: 去除右空格 * 用法: * var str = " hello "; * str = str.trim(); */ String.prototype.trim = function() { $)/g,return this.replace(/(^[\s]*)|([\s]* ""); } String.prototype.lTrim = function() { return this.replace(/(^[\s]*)/g, ""); } String.prototype.rTrim = function() { $)/g,return this.replace(/([\s]* ""); } /********************************** Empty **************************************/ /** *校验字符串是否为空 *返回值: *如果不为空,定义校验通过,返回true *如果为空,校验不通过,返回false 参考提示信息:输入域不能为空! */

JavaScript试题集

.单选题 1. 我们可以在下列哪个HTML元素中放置javascript代码? A.< script > B.< javascript > C.< js > D.< scripting > ★标准答案:A 2. 预测以下代码片段的输出结果: var str ; alert(typeof str); A.. string ; B.. undefined; C.. object ; D.. String; ★标准答案:B 3. 下列哪个不是Javascript中注释的正确写法:() A.< !-- …… -- > B. *……*/ D. /* …… */ ★标准答案:A 4. 以下哪项不属于Javascript的特征? 是一种脚本语言 是事件驱动的 代码需要编译以后才能执行

是独立于平台的 ★标准答案:C 5. 关于以下两个陈述的描述中,正确的是:() 陈述1:Javascript是弱类型语言 陈述2:Javascript的常用类型包括:int、string、boolean A.陈述1正确,陈述2错误 B.陈述1错误,陈述2正确 C.两个陈述都正确 D.两个陈述都错误 ★标准答案:A 6. 阅读下面的JavaScript代码: < HTML > < BODY > < SCRIPT LANGUAGE="JavaScript" > function f(y) { var x=y*y; return x; } for(x=0;x< 5;x++) { y=f(x); (y); } < /SCRIPT > < /BODY > < /HTML > 输出结果是()。 1 2 3 4 1 4 9 16 1 4 9 16 25 D.以上答案都不对 ★标准答案:B 7. 在Javascript中,需要声明一个整数类型的变量num,以下哪个语句能实现上述要求? num;

javascript常用函数集

javascript常用函数集 javascript提供了许多函数供开发人员使用,下面给出一个简单介绍,更详细的信息请参考Visual InterDev提供的在线关心。 javascript函数一共可分为五类: ·常规函数 ·数组函数 ·日期函数 ·数学函数 ·字符串函数 1.常规函数 javascript常规函数包括以下9个函数: (1)alert函数:显示一个警告对话框,包括一个OK按钮。 (2)confirm函数:显示一个确认对话框,包括OK、Cancel按钮。 (3)escape函数:将字符转换成Unicode码。 (4)eval函数:运算表达式的结果。 (5)isNaN函数:测试是(true)否(false)不是一个数字。 (6)parseFloat函数:将字符串转换成符点数字形式。 (7)parseInt函数:将符串转换成整数数字形式(可指定几进制)。 (8)prompt函数:显示一个输入对话框,提示等待用户输入。例如: eval( )内置函数的用法:计算字符串表达式的值。

提升JavaScript运行速度之函数篇

提升JavaScript运行速度之函数篇 这篇是Nicholas讨论如果防止脚本失控的第二篇,主要讨论了如何重构嵌套循环、递归,以及那些在函数内部同时执行很多子操作的函数。基本的思想和上一节trunk()那个例子一致,如果几个操作没有特定的执行顺序,而且互相不是依赖关系,我们就可以通过异步调用的方式加以执行,不止可以减少执行的次数,还可以防止脚本失控。本文还介绍了通过memoization技术取代递归的方法。 【原文标题】Speed up your JavaScript,Part2 【原文作者】Nicholas C.Zakas 以下是对原文的翻译: 上周我在《too much happening in a loop》(译文)这篇文章中介绍了JavaScript运行时间过长的第一个原因。相似的情况有时也出现在函数的定义上,函数也可能因为使用不当而过载使用。通常情况是函数内包含了过多的循环(不是在循环中执行了过多的内容),太多的递归,或者只不过是太多不相干但又要一起执行的操作。 太多的循环经常是以嵌套的形式出现,这种代码会一直占用JavaScript引擎直至循环结束。这方面有一个非常着名的例子,就是使用冒泡算法排序。由于JavaScript有内置的sort ()方法,我们没有必要使用这种方式进行排序,但我们可以借助这个算法理解嵌套循环占用资源的症结所在,从而避免类似情况的发生。下面是一个在JavaScript使用冒泡排序法的典型例子: function bubbleSort(items){ for(var i=items.length-1;i>=0;i--){ for(var j=i;j>=0;j--){ if(items[j]

javascript试题

在HTML中,表单中的input元素的()属性用于指定表单元素的名称。 A. value B. name C. type D. caption 当表单各项填写完毕,鼠标单击提交按钮时可以触发()事件。 A. onenter B. onsubmit C. onmouseDrag D. onmouseOver 分析下面的JavaScript代码段,输出结果是()。 var a=15.59; document.write(Math.round(a)); A. 15 B. 16 C. 15.5 D. 15.4 要求用JavaScript实现下面的功能:在一个文本框中内容发生改变后,单击页面的其他部分将弹出一个消息框显示文本框中的内容。下面语句正确的是()。 A. B. C. D. 假定今天是2006年4月1日星期六,请问下列JavaScript代码在页面上的输出结果是()。var time=new Date(); document.write(time.getDate()); A. 2006 B. 4 C. 1 D. 6 下面描述正确的是()。 A. switch语句用于重复执行一个语句块的操作 B. switch语句根据表达式的值执行若干语句块之一,如果没有匹配项,则执行默认语句块中的语句 C. switch语句表达式中的值不能与后面case语句中的常量相匹配时将出现运行错误 D. switch语句又叫循环语句 分析如下JavaScript代码,b的值为()。 var a=1.5 ,b; b=parseInt(a); A. 2 B. 0.5 C. 1 D. 1.5 在HTML中,使用JavaScript中的浏览器对象实现在当前窗口打开链接"https://www.wendangku.net/doc/a114696653.html,"的javascript语句是()。 A. window.open("https://www.wendangku.net/doc/a114696653.html,"); B. document.write("https://www.wendangku.net/doc/a114696653.html,"); C. location.replace("https://www.wendangku.net/doc/a114696653.html,"); D. location.reload("https://www.wendangku.net/doc/a114696653.html,"); 如果今天是2006年5月14日,分析下列JavaScript代码运行后,在网页上显示()。 var now = new Date(); var year = now.getYear(); var month = now.getMonth(); var date = now.getDate(); document.write(year+" "+month+" "+date); A. 2006 05 14 B. 2006 5 14 C. 2006 04 14 D. 2006 4 14 在HTML中有如下代码,运行后页面显示结果为()。

相关文档