JavaScript学习3:原型和继承

原型

我们创建的每个函数都有一个prototype(原型)属性,这个属性是一个对象,它的用途是包括能够由特定类型的全部实例共享的属性和方法。逻辑上能够这么理解:prototype是通过调用构造函数而创建的那个对象的原型对象。

为什么要引入原型的概念呢?使用原型的目的。也是他的优点是能够让全部的对象实例共享它所包括的属性和方法。换句话说,就是不必再构造函数中定义对象信息,而是能够直接将这些信息加入到原型中。

详细怎么用,我们来看代码实例:

<span style="font-size:18px;">//原型实例
function Person(){}   //声明一个构造函数

Person.prototype.name=‘Lian‘;   //在原型里加入属性
Person.prototype.age=100;
Person.prototype.run=function(){    //在原型里加入方法
	return this.name + this.age + ‘奋斗中……‘;
};

var person1=new Person();
var person2=new Person();
alert(person1.run==person2.run);   //返回true,说明方法的引用地址是一致的。即两个对象共享了一个方法</span>

为了更好的理解构造函数的声明方式和原型模式的声明方式的差别,我找了两张图分享给大家。帮助大家理解:

我们从图中能够看到,在原型模式声明中。多了两个属性,这两个属性都是创建对象时自己主动生成的。_proto_属性是实例指向原型对象的一个指针,它的作用就是指向构造函数的原型属性constructor。通过这两个属性,就能够訪问到原型里的属相和方法了。

看到这里你会认为奇怪。上面代码实例中的构造函数的函数体中什么也没有。才干訪问到原型对象里的值,假设函数体中有属性或者方法呢?这里就要涉及一个原型模式运行流程的问题了:是先去查找构造函数实例里面的属性和方法,假设有。立马返回,若没有,则去它的原型对象中找。若有,则返回。

使用原型模式创建对象也有其缺点,那就是它省略了构造函数传參初始化这一过程。带来的缺点就是初始化的值都是一样的。可是这恰恰是它最大的长处,那就是共享。

继承

继承是面向对象中的一个核心概念,在比較正统的面向对象的语言中一般都会採用两种方式实现继承:一个是接口实现,一个是类继承。而我们的JavaScript仅仅支持继承。而不支持接口实现,继承是怎样实现的,这里要引入原型链的概念了。什么是原形链。我们看一段代码就会知道。

<span style="font-size:18px;">//继承实例
function A(){
	this.name =‘Lian‘;
}

function B(){
	this.age=100;
}

function C(){
	this.address=‘中国‘;
}
B.prototype.age =200;
B.prototype =new A();  //B继承了A

C.prototype =new B();  //C又继承了B

var c=new C();
alert(c.name+‘ ‘+ c.age);  //C具有了A和B的属性</span>

在JavaScript中,被继承的函数称为超类型(也就是面向对象中说的父类或者说是基类),继承的函数称为子类型(即子类或者派生类)。继承有优点。可是也有其自己的问题,比方字面量重写原型会中断关系,使用引用类型的原型,而且子类型无法给超类型传递參数。

综合考虑,我们使用原形链加上构造函数,这样产生了组合继承。

<span style="font-size:18px;">//组合继承
function Box(age){
	this.name=‘Lee‘;
	this.age=age;
}

Box.prototype.run=function(){
	return this.name +this.age;
};

function Desk(age ){
	Box.call(this,age);   //对象冒充,给超类型传參
}

Desk.prototype =new Box();   //原形链继承

var desk =new Desk(100);
alert (desk.run());   //显然Desk继承了Box的run方法</span>

组合继承是JavaScript最经常使用的继承方式,可是,组合继承也有一点问题。那就是超类型在使用过程中会被调用两次。一次是创建子类型的时候。一次是在子类型构造函数的内部。

这样会带来性能上的开销,怎样解决?留给读者去思考……

时间: 2024-10-01 03:12:05

JavaScript学习3:原型和继承的相关文章

JavaScript中的原型和继承

请在此暂时忘记之前学到的面向对象的一切知识.这里只需要考虑赛车的情况.是的,就是赛车. 最近我正在观看 24 Hours of Le Mans ,这是法国流行的一项赛事.最快的车被称为 Le Mans 原型车.这些车虽然是由"奥迪"或"标致"这些厂商制造的,可它们并不是你在街上或速公路上所见到的那类汽车.它们是专为参加高速耐力赛事而制造出来的. 厂家投入巨额资金,用于研发.设计.制造这些原型车,而工程师们总是努力尝试将这项工程做到极致.他们在合金.生物燃料.制动技术

【转】JavaScript中的原型和继承

