JavaScript实现类与继承的方法（全面整理）

Near_Li 发布于2019-08-26 11:42 / 1508人阅读

摘要：定义类的种方法工厂方法构造函数方法原型方法大家可以看到这种方法有缺陷，类里属性的值都是在原型里给定的。组合使用构造函数和原型方法使用最广将构造函数方法和原型方法结合使用是目前最常用的定义类的方法。

JavaScript定义类的4种方法 工厂方法

function creatPerson(name, age) {
            
    var obj = new Object();

    obj.name = name;
    obj.age = age;

    obj.sayName = function() {
        window.alert(this.name);
    };
            
    return obj;
}

构造函数方法

function Person(name, age) {

    this.name = name;
    this.age = age;

    this.sayName = function() {
        window.alert(this.name);
    };
}

原型方法

function Person() {
        
}
        
Person.prototype = {
    constructor : Person,
    name : "Ning",
    age : "23",
    sayName : function() {
        window.alert(this.name);
    }
};

大家可以看到这种方法有缺陷，类里属性的值都是在原型里给定的。

组合使用构造函数和原型方法（使用最广）

function Person(name, age) {
    this.name = name;
    this.age = age;
}
        
Person.prototype = {
    constructor : Person, 
    sayName : function() {
        window.alert(this.name);
    }
};

将构造函数方法和原型方法结合使用是目前最常用的定义类的方法。这种方法的好处是实现了属性定义和方法定义的分离。比如我可以创建两个对象person1和person2，它们分别传入各自的name值和age值，但sayName()方法可以同时使用原型里定义的。

JavaScript实现继承的3种方法 借用构造函数法（又叫经典继承）

function SuperType(name) {

    this.name = name;

    this.sayName = function() {
        window.alert(this.name);
    };
}
        
function SubType(name, age) {

    SuperType.call(this, name); //在这里借用了父类的构造函数

    this.age = age;
}

对象冒充

function SuperType(name) {

    this.name = name;
    
    this.sayName = function() {
        window.alert(this.name);
    };
}
        
function SubType(name, age) {

    this.supertype = SuperType; //在这里使用了对象冒充
    this.supertype(name);

    this.age = age;
}

组合继承（最常用）

function SuperType(name) {

    this.name = name;

}
        
SuperType.prototype = {
        
    sayName : function() {
        window.alert(this.name);
    }
};
        
function SubType(name, age) {
    
    SuperType.call(this, name); //在这里继承属性
    this.age = age;
}

SubType.prototype = new SuperType(); //这里继承方法

组合继承的方法是对应着我们用‘组合使用构造函数和原型方法’定义父类的一种继承方法。同样的，我们的属性和方法是分开继承的。

总结

以上就是常见的JavaScript中面向对象编程的几种实现，欢迎大家补充与指正。

GPU云服务器云服务器 javascript继承方法 Javascript实现继承 javascript如何实现继承 python类与继承

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/107389.html

50道JavaScript基础面试题（附答案）

摘要：事件中属性等于。响应的状态为或者。同步在上会产生页面假死的问题。表示声明的变量未初始化，转换为数值时为。但并非所有浏览器都支持事件捕获。它由两部分构成函数，以及创建该函数的环境。 1 介绍JavaScript的基本数据类型Number、String 、Boolean 、Null、Undefined Object 是 JavaScript 中所有对象的父对象数据封装类对象：Object、...

huaixiaoz 2019-08-22 18:04 评论0 收藏0
php面向对象详解

摘要：前言自从进入版本以来，开始全面地支持面向对象编程。好了，进入正题，面向对象的三大特性分别是封装性，继承性以及多态性，使用面向对象开发，让我们的程序可维护以及扩展性大大提高。 showImg(https://segmentfault.com/img/remote/1460000012257579?w=1920&h=1080); 前言自从php进入5.0版本以来，PHP开始全面地支持面向...

xingpingz 2019-06-28 14:25 评论0 收藏0
javascript的类与继承

摘要：的类与继承的类与一般的面向对象语言有很大的不同，类的标识是它的构造函数，下面先定义一个类显然我们可以看出这两个函数是不同的，虽然它们实现了相同的功能。利用构造函数来继承上面的方法子类显然无法继承父类的原型函数，这样不符合我们使用继承的目的。 javascript的类与继承 javascript的类与一般的面向对象语言有很大的不同，类的标识是它的构造函数，下面先定义一个类 var ...

impig33 2019-08-21 10:23 评论0 收藏0
谈谈我对面向对象以及类与对象的理解

showImg(https://segmentfault.com/img/remote/1460000007103938?w=391&h=247); 文章最初发表于我的个人博客非典型性程序猿对于刚接触JAVA或者其他面向对象编程语言的朋友们来说，可能一开始都很难理解面向对象的概念以及类和对象的关系。笔者曾经带过一个短期培训班教授java入门基础，在最后结束课程的时候，还有很多同学不太理解面向对象...

walterrwu 2019-08-14 15:55 评论0 收藏0
SegmentFault 技术周刊 Vol.40 - 2018，来学习一门新的编程语言吧！

摘要：入门，第一个这是一门很新的语言，年前后正式公布，算起来是比较年轻的编程语言了，更重要的是它是面向程序员的函数式编程语言，它的代码运行在之上。它通过编辑类工具，带来了先进的编辑体验，增强了语言服务。 showImg(https://segmentfault.com/img/bV1xdq?w=900&h=385); 新的一年不知不觉已经到来了，总结过去的 2017，相信小伙们一定有很多收获...

caspar 2019-08-15 13:33 评论0 收藏0