简单的方式


function Person() {this.name = 'person';
}
Person.prototype.say = function() {};function Child() {this.name = 'child';
}
Child.prototype = new Person();var child = new Child();

缺点:其实child并不需要person里面的name属性

借用构造函数


function Person() {this.name = 'person';
}
Person.prototype.say = function() {};function Child() {Person.call(this, arguments)
}var child = new Child();

缺点:仅会复制父类对象的属性作为子类自身的属性, 仅仅是复制**

优点:可以获得父对象自身的真实副本,子类和父类没有关系,不会影响到父类**

借用构造函数是实现多继承

function CatWings() {Cat.call(this, arguments)Brid.call(this, arguments)
}

借用构造函数和实现原型


function Person() {this.name = 'person';
}
Person.prototype.say = function() {};function Child() {Person.call(this, arguments)// this.name = 'child'
}Child.prototype = new Person()var child = new Child();
delete child.name;
// 可以看到访问:child.name的是prototype的

name属性被继承了2次

缺点:所有从Person继承的类,都是可以更改到Person的原型方法

临时构造函数

function inherit(Child, Parent) {var F = function(){}F.prototype = Parent.prototype;Child.prototype = new F();// Child.prototype.constructor = Child// Child.superclass = Parent.prototype;
}// 每次都要创建一个空的F
var inherit = (function(){var F = Function(){};return function() {F.prototype = Parent.prototype;Child.prototype = new F();// Child.prototype.constructor = Child// Child.superclass = Parent.prototype;}
})();

Klass

var Klass = function (Parent, props) {if(props == undefined && typeof Parent == 'object') {props = Parent;Parent = null;}Parent = Parent || {};props = props || {};var Child = function() {if(Child.superclass.hasOwnProperty('__construct')) {Child.superclass['__construct'].apply(this, arguments);}if(Child.prototype.hasOwnProperty('__construct')) {Child.prototype['__construct'].apply(this, arguments);}};var F = function() {};F.prototype = Parent.prototype;Child.prototype = new F();Child.prototype.constructor = Child;Child.superclass = Parent.prototype;for(var i in props) {if(props.hasOwnProperty(i)) {Child.prototype[i] = props[i];}}return Child;
}function Animal() {}Animal.prototype.__construct = function(name) {this.name = name
};Animal.prototype.getName = function() {return this.name;
};var Dog = Klass(Animal, {__construct: function(name, age) {this.age = age;},run: function() {console.log('My name is %s, I\'m %s years old ,  I\'m Running', this.getName(), this.age);}
});var dog = new Dog('xixi', 26)

转载于:https://www.cnblogs.com/human/p/5080654.html

5)Javascript设计模式:extends模式相关推荐

  1. JavaScript设计模式系列—模式篇总结(上)

    转载请注明预见才能遇见的博客:http://my.csdn.net/ 原文地址:https://blog.csdn.net/pcaxb/article/details/102517956 JavaSc ...

  2. JavaScript设计模式——Observe模式(观察者模式)

    通常一个优秀的项目,会使用到很多的设计模式,这些设计模式在我们的解决方案中,会起到十分重要的作用,它的存在,能使项目的结构更加简洁.清晰.易于理解. 所以了解常用的设计模式,会让我们在日常开发更加得心 ...

  3. JavaScript设计模式——工厂模式

    在介绍工厂模式之前,首先我们要理解一下什么是设计模式?什么是设计原则? 设计模式: 通常在我们解决问题的时候,很多时候不是只有一种方式,我们通常有多种方式来解决:但是肯定会有一种通用且高效的解决方案, ...

  4. JavaScript设计模式-工厂模式

    作者 | Jeskson 掘金 | https://juejin.im/user/5a16e1f3f265da43128096cb 什么是工厂模式,场景为你去买饺子吃,直接点餐,不用自己做,而餐厅要做 ...

  5. 【javascript】javascript设计模式mixin模式

    概述: Mixin是JavaScript中用的最普遍的模式,几乎所有流行类库都会有Mixin的实现.任意一个对象的全部或部分属性拷贝到另一个对象上. 一 .混合对象 二 .混合类 转载于:https: ...

  6. javascript设计模式--命令模式

    1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>命令模式</title> 5 <meta c ...

  7. javascript设计模式-策略模式(Strategy)

    1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title></title> 5 <meta chars ...

  8. javascript设计模式-代理模式

    代理的结构 代理模式的最基本形式就是对访问进行控制.代理对象和另一个对象实现的是同样的接口.代理对象只是节制对本体的访问. 代理对象不会在另一个对象上添加或修改方法,也不会简化对象的接口,所有对方法的 ...

  9. JavaScript设计模式——原型模式

    原型模式 用原型实例指向创建对象的类,适用于创建新的对象的类共享原型对象的属性以及方法. JavaScript语言内部实现原型模式,在编程中使用函数的prototype共享方法就是原型模式. func ...

  10. JavaScript设计模式——迭代器模式

    迭代器模式概述 迭代器模式是指提供一种方法顺序访问一个聚合对象中的各个元素,而又不需要暴露该对象的内部表示.迭代器模式可以把迭代的过程从业务逻辑中分离出来,在使用迭代器模式之后,即使不关心对象的内部构 ...

最新文章

  1. 高考623分却说自己是“反面教材”?外卖小哥最新发声!
  2. java %= %,JavaWeb
  3. SpringMVC返回Map类型转换成JSON失败
  4. C# 操作线程的通用类[测试通过]
  5. 王者荣耀、QQ音乐发声明:异常登录问题已解决
  6. 指针学习4--合成析构函数做了什么
  7. centos 6.5下安装fpm打包工具
  8. Python错误重试逼疯多少人?解决办法来了
  9. 国足输韩国,柯洁很生气,后果很严重……
  10. 7)Thymeleaf 内联表达式、文本、JavaScript、CSS
  11. 单片机:DS1302时钟
  12. Python 找完美数
  13. LTE技术派报告:LTE抛弃了CDMA?
  14. 19春学期《计算机应用基础》123,[东北大学]20春学期《计算机应用基础》在线平时作业123(参考答案)...
  15. graphpad两组t检验_GraphPad prism -- t检验操作步骤解析~
  16. 如何将dwg转换为kml
  17. Office365离线安装包
  18. 项目 调度 服务器,(2)项目构建(Reactor部分)【Lars-基于C++负载均衡远程服务器调度系统教程】...
  19. 2019该怎么学unity3D游戏开发?
  20. GAN 的内在漏洞,只看眼睛就能找出虚拟人脸?

热门文章

  1. 图像定位的优化、评价和应用简介
  2. tab weui 页面切换_weui tabbar 到底怎么用啊?tab页面为什么不能切换?
  3. 使用sklearn进行数据挖掘
  4. android otg读取索尼相机usb_索尼新概念!即将上市全画幅无反相机α7C先睹为快
  5. BCELoss忽视某个类别
  6. rmmod无法卸载驱动_从hello world到LED驱动
  7. class中函数的this指向
  8. android开发中出现R.java was modified manually! Reverting to generated version!问题的解决方法...
  9. 职称考试计算机怎么学容易,计算机职称考试备考的六个关键点
  10. python 编译器_Python教程:编译器与解释器