`
wu_quanyin
  • 浏览: 204929 次
  • 性别: Icon_minigender_1
  • 来自: 福建省
社区版块
存档分类
最新评论

JavaScript中prototype/constructor的理解

阅读更多

一,prototype(对象)(原型链)

可使javascript拥有

1,重写

2,添加方法

3,继承的机制

 

prototype继承原理:

每一个方法的创建,都有着一个单例的对象functionName.prototype, 在使用这个方法创建的每一个对象,该prototype都会赋值给他,(prototype里面包含了一些属性,方法包含construtor)

也正因为每个对象都共享一个prototype,所以可以操作这个prototype,

1,将你类对象赋给他达到继承的目的,看下面文章

2,可在该prototype上,重写方法,或者添加方法

 

1,重写

如:Array.prototype.push=function(){
	//execute your's function
}

2,添加方法

Array.prototype.newMethod=function(){
	//add new method for after use
}

3,继承

//---------------下面实例实现

 

4,prototype的了解.

function F1(){
}

F1.prototype.run=function(){
	alert("execute run.f1 method");
}

var a1=new F1();
var a2=new F1();
if(a1.run()===a2.run());//推出prototype是单例的对象,每一个对象的创建prototype相同

 

二, constructor(方法):说明本身是由怎么构造而成的

var arrayObject=new Array();
arrayObject.constructor;//Array
Array.constructor;//Function
Object.constructor;//Function   Object.prototype为null
Function.constructor;//Function(最高级别即本身)

  可跟prototype应用操作:

如arrayObject.construcotr.addmethod=function(){}可这样为Array提供方法

 

使用prototype与constructor进行完整的继承封装

//为了达到封装的完善性,引申以下问题
//引申问题一,保证使每一个对象object.construcotr能够找到自己(function)
//引申问题二,保证使之通过suberObject能找到父类

//问题一例子
function Parent(){
	this.log=function(){
		document.writeln("this is parent log.....<br>");
	}
}
function Suber(){
	this.log=function(){
		document.writeln("this is suber log......<br>");
	}
}

var suber1=new Suber();
//可得到子类本身
document.writeln(suber1.constructor);
//故当其中有一个被改变时,另一个也会被改变.construcotr是相应的prototype中的一个属性,以下访问是同一个属性
document.writeln(suber1.constructor===Suber.prototype.constructor);
document.writeln("<br>--------------------------------------------<br>");


//当继承时.....
Suber.prototype=new Parent();
var suber2=new Suber();
//得到的是父类本身,丢失了自己的构造函数,故"问题一"出现
document.writeln(suber2.constructor);
document.writeln("<br>--------------------------------------------<br>");


//解决"问题一"方法
Suber.prototype=new Parent();
Suber.prototype.constructor=Suber;
var suber3=new Suber();
document.writeln(suber3.constructor);
document.writeln("<br>--------------------------------------------<br>");


//这样一来,引申出"问题二",我们获取不到parent的本身方法
//故只能采用定义一个属性的方式来存储父类
//解决"问题二"方法
Suber.prototype=new Parent();
Suber.superClass=Parent;//每一级别都设置该属性进行存储父类方法
Suber.prototype.constructor=Suber;
var suber4=new Suber();
document.writeln(suber4.constructor);
document.writeln("<br>--------------------------------------------<br>");
document.writeln(Suber.superClass);
 

//可参考extjs中的继承封装....

 

参考文章:http://hi.baidu.com/maxwin2008/blog/item/8da86102c1ceda034bfb51a3.html

0
1
分享到:
评论

相关推荐

    JavaScript中的prototype和constructor简明总结

    一直没弄清楚JavaScript中的prototype和constructor属性,今天看了看书,总算有点眉目了

    prototype,__proto,constructor

    分析javascript中 prototype __proto__ constructor之间的关系

    javascript new后的constructor属性

    b.constructor==BB.prototype.constructor&#41; //true 这里的“有了”的执行过程是先查看b有没有此属性让后去查看prototype里的属性值,不是简单的A=B:如添加:b.constructor=”ccc”; 执行:alert(b.constructor=...

    Javascript的构造函数和constructor属性

    真正的原因是:一个对象的constructor是它的构造函数的prototype.constructor,而每一个函数都有一个prototype,默认情况下,这个prototype有一个constructor属性,指向的是它自己。 我觉得Javascript的设计本意是让...

    浅谈javascript中的constructor

    这里有一点需要注意的是,每个函数都有一个prototype属性,这个prototype的constructor指向这个函数,这个时候我们修改这个函数的prototype时,就发生了意外。如 function Person(name,age){ this.name = name; ...

    JavaScript中几个重要的属性(this、constructor、prototype)介绍

    如果在函数中使用this,则this指代什么是根据运行时此函数在什么对象上被调用。 我们还可以使用apply和call两个全局方法来改变函数中this的具体指向。 先看一个在全局作用范围内使用this的例子: 代码如下: ...

    图解prototype、proto和constructor的三角关系

    在javascript中,prototype、constructor以及__proto__之间有着“著名”的剪不断理还乱的三角关系,楼主就着自己对它们的浅显认识,来粗略地理理以备忘,有不对之处还望斧正。

    深入分析js中的constructor和prototype

    在javascript的使用过程中,constructor 和prototype这两个概念是相当重要的,深入的理解这两个概念对理解js的一些核心概念非常的重要

    JavaScript精炼之构造函数 Constructor及Constructor属性详解

    对象的constructor属性用于返回创建该对象的函数,也就是我们常说的构造函数,除了创建对象,构造函数(constructor) 还做了另一件有用的事情—自动为创建的新对象设置了原型对象(prototype object)

    深入理解javascript prototype的相关知识

    foo.prototype.constructor=function foo() 动物B(function function()), 动物B的模板描述 . B.模板 (function.prototype), B.模板有个构造方法 function.prototype.constructor=function function() 狗C= new 狗类...

    JavaScript 常见对象类创建代码与优缺点分析

    几种javascript类定义方式中,最常用的是杂合prototype/constructor 和 动态prototype方式。

    深入浅析JavaScript中的constructor

    这里有一点需要注意的是,每个函数都有一个prototype属性,这个prototype的constructor指向这个函数,这个时候我们修改这个函数的prototype时,就发生了意外。如 function Person(name,age){ this.name = name; this...

    【JavaScript源代码】JavaScript中的几种继承方法示例.docx

    JavaScript中的几种继承方法示例  1.原型链继承  原理: 子类原型指向父类实例对象实现原型共享,即Son.prototype = new Father()。 这里先简单介绍下原型 js中每个对象都有一个__proto__属性,这个属性指向的...

    详解Javascript中prototype属性(推荐)

    但是在Javascript语言体系中,是不存在类(Class)的概念的,javascript中不是基于‘类的’,而是通过构造函数(constructor)和原型链(prototype chains)实现的。但是在ES6中提供了更接近传统语言的写法,引入了...

    JavaScript中的原型prototype完全解析

    要理解JS中的prototype, 首先必须弄清楚以下几个概念  1. JS中所有的东西都是对象  2. JS中所有的东西都由Object衍生而来, 即所有东西原型链的终点指向Object.prototype   // [constructor, toString, ...

    JavaScript使用Prototype实现面向对象的方法

    本文实例讲述了JavaScript使用Prototype实现面向对象的方法。分享给大家供大家参考。具体分析如下: prototype 是 Function 对象的一个属性,这个属性指向另一个对象。 这个对象的所有属性和方法,都会被构造函数的...

    Javascript中的Prototype到底是什么

    Javascript也是面向对象的语言,但它是一种基于...在prototype对象中又有一个constructor属性,这个constructor属性同样指向一个constructor对象,而这个constructor对象恰恰就是这个function函数本身。 是不是很绕?

Global site tag (gtag.js) - Google Analytics