JS prototype

最新推荐文章于 2025-06-16 18:07:53 发布

转载最新推荐文章于 2025-06-16 18:07:53 发布 · 592 阅读

JavaScript 专栏收录该内容

42 篇文章

订阅专栏

原文地址

http://www.cnblogs.com/xiaouisme/archive/2012/09/17/2688298.html

http://blog.sina.com.cn/s/blog_7045cb9e0100rtoh.html

http://www.cnblogs.com/yjf512/archive/2011/06/03/2071914.html

http://www.uw3c.com/jsviews/js12.html

你也可以通过prototype来给所有对象添加共用的函数。这有一个好处：你不需要每次在构造一个对象的时候创建并初始化这个函数。

每一个构造函数都有一个属性叫做原型(prototype,下面都不再翻译，使用其原文)。这个属性非常有用：为一个特定类声明通用的变量或者函数。

<span style="color:#FF0000;"><strong>可以把prototype当作一个成员变量</strong></span>，

function 
uw3c(name){
    alert("姓名:"
+ name + ",年龄:" 
+ this.age + 
",性别:" + this.sex);
}
uw3c.prototype.age = 15;
uw3c.prototype.sex =
"man";
var 
test1 = new uw3c("css");//姓名:css,年龄:15,性别:man
var 
test2 = new uw3c("js");//姓名:js,年龄:15,性别:man

1 原型法设计模式

在.Net中可以使用clone()来实现原型法

原型法的主要思想是，现在有1个类A,我想要创建一个类B,这个类是以A为原型的,并且能进行扩展。我们称B的原型为A。

2 javascript的方法可以分为三类：

a 类方法

b 对象方法

c 原型方法

function People(name)
{
  this.name=name;
  //对象方法
  this.Introduce=function(){
    alert("My name is "+this.name);
  }
}
//类方法
People.Run=function(){
  alert("I can run");
}
//原型方法                      最后写了很多例子代码后才明白：prototype只能用在类型上。
People.prototype.IntroduceChinese=function(){
  alert("我的名字是"+this.name);
}

 

//测试

var p1=new People("Windking");

p1.Introduce();

People.Run();

p1.IntroduceChinese();      //ps：<span style="color:#FF0000;"><strong>可以把prototype当作一个成员变量</strong></span>，思考js语法的特性造成的搜索成员的顺序.

prototype是什么含义？

javascript中的每个对象都有prototype属性，Javascript中对象的prototype属性的解释是：返回对象类型原型的引用。

A.prototype = new B();

理解prototype不应把它和继承混淆。A的prototype为B的一个实例，可以理解A将B中的方法和属性全部克隆了一遍。A能使用B的方法和属性。这里强调的是克隆而不是继承。可以出现这种情况：A的prototype是B的实例，同时B的prototype也是A的实例。

function baseClass()
{
  this.showMsg = function()
  {
     alert("baseClass::showMsg");   
  }
}

function extendClass()
{
}

extendClass.prototype = new baseClass();
var instance = new extendClass();
instance.showMsg(); // 显示baseClass::showMsg

我们首先定义了baseClass类，然后我们要定义extentClass，但是我们打算以baseClass的一个实例为原型，来克隆的extendClass也同时包含showMsg这个对象方法。

extendClass.prototype = new baseClass()就可以阅读为：extendClass是以baseClass的一个实例为原型克隆创建的。

注意：必须带着怀疑的态度去看这篇文章，里面部分描述有些微问题。顺便要看看评论。
ps：可以把prototype当作一个成员变量，思考js语法的特性造成的搜索成员的顺序.

JavaScript 是基于对象的，任何元素都可以看成对象。然而，类型和对象是不同的。本文中，我们除了讨论类型和对象的一些特点之外，更重要的是研究如何写出好的并且利于重用的类型。毕竟，JavaScript这种流行的脚本语言如果能够进行良好的封装，并形成一个庞大的类型库，对于重用是非常有意义的。

网上对于prototype的文章很多，一直没明白核心的思想。最后写了很多例子代码后才明白：prototype只能用在类型上。

以下是一些关于类型和对象的例子，大家看完例子后可能更容易理解类型和对象之间的联系：

	例子代码	说明
1	Object.prototype.Property = 1; Object.prototype.Method = function () { alert(1); } var obj = new Object(); alert(obj.Property); obj.Method();	可以在类型上使用proptotype来为类型添加行为。这些行为只能在类型的实例上体现。 JS中允许的类型有Array, Boolean, Date, Enumerator, Error, Function, Number, Object, RegExp, String
2	var obj = new Object(); obj.prototype.Property = 1; //Error //Error obj.prototype.Method = function() { alert(1); }	在实例上不能使用prototype，否则发生编译错误
3	Object.Property = 1; Object.Method = function() { alert(1); } alert(Object.Property); Object.Method();	可以为类型定义“静态”的属性和方法，直接在类型上调用即可
4	Object.Property = 1; Object.Method = function() { alert(1); } var obj = new Object(); alert(obj.Property); //Error obj.Method(); //Error	实例不能调用类型的静态属性或方法，否则发生对象未定义的错误。
5	function Aclass() { this.Property = 1; this.Method = function() { alert(1); } } var obj = new Aclass(); alert(obj.Property); obj.Method();	这个例子演示了通常的在JavaScript中定义一个类型的方法
6	function Aclass() { this.Property = 1; this.Method = function() { alert(1); } } Aclass.prototype.Property2 = 2; Aclass.prototype.Method2 = function { alert(2); } var obj = new Aclass(); alert(obj.Property2); obj.Method2();	可以在外部使用prototype为自定义的类型添加属性和方法。
7	function Aclass() { this.Property = 1; this.Method = function() { alert(1); } } Aclass.prototype.Property = 2; Aclass.prototype.Method = function { alert(2); } var obj = new Aclass(); alert(obj.Property); obj.Method();	在外部不能通过prototype改变自定义类型的属性或方法。该例子可以看到：调用的属性和方法仍是最初定义的结果。
8	function Aclass() { this.Property = 1; this.Method = function() { alert(1); } } var obj = new Aclass(); obj.Property = 2; obj.Method = function() { alert(2); } alert(obj.Property); obj.Method();	可以在对象上改变属性。（这个是肯定的）也可以在对象上改变方法。（和普遍的面向对象的概念不同）
9	function Aclass() { this.Property = 1; this.Method = function() { alert(1); } } var obj = new Aclass(); obj.Property2 = 2; obj.Method2 = function() { alert(2); } alert(obj.Property2); obj.Method2();	可以在对象上增加属性或方法
10	function AClass() { this.Property = 1; this.Method = function() { alert(1); } } function AClass2() { this.Property2 = 2; this.Method2 = function() { alert(2); } } AClass2.prototype = new AClass(); var obj = new AClass2(); alert(obj.Property); obj.Method(); alert(obj.Property2); obj.Method2();	这个例子说明了一个类型如何从另一个类型继承。
11	function AClass() { this.Property = 1; this.Method = function() { alert(1); } } function AClass2() { this.Property2 = 2; this.Method2 = function() { alert(2); } } AClass2.prototype = new AClass(); AClass2.prototype.Property = 3; AClass2.prototype.Method = function() { alert(4); } var obj = new AClass2(); alert(obj.Property); obj.Method();	这个例子说明了子类如何重写父类的属性或方法。