文章目录

  • 对象的继承
  • ​​1.定义​​
  • ​​2.使用​​
  • ​​方法一：使用函数来实现继承​​
  • ​​方法二：使用call或者apply来实现继承​​
  • ​​call和apply的缺点​​
  • ​​方法三：原型链继承方法​​
  • ​​原型链继承的缺点​​
  • ​​解决办法 组合继承​​

对象的继承

1.定义

JavaScript是没有明确的继承机制，也是通过模仿实现的。

首先父类和子类的构造函数是使用this关键字给所有属性和方法
赋值。为了实现继承，我们可以让​​​父类的构造函数成为子类的方法​​。然后调用该子类的方法通过this关键字给的属性和方法赋值。这样子类就拥有父类的方法与属性了。

2.使用

方法一：使用函数来实现继承

第一步：在子类里面和父类进行关联

this.子类属性=父类构造函数名；

第二步;调用子类.关联函数名（【参数】）；//这一步就是把父类的函数和方法加入到子类里面

this.子类属性（【参数】）；

第三步 删除关联delete this.子类属性//这个时候父类的方法和属性已经父之过来了

调用函数的时候无论是那种方式都要有小括号

方法二：使用call或者apply来实现继承

call方法:

语法: obj.call(thisObj, arg1, arg2, …

apply方法: .

语法: obj.apply(thisObj, [arg1, arg2, …);

解释：就是把object的参数复制到了thisobject里面，this代表所有的参数；

相同点:都是把obj(即this)绑定到 thisObj, 这时候thisObj具备
了obj的属性和方法。或者说thisObj继承 了obj的属性和方法。
区别: apply接收的是数组参数, call接收的是连续参数。

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>对象冒充方法</title>
    <script type="text/javascript">
      function add(a, b) {
        alert(a + b);
      }

      function sub(a, b) {
        alert(a - b);
      }

      add.call(sub, 8, 5);//这里的对象是sub一般书this

    </script>
  </head>
  <body></body>
</html>

显示是13

这个例子中改变sub对象的指向，sub指向了add,从而执行add
对象(函数)的操怍“8+5”。
。
注意: js 中的函数其实是对象，函数名是对Function对象的引
用。

再举一个例子

function Animal() {
    this.species = "动物";
    this.species1 = "动物1";
}
//实现继承
function Cat(name, color) {
    this.name = name;
    this.color = color;
    Animal.call(this,this);
}

var cat = new Cat("猫", "白色");
document.write(cat.species); 
document.write(cat.species1);

JavaScript面向对象-3_javascript

call和apply的缺点

这种办法只能继承父类的实例属性，因而找不到方法。

方法三：原型链继承方法

首先回顾下原型的概念 : Javascript规定，每一个构造函数都有一​​prototype​​属性，指向另一个对象。这个对象的所有属性和方法，都会被构造函数的实例继承。那么我们可以将子类的prototype属性指向父类对象，继承父类的所有属性和方法从而实现继承。

JavaScript对象有一个特性，假设读取某个对象的属性x，首先会在这个对象的自身属性中查找。若没有找到，将会在此对象所处的​​原型链​​中查找属性x，一直到找到属性x或者无原型为止。

对象属性分类：

  ① 自有属性：也可叫实例属性，指对象自身的属性。

  ② 继承属性：也可叫原型属性，指对象从原型中继承的属性。

​​凡是通过 new Function() 创建的对象都是函数对象，其他的都是普通对象。​​

JavaScript面向对象-3_父类_02


JavaScript面向对象-3_javascript_03


举个例子

function Person (name, age) {
    this.name = name;
    this.age = age;
  Person.prototype.say = function(){
    document.write('hello, my name is ' + this.name);
};
}

//在此添加代码
function Man() {}
Man.prototype = new Person('Jack',30);//直接让这个构造函数成为他的原型
var man = new Man();
man.say();
document.write("<br>"+man.name);

JavaScript面向对象-3_html_04

原型链继承的缺点

因为是公用的一个，函数或者是属性值，相当于java的final一个函数对象改变他，其他的对象在调用他的时候，用的是改变过后的

解决办法 组合继承

​​用借用构造函数模式来定义实例的属性，而原型模式用于定义方法和共享的属性​​

function Polygon(side) {
  this.side = side;
};

Polygon.prototype.getSize= function() {
  return 0;
};
//请修改Rectangle
function Rectangle(width, height) {
  this.width = width;
  this.height = height;
    Polygon.call(this,4);
};
Rectangle.prototype=new Polygon();
Rectangle.prototype.getSize=function()
{
  return this.width+"-"+this.height;//重点
  
};
var r = new Rectangle(3, 5);
document.write(r.side+"</br>");
document.write(r.getSize());