JS继承

作者: 没了提心吊胆的稗子 | 来源:发表于2019-07-09 09:32 被阅读0次
function A(){
}
function B(){
}

1、原型继承

让子类的原型等于父类的一个实例,但是原来原型上的constructor没有了,会一步步向上找到A中的constructor,因此要加上constructor属性,实例中私有的属性和公有属性都可以继承为子类的公有属性
[弊端]在一个实例中修改父类的方法,其他实例也会受影响

B.prototype = new A();
B.prototype.constructor = B

2、call方法继承

在子类的函数体中,把父类当作普通函数执行,并让父类中的this变为子类,就相当于把父类中所有的私有属性都赋给子类的实例了,把父类上的私有属性都变为子类的私有属性
[弊端]
只能把父类中私有的继承为子类中私有的,但是父类原型上的公有属性及方法无法继承

function A(){
  this.x = 10;
}
A.prototype = {
  constructor: A,
  ...
}
function B(){
  A.call(this);  // this->B  相当于把A中的this变为B
}

3、冒充对象继承

在子类的函数体中,先获取父类的一个实例,遍历实例中的所有私有公有属性依次赋值给子类的私有属性

function A(){
  .....
}
A.prototype = {
  constructor: A,
  ....
};
function B(){
  constructor = B,
  var pro = new A;
  for(var key in pro){
        if(key in this){
            this["my"+key] = pro[key];
        }
        if(key === 'constructor')
          continue;
        this[key] = pro[key];
    }
}

4、寄生式继承

父类的公有的属性继承为子类的公有属性,私有属性继承为子类中私有属性
IE6-8不兼容

function A(){
  this.x = 10;
}
A.prototype = {
  constructor: A,
  ...
}
function B(){
  A.call(this);   // 存了A中私有的
}
B.prototype = Object.create(A.prototype);  
B.constructor = B;

//  兼容的寄生式继承
function objectCerate(o){
  function fn(){}
  fn.prototype = o;
  return new fn;
}

5、混合模式继承

优化:B.prototype = A.prototype

function A(){
  this.x = 10;
}
A.prototype = {
  constructor: A,
  ...
}
function B(){
  A.call(this);   // 存了A中私有的
}
B.prototype = new A;  // A中私有公有都存在了
B.constructor = B;
// 新建一个方法删除第二次继承的父类中的私有属性
B.deletePrivate = (function() {
  var a = new A;
  for(var key in this){
      if(a.hasOwnProperty(key)){
          delete this[key];
      }
  }
  return null;
}).call(B.prototype);

6、中间类继承 IE不兼容,只处理内置类

function sum() {
    arguments.__proto__ = Array.prototype;
    arguments.sort(function (a,b) {
        return a - b;
    });
    console.log(arguments);
}
sum(12,13,24,6,32,17);

相关文章

  • Js的继承

    js的继承 @(js)[继承, js, 前端] 组合继承是原性链继承和构造函数继承的合体,它汲取了二者各自的有点,...

  • JS继承

    JS中的继承 许多OO语言都支持两种继承方式:接口继承和实现继承; 因为JS中没有类和接口的概念 , 所以JS不支...

  • #js继承

    js继承的概念 js里常用的如下两种继承方式: 原型链继承(对象间的继承)类式继承(构造函数间的继承) 类式继承是...

  • js继承遇到的小问题

    这两天在看js继承方面,它不像OC那种传统的类继承。js继承方式还是挺多的。比如:原型继承、原型冒充、复制继承 原...

  • JS中继承的实现

    JS中继承的实现 #prototype (js原型(prototype)实现继承) 全局的Function对象没有...

  • js继承

    js继承js 继承-简书 原型链实现集继承 上面的代码实现原型链继承最重要的son.prototype=new f...

  • JavaScript 10

    js继承的概念 1.通过原型链方式实现继承(对象间的继承) 2.类式继承(构造函数间的继承) 由于js不像Java...

  • JS继承的实现的几种方式

    前言 JS作为面向对象的弱类型语言,继承也是非常强大的特性之一,那么如何在JS实现继承呢? JS继承的实现方式 既...

  • 2019-03-25 继承

    js中通过原型来实现继承 组合继承:原型继承+借用构造函数继承

  • 继承方式(6种)1.7

    JS作为面向对象的弱类型语言,继承也是其非常强大的特性之一。那么如何在JS中实现继承呢?让我们拭目以待。 JS继承...

网友评论

      本文标题:JS继承

      本文链接:https://www.haomeiwen.com/subject/uqvahctx.html