Javascript的原型、原型链、原型链继承

原型

在javascript中,原型分有两种:显示原型(prototype)和隐式原型(__proto__)。

__proto__(隐式原型)

JavaScript中任意对象都有一个内置属性[[prototype]],在ES5之前没有标准的方法访问这个内置属性,但是大多数浏览器都支持通过__proto__来访问。ES5中有了对于这个内置属性标准的Get方法Object.getPrototypeOf().

prototype(显式原型)

这是函数对象特有的属性。这个属性是一个指针,指向一个对象,这个对象的用途就是包含所有实例共享的属性和方法(我们把这个对象叫做原型对象)。原型对象也有一个属性,叫做constructor,这个属性包含了一个指针,指回原构造函数。

例如:

var a = {};
console.log(a.__proto__);
// => Object {…}
console.log(a.prototype);
// => undefined
 
function b(){}
console.log(b.__proto__)
// => function () { [native code] }
console.log(b.prototype)
// => Object {…}

注:Object.prototype的__proto__值为null。

区分__proto__与prototype

定义

这两个名次的概念在上文中已经做了解释,不赘述。

作用

prototype用来实现基于原型的继承与属性的共享。

__proto__构成原型链,同样用于实现基于原型的继承。

二者的关系

__proto__在es5里指向构造函数的prototype,在es6里指向该构造函数。

小结

1.任意对象(在javascript中,所有东西都是对象)都有属性__proto__,指向该对象的构造函数的原型对象(prototype)。

2. 函数对象除了有属性__proto__,还有属性prototype,prototype指向该方法的原型对象(prototype)。

原型链

在javascript中,每个对象和原型对象(prototype)都有一个原型(__proto__),对象的原型指向构造函数(父)的原型对象(prototype),而原型对象(prototype)的原型(__proto__)指向父的父的原型对象(prototype),这样便形成了通过原型层层连接起来的关系,我们把它称为原型链。听起来很拗口,我简单画了个图希望能帮助你理解:

由上图可见,__proto__是实现原型链的关键,而prototype则是原型链的组成。另外,所有构造器/函数的__proto__都指向Function.prototype,它是一个空函数(Empty function)。

原型链继承

在访问一个对象的某个属性时,首先在该对象的内部查找,若有则返回给属性值,若没找到,则从该对象的原型(__proto__)所指向的原型对象(构造器的prototype)中查找,若还是找不到,则继续从该原型对象(prototype)的原型(__proto__)所指向的原型对象中查找,以此类推,知道找到为止,若找不到则返回undefined。

利用这一思想,我们直接将子类的原型对象指向父类的某个实例,则子类创建的所有实例都会继承了父类的所有属性,这就是原型链继承。如:

function Parant (name, age) {
    this.name = name;
    this.age = age;
}
Parant.prototype.say = function(){
    console.log(‘hello, my name is ‘ + this.name);
};

function Child() {
}

Child.prototype = new Parant(‘pursue‘);

var man1 = new Child();
man1.say(); //hello, my name is pursue
var man2 = new Child();
console.log(man1.say === man2.say);//true
console.log(man1.name === man2.name);//true
时间: 2024-12-28 18:17:08

Javascript的原型、原型链、原型链继承的相关文章

javascript精髓篇之原型链维护和继承.

一.两个原型 很多人都知道javascript是原型继承,每个构造函数都有一个prototype成员,通过它就可以把javascript的继承演义的美轮美奂了.其实啊,光靠这一个属性是无法完成javascript的继承.我们在代码中使用的prototype完成继承在这里就不多说了.大家可以查一下资料.另外一个看不见的prototype成员.每一个实例都有有一条指向原型的prototype属性,这个属性是无法被访问到的,当然也就无法被修改了,因为这是维护javascript继承的基础. 1 //构

明白JavaScript原型链和JavaScrip继承

原型链是JavaScript的基础性内容之一.其本质是JavaScript内部的设计逻辑. 首先看一组代码: 1 <script type="text/javascript"> 2 function parent(){ 3 this.name="cehis"; 4 } 5 6 function son(){ 7 this.age=11; 8 } 9 10 function sub(){ 11 this.sex="nan"; 12 }

08.22 javaScript 原型的定义 原型链 获取原型 操作原型的属性 判断原型是自有的还是继承的 各种方法

