博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
js继承的实现方法
阅读量:6507 次
发布时间:2019-06-24

本文共 2565 字,大约阅读时间需要 8 分钟。


1.使用new方法继承

实现原理:在子类的构造函数中调用父类的构造函数。

function Parent(name){    this.name = name;    this.age = 40;    this.sayName = function(){        console.log(this.name);    }    this.sayAge = function(){        console.log(this.age);    }}function Child(name){    this.parent = Parent;    this.parent(name);    delete this.parent;    this.saySomething = function(){        console.log(this.name);        this.sayAge();    }}var child = new Child('Lee');child.saySomething();//Lee//40

2.使用call方法实现

实现原理:使用call方法改变函数上下文this指向,使之传入具体的函数对象。

function Parent(name){    this.name = name;    this.age = 40;    this.say = function(){        console.log(this.name + this.age);    }}function Child(name){    Parent.call(this,name); }var child = new Child('Mike');child.say();//Mike40

3.使用apply方法实现

实现原理:使用apply方法改变函数上下文this指向,使之传入具体的函数对象。

function Parent(name){    this.name = name;    this.age = 40;    this.say = function(){        console.log(this.name + this.age);    }}function Child(name){    Parent.apply(this,[name]);    //Parent.apply(this,arguments); 效果同上}var child = new Child('Wade');child.say();//wade40

4.使用原型链(prototype)方法实现

实现原理:子类的原型对象指向父类的实例,即重写类的原型。

function Parent(name){    this.name = name;    this.say = function(){        console.log(this.name +' '+ this.age);    }}function Child(age){    this.age = age;    this.saySomething = function(){        console.log(this.name);    }}Child.prototype = new Parent('petter');var child = new Child(20);child.say();//petter  20

5.使用混合方式实现

实现原理:使用原型链实现对原型属性和方法的继承,而通过借用构造函数来实现对实例属性的继承。

function Parent(age){    this.name = 'petter';    this.age = age;}Parent.prototype.say = function(){    return this.name + ' ' + this.age;}function Child(age){    Parent.call(this,age);    //Parent.apply(this,[age]);    this.age = age;}Child.prototype = new Parent();var child = new Child(21);child.say();//petter  21

6. 寄生组合继承

实现原理:通过寄生方式,砍掉父类的实例属性,这样,在调用两次父类的构造的时候,就不会初始化两次实例方法/属性,避免的混合继承的缺点

function Animal(name){        this.name = name;        this.sleep = function(){            console.log(this.name + 'is sleeping');        }    }    function Cat(name){      Animal.call(this);      this.name = name || 'Tom';    }    (function(){      // 创建一个没有实例方法的类      var Super = function(){};      Super.prototype = Animal.prototype;      //将实例作为子类的原型      Cat.prototype = new Super();    })();    // Test Code    var cat = new Cat();    console.log(cat.name);//Tom    console.log(cat.sleep());//Tom is sleeping    console.log(cat instanceof Animal); // true    console.log(cat instanceof Cat); //true

由于此篇中有涉及原型链和Call、Apply, 后面会写关于此知识点的文章。

转载地址:http://wjzfo.baihongyu.com/

你可能感兴趣的文章
2018-2019-1 20165302 实验五 通讯协议设计
查看>>
centos6.5安装LNMP
查看>>
Golang 知识点总结
查看>>
JAVA 8 特性
查看>>
算法设计 - LCS 最长公共子序列&&最长公共子串 &&LIS 最长递增子序列
查看>>
WebService之Axis2快速入门(7): Spring与axis整合发布为WebServic
查看>>
Uliweb查看模板调用关系
查看>>
C#与PHP通信压缩
查看>>
根据经纬度获取时区信息
查看>>
关于 Linux
查看>>
图文解析五大外链误区
查看>>
ios开发之导航控制器的原理
查看>>
《Netkiller Blockchain 手札》Hyperledger Fabric Java SDK Demo
查看>>
Spring cloud 安全部署与性能优化
查看>>
querySelector 和 querySelectorAll区别
查看>>
Linux系统_Centos7下安装Nginx
查看>>
《PHP和MySQL Web 开发》 第12章 MySQL高级管理
查看>>
数据库设计 Step by Step (6) —— 提取业务规则
查看>>
深入理解java异常处理机制
查看>>
Redis客户端redisson实战
查看>>