`

四、prototype属性

 
阅读更多

1、prototype
在JavaScript中并没有类的概念,但JavaScript中的确可以实现重载,多态,继承。这些实现其实方法都可以用JavaScript中的引用和变量作用域结合prototype来解释。

2、简单的例子
var Blog = function( name, url ){
   this.name = name;
   this.url = url;
};
Blog.prototype.jumpurl = '';
Blog.prototype.jump = function(){
   window.location = this.jumpurl;
};
/*
*等同于
Blog.prototype = {
   jumpurl : '',
   jump : function(){
   window.location = this.jumpurl;
}
};
*/
var rainman = new Blog('jb51', 'http://www.jb51.net');
var test = new Blog('server', 'http://s.jb51.net');

这是一个非常简单的例子,但却可以很好的解释prototype内在的一些东西,先看下图的内存分配:


 
通过上图可以看到下面这些内容:

prototype只是函数的一个属性,该属性的类型是一个对象。
内存分配状况:
函数Blog拥有一个prototype属性,而prototype属性拥有一个变量和一个函数;
test和rainman两个变量都分别有name和url两个变量;
test和rainman两个变量都有一个jumpUrl变量和一个jump函数,但是并没有分配内存,它们是对Blog.protype中的引用

3、扩展1:
Website.prototype = Blog.prototype
var Blog = function( name, url ){
   this.name = name;
   this.url = blogurl;
};
Blog.prototype.jumpurl = '';
Blog.prototype.jump = function(){
   window.location = this.jumpurl;
};
var rainman = new Blog('jb51', 'http://www.jb51.net');
var test = new Blog('server', 'http://s.jb51.net');

var Website = function(){};
Website.prototype = Blog.prototype;
var mysite = new Website();


 

通过上图可以看到下面这些内容:

"Website.prototype = Blog.prototype;":Website的prototype并没有分配内存,只是引用了Blog的prototype属性。
mysite的两个属性也没有分配内存,也只是分别引用了Blog.prototype.jumpurl和Blog.prototype.jump


4、扩展2:
Website.prototype = new Blog()
var Blog = function(){};
Blog.prototype.jumpurl = '';
Blog.prototype.jump = function(){
   window.location = this.jumpurl;
};

var Website = function(){};
Website.prototype = new Blog();
var mysite = new Website();


 

通过上图可以看到下面这些内容:

Website的prototype属性,只是Blog的一个实例( 同rainman=new Blog(); );因此Website的prototype属性就具有了jumpurl变量和jump方法了。
mysite是Website的一个实例,它的jumpurl和jump方法是继承自Website的prototype,而Web.prototype继承自Blog.prototype(这里与其说是继承,不如说是引用)
整段程序在运行的过程中,内存中只分配了一个jumpurl变量和一个jump方法
5、new运算符
JavaScript中new运算符。
JavaScript中new运算符是创建一个新对象。使用方法:
new constructor[(arguments)]
其中constructor是必选项。对象的构造函数。如果构造函数没有参数,则可以省略圆括号。
arguments是可选项。任意传递给新对象构造函数的参数。

JavaScript中new运算符说明
new 运算符执行下面的任务:
创建一个没有成员的对象。
为那个对象调用构造函数,传递一个指针给新创建的对象作为 this 指针。
然后构造函数根据传递给它的参数初始化该对象。
示例
下面这些是有效的 new 运算符的用法例子。
my_object = new Object;
my_array = new Array();
my_date = new Date("Jan 5 1996");

6、其它
在绝大多数JavaScript版本中,JS引擎都会给每个函数一个空的原型对象,即prototype属性。
详细出处参考:http://www.jb51.net/article/23052.htm


  • 大小: 31.9 KB
  • 大小: 44.1 KB
  • 大小: 34 KB
分享到:
评论

相关推荐

    js遍历属性 以及 js prototype 和继承

    在JavaScript中,遍历属性、理解`prototype`和掌握继承机制是编程中不可或缺的基本技能。本文将深入探讨这些概念,并通过实例来加深理解。 首先,让我们来看如何遍历JavaScript对象的属性。JavaScript提供了多种...

    js资料prototype 属性

    JavaScript中的`prototype`属性是一个非常重要的概念,它与面向对象编程和对象的继承密切相关。`prototype`属性允许我们在创建对象时共享属性和方法,从而提高了代码的复用性。 首先,`prototype`属性用于访问一个...

    JavaScript prototype属性详解

    JavaScript中的`prototype`属性是面向对象编程的关键特性之一,它关联了函数(特别是构造函数)与实例之间的继承关系。每个函数都有一个`prototype`属性,这个属性是一个对象,包含了所有实例共享的方法和属性。当...

    js的Prototype属性解释及常用方法

    你不需要显式地声明一个prototype属性,因为在每一个构造函数中都有它的存在。你可以看看下面的例子: Example PT1 代码如下:function Test(){}alert(Test.prototype); // 输出 “Object” 给prototype添加...

    JavaScript中对象的prototype属性代码实例

    我猜一般用过JavaScript的人都看见过或者用过对象的prototype属性。这是个好东西,它可以向其原型中动态添加功能(属性和方法),但该对象不能被赋予不同的原型。然而,用户定义的对象可以被赋给新的原型。详细介绍:...

    JavaScript prototype对象的属性说明

    一、什么是JavaScript中对象的prototype属性 JavaScript中对象的prototype属性,是用来返回对象类型原型的引用的。我们使用prototype属性提供对象的类的一组基本功能。并且对象的新实例会”继承”赋予该对象原型的...

    JS prototype 属性

    ### prototype属性的特性 1. **默认属性**:每个函数(除了`Function.prototype`之外)的`prototype`属性默认是一个具有`constructor`属性的对象,`constructor`属性指向该函数本身。 2. **原型链**:当试图访问一...

    JavaScript类和继承 prototype属性

    我们已经在第一章中使用prototype属性模拟类和继承的实现。 prototype属性本质上还是一个JavaScript对象。 并且每个函数都有一个默认的prototype属性。 如果这个函数被用在创建自定义对象的场景中,我们称这个函数为...

    JavaScript中的prototype(原型)属性研究

    JavaScript中的prototype属性是理解面向对象编程的关键概念之一。在JavaScript中,每个函数都有一个prototype属性,这个属性指向一个对象,这个对象就是所谓的原型对象。当我们创建一个函数实例时,实例会自动获取一...

    简单理解js的prototype属性及使用

    标题“简单理解js的prototype属性及使用”和描述“主要介绍了简单理解js的prototype属性及使用,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧”提示了本文的主旨在于解析JavaScript...

    prototype

    原型(Prototype)对象是用来提供共享属性和方法的,当试图访问一个对象的属性时,如果该对象本身没有这个属性,那么JavaScript引擎会查找其`__proto__`所引用的对象,也就是原型对象,以此类推,直到找到该属性或者...

    理解JavaScript的prototype属性

    JavaScript中的prototype属性是语言的一个核心概念,与原型继承机制密切相关。在理解prototype属性时,有几个关键点需要掌握: 1. 原型(Prototype)概念:在JavaScript中,几乎所有的对象都是通过另一个对象来继承...

    非常有用的prototype实例

    首先,了解`prototype`的基本原理:每个函数(在JavaScript中,函数也是对象)都有一个名为`prototype`的属性,这个属性是一个对象,用于定义实例化该函数的对象所能共享的属性和方法。当我们创建一个新对象时,该...

    Prototype详解

    ### Prototype详解:深入理解JavaScript库的核心功能与Ajax应用 #### 一、Prototype简介与核心功能解析 ##### 1. Prototype是什么? Prototype是一个由Sam Stephenson创建的JavaScript库,旨在简化和标准化...

    Prototype-1.7.1手册

    JScript中对象的prototype属性,是用来返回对象类型原型的引用的。我们使用prototype属性提供对象的类的一组基本功能。

    JavaScript prototype属性使用说明

    JavaScript中的prototype属性是一个非常重要的概念,它是ECMAScript规范定义的一部分,用于给对象的构造函数添加新方法或者修改现有方法。IE 4引入的prototype属性主要用于面向对象编程中,能够在不改变原有构造函数...

    使用prototype简化Ajax操作

    在"使用prototype简化Ajax操作"这个主题中,我们将深入探讨Prototype库如何使Ajax变得更加简单易用。 首先,Prototype为Ajax操作提供了一个统一的接口——`Ajax`对象。这个对象下包含了一系列方法,如`Request`、`...

Global site tag (gtag.js) - Google Analytics