美文网首页
非构造函数实现继承

非构造函数实现继承

作者: RichardBillion | 来源:发表于2016-03-28 19:07 被阅读29次
var Chinese={
  nation:'china'
}
var Doctor={
  career:'doctor'
}

这两个都是对象,不是构造函数,如何让Doctor继承Chinese的国家呢


(1)object()方法
思想就是:没有构造函数,我就制造构造函数。这是道格拉斯先生想出来的

function object(o){
   function Fun(){}
   Fun.prototype=o;
  return new Fun();
}

那么就可以这样继承:

Doctor=object(Chinese);
console.log(Doctor.nation);

但是,此时的医生的职业已经被冲掉,因为Doctor被重新定义了,所以要再补充上

Doctor.career="doctor";

(2)浅拷贝
用拷贝的方法实现继承就是将父对象的属性都拷贝到子对象中。

function extendCopy(p,c){
  for(var i in p){
    c[i]=p[i];
  }
  return c;
}

然后再extendCopy(Chinese,Doctor);就可以,得益于for in 循环,这个不用再重写Doctor的career属性。
但是这个叫做浅拷贝,也就是当复制数组或对象的时候,是存储的父对象的地址,两个对象在内存中指向同一个地址。

var Chinese={
  nation:'china',
  birthPlaces :['北京','上海','香港']
}
var Doctor={
  career:'doctor'
}
function extendCopy(p,c){
  for(var i in p){
    c[i]=p[i];
  }
  return c;
}
extendCopy(Chinese,Doctor);
console.log(Doctor.career);
console.log(Doctor.nation)
Doctor.nation="America";
console.log(Doctor.nation);
console.log(Chinese.nation);
console.log("***********************");
console.log(Doctor.birthPlaces);
Doctor.birthPlaces.push('厦门');
console.log(Chinese.birthPlaces);
doctor
china
America
china //对于基本类型确实没有影响
***********************
["北京", "上海", "香港"]
["北京", "上海", "香港", "厦门"] //对象的浅拷贝使两者指向同一内存地址

这里补充一下JS中的值传递的知识:为什么基本类型无所谓浅还是深拷贝?以下是个人的解读,如有错误,欢迎指出:
参考:http://bosn.me/js/js-call-by-sharing/
基本类型是按值传递,函数的形参是实参的副本,修改形参的值不会影响实参。

var a=10;
var b=a;
b=6
console.log(a);//10

对象,是可变的,按共享传递,调用函数传参时,函数接受对象实参引用的副本。但和引用传递的不同是:对函数形参的赋值,不会影响实参的值。

var obj = {x : 1};
function foo(o) {
    o = 100;
}
foo(obj);
console.log(obj.x);//1

但是因为共享相同的对象,所以修改形参的属性值,也会影响实参的属性值。

var obj = {x : 1};
function foo(o) {
    o.x= 100;
}
foo(obj);
console.log(obj.x);//100

(3)深拷贝

function deepCopy(p,c){
  var c=c||{};
  for(var i in p){
    if(typeof p[i] === 'object'){
      c[i]=(p[i].constructor===Array)?[]:{};
      deepCopy(p[i],c[i]);
     }
  }else{
    c[i]=p[i];
  }
  return c;
}

判断一下是数组还是对象,然后递归调用浅拷贝。

相关文章

  • 继承方法

    构造函数/原型/实例的关系 借助构造函数实现继承 借助原型链实现继承(弥补构造函数实现继承不足) 组合方式(组合原...

  • 非构造函数实现继承

    这两个都是对象,不是构造函数,如何让Doctor继承Chinese的国家呢 (1)object()方法思想就是:没...

  • 构造函数继承-非构造函数继承

    1.constructor 为了解决从原型对象生成实例的问题,JavaScript提供了一个构造函数(Constr...

  • 2018-06-01 js模拟继承

    这篇主要讲了 构造函数实现继承 原型链实现继承 构造函数+原型链实现继承(两种) 1: call() apply(...

  • js基础之实现继承的几种方式

    js 实现继承的方式有: 原型链继承; 构造函数继承; 组合继承(原型链继承 + 构造函数继承)(最常用);(原型...

  • js继承

    1、原型式继承:借助构造函数的原型对象实现继承,即 子构造函数.prototype = 父构造函数.prototy...

  • 前端面试准备--6.面向对象

    面向对象 1、类与实例 2、类与继承 1.借助构造函数实现继承 2.借助原型链实现继承(弥补构造函数实现继承不足)...

  • ES5和ES6中继承的不同之处

    1、JS中是没有继承的,不过可以通过构造函数或是原型等实现继承,ES5实现继承的方法——构造函数,当一个构造函数加...

  • 继承

    1.构造函数实现继承,具体:在构造函数中,使用apply()和call()方法实现继承 function Pers...

  • 类 继承

    构造函数 等价于 静态方法 相当于 继承 class实现继承 原型实现继承

网友评论

      本文标题:非构造函数实现继承

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