# 原型 ### 定义 * 每一个对象都有原型 * 原型仍然是一个对象 * 模拟实现面向对象的继承性 ### 原型链 * 对象的原型还有原型 * 对象除了可以使用自有属性还可以继承原型上的属性 ### 获取原型 * 对象.__proto__ * 构造函数.prototype ### 操作原型的属性 * 原型本身就是对象,同操作对象 ### 判断属性是自有的还是原型继承的 * hasOwnProperty() ### ECMA5中创建对象并指定对象的原型 * Object.create(); #

javascript中的构造函数和原型及原型链

纯属个人理解,有错误的地方希望大牛指出,以免误人子弟 1.构造函数: 构造函数的作用 : 初始化由new创建出来的对象    new 的作用: 创建对象(空对象) new 后面跟的是函数调用,使用new来调用函数,跟普通的直接调用函数主要的不同: 就是 this 的指向不同了 , 再就是 会自动的返回新创建的对象 什么是原型?        原型的作用:就是为了实现继承!  一个对象的原型就是它的构造函数的prototype属性的值. 在讨论原型的时候,是指的 对象和原型对关系 prototyp

JavaScript-原型&amp;原型链&amp;原型继承&amp;组合函数

小小的芝麻之旅: 今天学习了js的原型,要说原型,我们先简单说一下函数创建过程. 原型 每个函数在创建的时候js都自动添加了prototype属性,这就是函数的原型,原型就是函数的一个属性,类似一个指针.原型在函数的创建过程中由js编译器自动添加. <script type="text/javascript"> function Flower(name,area) { this.name=name; this.area=area; this.showName=myName;

javascript面向对象系列5——知识点(原型和原型链)

基本概念 [原型链]每个构造函数都有一个对象,原型对象都包含一个指向构造函数的指针,而实例都包含一个指向原型对象的内部指针.那么,如果原型对象等于另一个原型的实例,此时的原型对象将包含一个指向另一个原型的指针,相应地,另一个原型中也包含着一个指向另一个构造函数的指针.如果另一个原型又是另一个原型的实例,那么上述关系依然成立.如此层层递进,就构成了实例与原型的链条. [原型对象]这个对象包含可以由特定类型的所有实例共享的属性和方法.所有引用类型默认都继承了Object,而这个继承也是通过原型链实现

Javascript讲解系列之一 Prototype原型链

以前没有写博客的习惯,许多的技术积累都是自己稍微总结一下,很少共享,并非自私,而是工作比较忙,前几天接到一个电话面试不理想,才发现公司所用的DOJO并不被外面广泛接受,故而决定把自己所学分享出来,为夯实基础,也为与外界交流思想,形成一种渠道,如需联系,请发送至邮箱:[email protected]. 今天写Javascript系列之第一篇:Prototype原型链.在软件园里随便拉一个码农估计都会写JS,大部分也知道JS是基于原型的语言,但是如果问及JS原生对象(Object,Function

【javascript基础】4、原型与原型链

原文:[javascript基础]4.原型与原型链 前言 荒废了好几天,在宿舍闷了几天了,一直想着回家放松,什么也没搞,论文就让老师催吧.不过,闲的没事干的感觉真是不好,还是看看书,写写博客吧,今天和大家说说函数的原型. 原型是什么 第一次看到这个的时候,没太理解这个概念,其实也就是一个概念呗,没啥神秘的.书上说每个函数都有一个prototype属性(原型属性),这个属性是一个指针,指向一个对象(原型对象),这个对象包含这个函数创建的实例的共享属性和方法.也就是说原型对象中的属性和方法是所有实例

[js高手之路]从原型链开始图解继承到组合继承的产生

于javascript原型链的层层递进查找规则,以及原型对象(prototype)的共享特性,实现继承是非常简单的事情 一.把父类的实例对象赋给子类的原型对象(prototype),可以实现继承 1 function Person(){ 2 this.userName = 'ghostwu'; 3 } 4 Person.prototype.showUserName = function(){ 5 return this.userName; 6 } 7 function Teacher (){}

JavaScript 原型对象和原型链

开篇 之前对js中的原型链和原型对象有所了解,每当别人问我什么是原型链和原型对象时,我总是用很官方(其实自己不懂)的解释去描述.有一句话说的好:如果你不能把一个很复杂的东西用最简单的话语描述出来,那就说明你没有真正的理解.最近正在读<Javascript高级程序设计>,书中对原型对象和原型链的描述让我受益匪浅,下面仅用一个对比性的例子来说明. 我们经常会这么写 1 function Person () { 2 this.name = 'John'; 3 } 4 var person = new