js前端继承的几种方式-介绍

一、继承

1. 面向对象三大特点：封装，继承，多态

• • 封装：打包
  • 继承：如果一个对象A不具有某个功能a，通过某种方式使用了对象B的a功能 的过程
  • 多态：对象或功能的多种形态，在使用某个对象时，不关心从哪来，在封装某个对象时，不关心将要在哪被使用

1. 继承

• • 构造函数执行之后得到的实例，继承了原型身上的方法（实例继承了类的原型）
  • 类与类之间的继承

1. 继承方式

• • 构造函数继承（改变this指向继承）

• • • call，apply，bind
    • 简单方便易操作
    • 非常易于做多继承
    • 只能继承构造函数内的属性或方法，不能继承原型身上的属性或方法

• • 原型对象继承

• • • 其实就是在拷贝原型对象，同时注意深浅拷贝
    • 只能继承原型对象上的属性或方法，不能继承构造函数内的属性或方法
    • 可以实现多继承

• • 原型链继承

• • • 既能继承构造函数内的属性或方法，又能继承原型上的属性或方法
    • 但是不方便处理参数
    • 不适合多继承

• • 混合（组合）继承

• • • 构造函数+原型对象
    • 构造函数+原型链
    • 集合了各种方式的优点

• • ES6新增的class的继承

• • • 语法层面上的继承
    • 父类是子类的超类
    • 原理：构造函数+原型继承

二、原型

1. 隐式原型对象：__proto__，一般存在于对象身上，用于指向创建该对象的构造函数的prototype。
2. 显示原型对象：prototype，只存在于函数身上（除了箭头函数），用来被通过自身创建的对象的__proto__指向。
3. 隐式原型的使用规则：

• • 每个对象都有__proto__，对象每次在使用属性或方法时，如果自身不存在，都会沿着__proto__的指向，依次查找，直到Object.prototype
  • 一个构造函数可以创建多个实例，如果给构造函数的prototype添加方法或属性，将来的每个实例都可以访问，达到节省内存的效果
  • 构造函数的prototype类似于将来所有实例的公共空间，提供公共方法，被实例使用

1. 补充：构造函数的prototype自带了一个constructor的属性，用来标记当前prototype对象所属的函数

三、原型和实例关系的检测

1. 关键字：instanceof

• • 实例 instanceof 构造函数

1. 显示原型对象的方法：isPrototypeOf()

• • 构造函数.prototype.isPrototypeOf(实例)

1. 有关系，无论多少层，都返回true，否则返回false
2. 小技巧：可以利用该关系检测方式区分对象，数组

四、数据类型的万能检测方式

1. Object.prototype.toString.call("hello")

• • [object String]