请在此暂时忘记之前学到的面向对象的一切知识.这里只需要考虑赛车的情况.是的,就是赛车. 最近我正在观看 24 Hours of Le Mans ,这是法国流行的一项赛事.最快的车被称为 Le Mans 原型车.这些车虽然是由“奥迪”或“标致”这些厂商制造的,可它们并不是你在街上或速公路上所见到的那类汽车.它们是专为参加高速耐力赛事而制造出来的. 厂家投入巨额资金,用于研发.设计.制造这些原型车,而工程师们总是努力尝试将这项工程做到极致.他们在合金.生物燃料.制动技术.轮胎的化合物成分和安全特性上

javascript学习(原型对象)

在javascript中,原型对象我是认为还是比较晦涩难懂的. 在js中我们可以认为js是面对对象的,跟java差不多,本人也是java出身.在js中 对象的理解与java等其他强类型的语言是不一样的,所以会造成很多后端人员学习js这一块会觉得难以理解.但是js这种原型的灵活性也会造成很多的问题,在这里推荐大家看本书<javascript语言精粹>,另外在新的ES6中就引入了class的概念,符合这本书的初衷 对js语言进行"取其精华,去其糟粕". 首先 javascrip

菜鸟快飞之JavaScript对象、原型、继承(三)

正文之前需要声明的一点是,菜鸟系列博文全是基于ES5的,不考虑ES6甚至更高版本. 继承 由于我个人不是学计算机的,所以对于很多东西只是知其然,不知其所以然.就像这个继承,刚开始学JavaScript就听人说了JavaScript几大核心,但是自己平时似乎都没怎么用到,所以一直不明白为什么需要这些东西,面试还总是问这些. 但是随着一点点学习,也有去看过jQuery源码,虽然到现在也没怎么看懂(主要也是有些懒),但慢慢还是对这些东西有了更深的了解. 为什么需要继承 举个很简单的例子,我在平时学习写

JavaScript 学习笔记 - 对象和继承

本文是JavaScript The Good Part 有关对象和继承的学习笔记. 1. Object.create 本函数是ECMAScript 5中的标准函数,其作用是用一个对象作为原型来生成另一个对象,可以用以下的code 模拟实现. if(typeof Object.create !== 'function') { Object.create = function(proto){ var F = function(){}; if(typeof proto !== 'object'){ /

详解JavaScript中的原型和继承-转自颜海镜大大

本文将会介绍面向对象,继承,原型等相关知识,涉及的知识点如下: 面向对象与继承 CEOC OLOO 臃肿的对象 原型与原型链 修改原型的方式 面向对象与继承 最近学习了下python,还写了篇博文<重拾编程乐趣——我的Python笔记>,加深了我对面向对象的一些理解. 我们会对我们写的程序进行抽象,而不同的语言都提供了不同的抽象工具,比如各种语言里面的数组,集合(键值数组,哈希表,字典等)等提供了对数据的抽象:而VB里面的子程序,类C语言里面的函数,提供了抽象代码段的能力. 有时我们希望将数据

JavaScript创建对象、原型与继承

JavaScript是一门极其灵活的语言,烂七八糟的设计是它最大的优点.不同于其他严格类型的语言例如java,学习曲线比较友好.JavaScript个人感觉上手基本不用费劲,要想上高度那就是一个悲催而且毁三观的故事.特别是有面向对象语言基础的人来说,JavaScript真像一个噩梦.JavaScript更加的零碎,封装的不是很好.你必须理清脉络深入理解了,才能写出来高大上的优雅的代码.在下尽量的用简练易懂的语言,简单的阐述一下我对JavaScript面向对象的一点粗浅的理解. 1,要想面向对象先

JavaScript学习-类/原型链/class

服了,这个原型链是个什么???一直以来C/C++/java类的概念都深入我心了,突然搞这个很不适应.有啥用啊? 而且看到后面ES6语法,竟然也加入了class???? 搞什么呢?这不是打自己脸吗? 或许后面会有很有用的地方,但是暂时没有发现. 关于原型链的讲解 https://blog.csdn.net/m0_37589327/article/details/78655038 类继承是通过原型链的,而class,就是一个封装了原型链的API class能让我们像Java一样写代码 现在先用cla

菜鸟快飞之JavaScript对象、原型、继承(二)

上一节写了创建对象的三种方法,而其中通过函数创建对象的方式又有三种模式,分别是工厂模式.构造函数模式.原型模式.而这三种模式最常用的则是原型模式.还是上栗子: 工厂模式: function Fun1(name,age){ var obj = {}; obj.name = name; obj.age = age; obj.sayNmae = function(){ return this.name; }; return obj; } var p1 = Fun1('xiaohong', 22); v

《javascript高级程序设计(第二版)》学习(4)原型与继承

声明:这类属于学习笔记,主要是摘录书中内容,比较少的整理.内容经常是跳跃的,建议您阅读书本,收益更大. function Person(){} Person.prototype.name="tom"; //这里等于重写了原型对象 //切断了与构造函数之间的联系 Person.prototype={ name:"mike", age:22 }; //得到的不是Person了,而是Object console.log(Person.prototype.construct