`
jinhonglin001
  • 浏览: 15103 次
  • 性别: Icon_minigender_1
社区版块
存档分类
最新评论

javascript面向对象思想的学习(三)

阅读更多

       在前面学习的是js的面向对象中数据的封装。类方法和原型方法的一些区别,所以现在是面向对象的继承的几种方法:

有一个动物对象的构造函数

function Animal()
{
  this.species = "动物";
}

有一个猫对象的构造函数

function Cat(name,color)
{
    this.name = name;
    this.color = color;
}

 如何使猫继承动物呢

一:构造函数的绑定

使用call或者apply方法,将对象的构造函数绑定在子对象上,即在子对象的构造函数中加一行


function Cat(name,color)
{
   Animal.apply(this, arguments);
   this.name = name;
   this.color = color;
}
var cat1 = new Cat("大毛","黄色");
alert(cat1.species); // 动物

 

使用prototype属性,如果猫的prototype对象,指向一个Animal的实例,那么所有猫的实例就能继承Animal了。

 

 

Cat.prototype = new Animal();
Cat.prototype.constructor = Cat;
var cat1 = new Cat("大毛","黄色");
alert(cat1.species); // 动物

下面是解释

//这一行是讲Cat的prototype对象指向Animal的一个实例,相当于将新值覆盖了了原来的值
Cat.prototype = new Animal();

任何一个prototype对象都有一个constructor属性,指向他的构造函数。如果没有“Cat.prototype = new Animal();”Cat.prototype.constructor是指向Cat 的,加了之后指向Animal

Cat.prototype.constructor = cat;

 

更重要的是,没一个实例都有一个constructor属性,默认调用prototype对象的constructor属性

因此在运行

Cat.prototype = new Animal()

 

之后,cat1.constructor也指向Animall。

三、直接继承prototype

这是第二种方法的改进,因为Animal对象中,不变的属性可以直接写入Animal。prototype中,所以我们可以直接继承Animal.prototype.

首先,将Animal改写为

function Animal(){};
Animal.prototype.species = '动物';

 然后将Cat的prototype对象指向Animal的prototype,这样就完成了继承

Cat.prototype = Animal.prototype ;
Cat.prototype.xonstructor  = Cat ;
var cat1 = new Cat('damao','haunse');
alert(cat1.species);

 

这种方法效率较高,比较省内存,但是Cat.prototypeAnimal.prototype同时指向了同一对象,那么任何对Cat.prototype的修改都会反映到Animale.prototype。

 

 

 

分享到:
评论

相关推荐

    javascript面向对象编程.pdf

    总而言之,学习现代JavaScript面向对象编程,有助于开发者在认识这门语言演化的基础上,运用面向对象的设计和编程模式来构建更加健壮和可维护的JavaScript应用程序。同时,测试和调试是保证代码质量不可或缺的环节,...

    JavaScript面向对象精要(英文版)

    ### JavaScript面向对象精要 #### 一、概述 《JavaScript面向对象精要》是一本深入讲解JavaScript面向对象编程原理的专业书籍。本书由知名的前端开发者Nicholas C. Zakas撰写,全面介绍了JavaScript作为一种动态...

    JavaScript面向对象编程指南.pdf

    根据提供的文件信息,我们将重点放在面向对象编程(OOP)在JavaScript中的应用上。JavaScript作为一种广泛使用的脚本...通过与经验丰富的开发者交流,可以更快地掌握面向对象编程的核心思想,并将其应用于实际项目中。

    第15章 javascript面向对象与原型

    在深入讲解JavaScript面向对象与原型的知识点之前,首先需要了解JavaScript的基础知识。在JavaScript中,面向对象编程(OOP)的概念虽然存在,但是它的实现与传统基于类的语言有所不同。ECMAScript,也就是...

    面向对象javascript

    面向对象JavaScript是一种编程范式,它将JavaScript脚本编写转换为面向对象的思想。面向对象的JavaScript开发可以极大地提高开发效率和代码健壮性。 面向对象的JavaScript的特征包括: * 继承:允许子类继承父类的...

    JavaScript面向对象实现简单工厂模式

    JavaScript面向对象实现简单工厂模式是一种常见的设计模式,它在软件工程中被广泛应用于创建对象的场景。简单工厂模式的核心思想是将对象的创建过程抽象出来,由一个专门的工厂类负责,使得客户端代码无需关心具体...

    javascript面向对象技术基础

    本篇文章将深入探讨JavaScript面向对象的基础知识。 1. **面向对象的概念** 面向对象编程(Object-Oriented Programming, OOP)是一种编程范式,它基于“对象”概念,将数据和操作数据的方法封装在一起。在...

    JavaScript面向对象编程指南

    这本书对javascript的一些核心技术,面向对象思想讲的很到位,分析的很容易理解,适合初学者以及想深入学习javascript OO的人

    javascript面向对象编程教程.rar PDF

    JavaScript是一种广泛应用于Web开发的脚本语言,尤其在构建交互式网页和动态应用程序时不可或缺。...通过阅读和实践教程中的内容,你将能够熟练运用面向对象编程思想来解决实际问题,提升你的Web开发能力。

    JS面向对象汇总PDF

    **JS面向对象汇总PDF**是针对JavaScript编程语言中面向对象编程概念的一个综合性的学习资料,主要探讨了JavaScript如何实现面向对象编程(OOP)的设计原则和模式。在JavaScript中,面向对象编程是一种重要的编程范式...

    Web程序开发:第14章 JavaScript面向对象.pdf

    JavaScript面向对象编程是Web程序开发中的一个重要概念,它允许开发者使用对象来构建复杂的软件应用。本章节将详细介绍JavaScript面向对象编程的关键知识点,包括对象的概述、创建方式、JSON的概念以及课堂作业指导...

    javascript 面向对象编程基础:封装

    首先,要讨论javascript中的面向对象编程,必须先理解什么是“类”。...随着Ajax等技术的广泛应用,JavaScript面向对象的特性变得越来越重要,这促使***ript开发者必须更加深入地了解并应用这些面向对象的概念。

    JavaScript入门教程(3) js面向对象

    面向对象编程是JavaScript的重要组成部分,掌握面向对象的思想和技巧,对于提高代码质量、实现功能模块化、优化代码结构都具有重要意义。通过继承、封装和多态等面向对象的概念,可以编写出更加灵活、可维护和可扩展...

    基于面向对象分层思想的PHP增删改查demo

    这个"球员信息管理demo"是一个很好的学习资源,可以帮助初学者理解如何在PHP中运用面向对象和分层设计原则来构建实际应用。通过分析和实践这个demo,开发者可以提升对PHP OOP的理解,以及如何组织和实现Web应用的...

    完成Java面向对象程序设计实验课的心得体会.doc

    本文通过对 Java 面向对象程序设计实验课的学习和实践,探索了 Java 的重要性和面向对象编程思想的应用。作者通过实验课的学习,逐步熟悉了 Java 编程思想,掌握了基本技巧,并体悟到面向对象编程思想的重要性。 ...

    JavaScript中支持面向对象的基础教程含代码示例

    JavaScript 中支持面向对象的基础教程含代码示例 ...本教程详细介绍了 JavaScript 中支持面向对象的基础知识,包括定义类、使用 new 操作符获得实例、引用对象的属性和方法等,为读者提供了一个系统的学习指南。

    js写的象棋(面向对象)

    【标题】"js写的象棋(面向对象)" 指的是使用JavaScript编程语言实现的中国象棋游戏,它基于面向对象的编程思想进行设计。面向对象编程(Object-Oriented Programming, OOP)是一种软件开发方法,它将数据和操作...

Global site tag (gtag.js) - Google Analytics