- 浏览: 1068665 次
- 性别:
- 来自: 天津
文章分类
- 全部博客 (314)
- java 技术 (45)
- Java Util (3)
- Struts2 学习笔记 (23)
- MySql@数据库 (18)
- Oracle@数据库 (4)
- sqlserver@数据库 (20)
- Hibernate配置及应用 (7)
- 基础学习笔记@javaScript (24)
- 常用应用实例@javaScript (41)
- 网页设计 (20)
- bug (13)
- 总结 (4)
- eclipse应用 (23)
- tomcat设置及问题 (15)
- SWFUplaod学习笔记 (7)
- C# (5)
- PPT经验技巧 (8)
- 心情随笔 (3)
- 其他 (19)
- jquery (4)
- sping (1)
- json相关 (2)
最新评论
-
流年已逝_奋斗不止2013:
很有用,谢谢!
HQL select 总结 -
qq_31945283:
完美解决了我的难题,谢谢
四、struts2+swfUpload例子二 -
qq_31945283:
...
四、struts2+swfUpload例子二 -
sunbingrun:
集成到我的项目里, 居然post_params: {&quo ...
三、struts2+swfUpload简单例子 -
flyarun:
牛B ,这种人就是我的偶像
四、struts2+swfUpload例子二
类、构造函数、原型
先来说明一点:在上面的内容中提到,每一个函数都包含了一个prototype属性,这个属性指向了一个prototype对象(Every function has a prototype property that refers to a predefined prototype object --section8.6.2).注意不要
搞混了.
构造函数:
new操作符用来生成一个新的对象.new后面必须要跟上一个函数,也就是我们常说的构造函数.构造函数的工作原理又是怎样的呢?
先看一个例子:
下面说明一下这个工作的步骤:
开始创建了一个函数(不是方法,只是一个普通的函数),注意用到了this关键字.以前我们提到过this关键字表示调用该方法的对象,也就是说通过对象调用"方法"的时候,this关键字会指向该对象(不使用对象直接调用该函数则this指向整个的script域,或者函数所在的域,在此我们不做详细的讨论).当我们使用new操作符时,javascript会先创建一个空的对象,然后这个对象被new后面的方法(函数)的this关键字引用!然后在方法中通过操作this,就给这个新创建的对象相应的赋予了属性.最后返回这个经过处理的对象.这样上面的例子就很清楚:先创建一个空对象,然后调用Person方法对其进行赋值,最后返回该对象,我们就得到了一个per对象.
prototype(原型)--在这里会反复提到"原型对象"和"原型属性",注意区分这两个概念.
在javascript中,每个对象都有一个prototype属性,这个属性指向了一个prototype对象.
上面我们提到了用new来创建一个对象的过程,事实上在这个过程中,当创建了空对象后,new会接着操作刚生成的这个对象的prototype属性.
每个方法都有一个prototype属性(因为方法本身也是对象),new操作符生成的新对象的prototype属性值和构造方法的prototype属性值是一致的.构造方法的prototype属性指向了一个prototype对象,这个prototype对象初始只有一个属性constructor,而这个constructor属性又指向了prototype属性所在的方法
(In the previous section, I showed that the new operator creates a new, empty object and then invokes a constructor function as a method of that object. This is not the complete story, however. After creating the empty object, new sets the prototype of that object. The prototype of an object is the value of the prototype property of its
constructor function. All functions have a prototype property that is automatically created and initialized when the function is defined. The initial value of the prototype property is an object with a single property. This property is named constructor and refers back to the constructor function with which the prototype is associated. this is why every object has a constructor property. Any properties you add to this prototype object will appear to be properties of
objects initialized by the constructor. -----section9.2)
这样,当用构造函数创建一个新的对象时,它会获取构造函数的prototype属性所指向的prototype对象的所有属性.对构造函数对应的prototype对象所做的任何操作都会反应到它所生成的对象身上,所有的这些对象共享构造函数对应的prototype对象的属性(包括方法).
看个具体的例子吧:
到目前为止,我们已经模拟出了简单的类的实现,我们有了构造函数,有了类属性,有了类方法,可以创建"实例".
在下面的文章中,我们就用"类"这个名字来代替构造方法,但是,这仅仅是模拟,并不是真正的面向对象的"类".
在下一步的介绍之前,我们先来看看改变对象的prototype属性和设置prototype属性的注意事项:
给出一种不是很恰当的解释,或许有助于我们理解:当我们new了一个对象之后,这个对象就会获得构造函数的prototype属性(包括函数和变量),可以认为是构造函数(类)继承了它的prototype属性对应的prototype对象的函数和变量,也就是说,prototype对象模拟了一个超类的效果.听着比较拗口,我们直接看个实例吧:
看过一篇文章介绍说javascript中对象的prototype属性相当于java中的static变量,可以被这个类下的所有对象共用.
而上面的例子似乎表明实际情况并不是这样:
在JS中,当我们用new操作符创建了一个类的实例对象后,它的方法和属性确实继承了类的prototype属性,类的prototype属性中定义的方法和属性,确实可以被这些实例对象直接引用.但是,当我们对这些实例对象的属性和方法重新赋值或定义后,那么实例对象的属性或方法就不再指向类的prototype属性中定义的属性和方法,此时,即使再对类的prototype属性中相应的方法或属性做修改,也不会反应在实例对象身上.这就解释了上面的例子:
一开始,用new操作符生成了两个对象p1,p2,他们的age属性和print方法都来自(继承于)Person类的prototype属性.然后,我们修改了p1的age属性,后面对Person类的prototype属性中的age重新赋值(Person.prototype.age = 22),p1的age属性并不会
随之改变,但是p2的age属性却随之发生了变化,因为p2的age属性还是引自Person类的prototype属性.同样的情况在后面的print方法中也体现了出来.
通过上面的介绍,我们知道prototype属性在javascript中模拟了父类(超类)的角色,在js中体现面向对象的思想,prototype属性是非常关键的.
先来说明一点:在上面的内容中提到,每一个函数都包含了一个prototype属性,这个属性指向了一个prototype对象(Every function has a prototype property that refers to a predefined prototype object --section8.6.2).注意不要
搞混了.
构造函数:
new操作符用来生成一个新的对象.new后面必须要跟上一个函数,也就是我们常说的构造函数.构造函数的工作原理又是怎样的呢?
先看一个例子:
function Person(name,sex) { this.name = name; this.sex = sex; } var per = new Person("sdcyst","male"); alert("name:"+per.name+"_sex:"+per.sex); //name:sdcyst_sex:male
下面说明一下这个工作的步骤:
开始创建了一个函数(不是方法,只是一个普通的函数),注意用到了this关键字.以前我们提到过this关键字表示调用该方法的对象,也就是说通过对象调用"方法"的时候,this关键字会指向该对象(不使用对象直接调用该函数则this指向整个的script域,或者函数所在的域,在此我们不做详细的讨论).当我们使用new操作符时,javascript会先创建一个空的对象,然后这个对象被new后面的方法(函数)的this关键字引用!然后在方法中通过操作this,就给这个新创建的对象相应的赋予了属性.最后返回这个经过处理的对象.这样上面的例子就很清楚:先创建一个空对象,然后调用Person方法对其进行赋值,最后返回该对象,我们就得到了一个per对象.
prototype(原型)--在这里会反复提到"原型对象"和"原型属性",注意区分这两个概念.
在javascript中,每个对象都有一个prototype属性,这个属性指向了一个prototype对象.
上面我们提到了用new来创建一个对象的过程,事实上在这个过程中,当创建了空对象后,new会接着操作刚生成的这个对象的prototype属性.
每个方法都有一个prototype属性(因为方法本身也是对象),new操作符生成的新对象的prototype属性值和构造方法的prototype属性值是一致的.构造方法的prototype属性指向了一个prototype对象,这个prototype对象初始只有一个属性constructor,而这个constructor属性又指向了prototype属性所在的方法
(In the previous section, I showed that the new operator creates a new, empty object and then invokes a constructor function as a method of that object. This is not the complete story, however. After creating the empty object, new sets the prototype of that object. The prototype of an object is the value of the prototype property of its
constructor function. All functions have a prototype property that is automatically created and initialized when the function is defined. The initial value of the prototype property is an object with a single property. This property is named constructor and refers back to the constructor function with which the prototype is associated. this is why every object has a constructor property. Any properties you add to this prototype object will appear to be properties of
objects initialized by the constructor. -----section9.2)
这样,当用构造函数创建一个新的对象时,它会获取构造函数的prototype属性所指向的prototype对象的所有属性.对构造函数对应的prototype对象所做的任何操作都会反应到它所生成的对象身上,所有的这些对象共享构造函数对应的prototype对象的属性(包括方法).
看个具体的例子吧:
function Person(name,sex) { //构造函数 this.name = name; this.sex = sex; } Person.prototype.age = 12; //为prototype属性对应的prototype对象的属性赋值 Person.prototype.print = function() { //添加方法 alert(this.name+"_"+this.sex+"_"+this.age); }; var p1 = new Person("name1","male"); var p2 = new Person("name2","male"); p1.print(); //name1_male_12 p2.print(); //name2_male_12 Person.prototype.age = 18; //改变prototype对象的属性值,注意是操作构造函数的prototype属性 p1.print(); //name1_male_18 p2.print(); //name2_male_18
到目前为止,我们已经模拟出了简单的类的实现,我们有了构造函数,有了类属性,有了类方法,可以创建"实例".
在下面的文章中,我们就用"类"这个名字来代替构造方法,但是,这仅仅是模拟,并不是真正的面向对象的"类".
在下一步的介绍之前,我们先来看看改变对象的prototype属性和设置prototype属性的注意事项:
给出一种不是很恰当的解释,或许有助于我们理解:当我们new了一个对象之后,这个对象就会获得构造函数的prototype属性(包括函数和变量),可以认为是构造函数(类)继承了它的prototype属性对应的prototype对象的函数和变量,也就是说,prototype对象模拟了一个超类的效果.听着比较拗口,我们直接看个实例吧:
function Person(name,sex) { //Person类的构造函数 this.name = name; this.sex = sex; } Person.prototype.age = 12; //为Person类的prototype属性对应的prototype对象的属性赋值, //相当于为Person类的父类添加属性 Person.prototype.print = function() { //为Person类的父类添加方法 alert(this.name+"_"+this.sex+"_"+this.age); }; var p1 = new Person("name1","male"); //p1的age属性继承子Person类的父类(即prototype对象) var p2 = new Person("name2","male"); p1.print(); //name1_male_12 p2.print(); //name2_male_12 p1.age = 34; //改变p1实例的age属性 p1.print(); //name1_male_34 p2.print(); //name2_male_12 Person.prototype.age = 22; //改变Person类的超类的age属性 p1.print(); //name1_male_34(p1的age属性并没有随着prototype属性的改变而改变) p2.print(); //name2_male_22(p2的age属性发生了改变) p1.print = function() { //改变p1对象的print方法 alert("i am p1"); } p1.print(); //i am p1(p1的方法发生了改变) p2.print(); //name2_male_22(p2的方法并没有改变) Person.prototype.print = function() { //改变Person超类的print方法 alert("new print method!"); } p1.print(); //i am p1(p1的print方法仍旧是自己的方法) p2.print(); //new print method!(p2的print方法随着超类方法的改变而改变)
看过一篇文章介绍说javascript中对象的prototype属性相当于java中的static变量,可以被这个类下的所有对象共用.
而上面的例子似乎表明实际情况并不是这样:
在JS中,当我们用new操作符创建了一个类的实例对象后,它的方法和属性确实继承了类的prototype属性,类的prototype属性中定义的方法和属性,确实可以被这些实例对象直接引用.但是,当我们对这些实例对象的属性和方法重新赋值或定义后,那么实例对象的属性或方法就不再指向类的prototype属性中定义的属性和方法,此时,即使再对类的prototype属性中相应的方法或属性做修改,也不会反应在实例对象身上.这就解释了上面的例子:
一开始,用new操作符生成了两个对象p1,p2,他们的age属性和print方法都来自(继承于)Person类的prototype属性.然后,我们修改了p1的age属性,后面对Person类的prototype属性中的age重新赋值(Person.prototype.age = 22),p1的age属性并不会
随之改变,但是p2的age属性却随之发生了变化,因为p2的age属性还是引自Person类的prototype属性.同样的情况在后面的print方法中也体现了出来.
通过上面的介绍,我们知道prototype属性在javascript中模拟了父类(超类)的角色,在js中体现面向对象的思想,prototype属性是非常关键的.
发表评论
-
[转载] 认识js中的function和this---new Function(a,b,body)方式
2016-09-20 11:05 572javascript中的函数不同于其他的语言,每个函数都是作为 ... -
javascript面向对象技术基础(六)
2009-03-03 09:49 1075作用域、闭包、模拟私 ... -
javascript面向对象技术基础(五)
2009-03-03 09:31 1030类变量/类方法/实例变量/实例方法 先补充一下以前写过的方法: ... -
javacript 刷新页面的不同方法
2009-02-26 21:06 1492下面以三个页面分别命名为frame.html、top.html ... -
javascript面向对象技术基础(三)
2009-02-05 08:44 1207函数 javascript函数相信 ... -
javascript面向对象技术基础(二)
2009-02-04 17:13 1036数组 我们已经提到过, ... -
javascript面向对象技术基础(一)
2009-02-04 08:51 1189看了很多介绍javascript面 ... -
JavaScript编写的Copy功能(兼容Firefox)
2009-01-09 12:18 4086Firefox 不支持 obj.innerText 属性。 ... -
IE和FireFox兼容JS问题
2008-12-23 11:47 11061. document.form.item 问题 (1 ... -
window 对像
2008-11-25 10:12 1447一、window对像的常用属 ... -
return、confirm 使用返回值改变默认行为
2008-11-20 08:54 4001使用返回值改变默认行为 1、return <a hre ... -
使用正则表达式截取空格
2008-11-18 14:04 4362//使用正则表达式截取空格 function trim(s) ... -
javascript中replace()方法
2008-04-15 10:24 2160 : : :& ... -
3.1 对象
2008-04-10 16:07 1277对象是属性和方法的集合。一个方法就是一个函数,是对象的成员。属 ... -
3.0 复合类型
2008-04-10 13:12 1244javaScript中的复合类型大致上有如下3中: Objec ... -
2.4 undefined 和 null
2008-04-10 13:01 1197 & ... -
2.3 javaScript 布尔类型
2008-04-10 12:49 1401<script> if (navigator. ... -
2.2 JavaScript 字符串类型
2008-04-10 11:58 2474定义方式: <script> ... -
2.1 javascript 数字类型
2008-04-10 11:02 3037 & ... -
2.0 javascript 基本数据类型
2008-04-10 10:57 1564 & ...
相关推荐
JavaScript是一种广泛应用于...以上是JavaScript面向对象技术的一些基础知识。通过理解并熟练运用这些概念,开发者能够编写出更清晰、更易于维护的代码。对于JavaScript初学者来说,掌握这些基础是进阶学习的关键步骤。
JavaScript面向对象技术是该编程语言非常核心的一个部分,它允许开发者使用对象来组织代码,并模拟现实世界中的实体。在JavaScript中,几乎所有的东西都可以被视为对象,包括基本数据类型如数字和字符串。对象包含...
本文将深入浅出地讲解JavaScript中的面向对象技术基础,包括对象、数组、函数、类、构造函数以及原型等方面的知识。 首先,让我们来看看对象和数组。在JavaScript中,对象是键值对的集合,这些键通常是字符串,对应...
本文介绍了JavaScript面向对象编程的基本概念和技术细节,包括变量和对象的基础用法、函数的作用以及如何通过封装和继承来构建复杂的对象层次结构。JavaScript的独特之处在于它的灵活性和动态性,这使得它成为了一种...
总而言之,学习现代JavaScript面向对象编程,有助于开发者在认识这门语言演化的基础上,运用面向对象的设计和编程模式来构建更加健壮和可维护的JavaScript应用程序。同时,测试和调试是保证代码质量不可或缺的环节,...
通过以上内容,我们可以了解到JavaScript面向对象编程的基础知识以及它的核心概念。在实际应用中,理解并熟练运用这些知识点,将有助于开发出更加结构化和可维护的代码。同时,参与Java学习群和听讲大神的课程将是一...
### JavaScript面向对象编程知识点概述 #### 一、现代JavaScript编程概览 - **JavaScript的演进**:自诞生以来,JavaScript经历了从一个简单的脚本语言到现今被广泛应用于构建复杂应用的强大编程语言的过程。它的...
JavaScript面向对象技术在实现树形控件中扮演着至关重要的角色。树形控件是一种用于展示层次型数据的用户界面元素,它具有扩展和折叠功能,可以在有限的空间内清晰地展示大量的信息,使得数据间的层级关系一目了然。...
《JavaScript内核系列》和《JavaScript面向对象基础》这两本书是深入理解JavaScript编程的重要资源。JavaScript,作为一种广泛应用于Web开发的脚本语言,其内核和面向对象特性是开发者必须掌握的基础知识。以下是对...
标题“JavaScript经典面向对象设计”指出了本书的主要内容是关于如何使用面向对象编程(OOP)原则和技术来编写高质量、可扩展且可重用的JavaScript应用程序及库。描述中提到本书相比其他中文资料更为清晰,深入到...
在JavaScript面向对象编程中,随着Web2.0和Ajax技术的普及,JavaScript的角色从简单的表单验证扩展到了复杂的数据交互和页面动态更新。采用面向对象的编程风格可以使代码结构更加清晰,便于管理和维护。例如,...
从所提供的文件信息中,我们可以总结以下几点与“JavaScript面向对象编程指南 第2版 高清 带索引书签目录_样章.pdf”相关的重要知识点。 首先,该文件提到的书籍是关于JavaScript面向对象编程的,面向对象编程...
JavaScript是一种基于原型的面向对象编程语言,它的面向对象技术基础包括对象、数组、原型、作用域、闭包以及模拟私有变量等核心概念。下面将详细介绍这些知识点。 **1. 对象与数组** 在JavaScript中,对象是键值...
### JavaScript面向对象编程详解 #### 一、现代JavaScript概述 随着技术的发展,JavaScript这门语言已经从最初的简单脚本语言成长为现在广泛应用于Web前端、后端甚至桌面应用的强大编程工具。现代JavaScript具备...