js 面向对象

继承：1.公用属性和方法放在父类中，避免代码冗余
封装: 1.减少耦合,不改外漏属性的不外漏; 2.利于数据\接口的权限管理   --->  符合五大设计原则的 单一职责原则和开放封闭原则
    protected 受保护的属性,只有自己或者子类访问
    private 私有属性,仅自己能访问
    public 公开属性
多态:一个接口可以有不同的实现

1. ES5原理及实例

原理：
// 构造函数,构造函数上都有一个显式原型
function MathHandle(x, y) {
	this.x = x
	this.y = y
}
// 构造函数的原型上添加add方法
MathHandle.prototype.add = function() {
	return this.x + this.y
}
// m是实例,实例上都有一个隐式原型__proto__
var m = new MathHandle(1, 2)
typeof MathHandle  // 'function'
MathHandle.prototype.construtor === MathHandle  // true 
m.__proto__ = MathHandle.prototype // true

实例：jQuery
// $('.container').css()
(function(window) {
    // jq 是一个实例
   var jQuery = function(selector) {
       return new jQuery.fn.init(selector)
   }
   jQuery.fn  = jQuery.prototype = {
       constructor: jQuery,
       css: function() {
           console.log(1)
       }
   }
   var init = jQuery.fn.init = function(selector) {
    // ...dom
   }
   init.prototype = jQuery.fn
   window.$ = jQuery
}(window))

2. ES6实例

原理：
class MathHandle {
	constructor(x, y) {
		this.x = x
		this.y = y
	}
	add() {
		return this.x + this.y
	}
}
const m = new MathHandle(1, 2)
typeof MathHandle  // 'function'
MathHandle.prototype.construtor === MathHandle  // true 
m.__proto__ = MathHandle.prototype // true

实例jQuery
class jQuery {
    constructor(selector) {
        // ...dom
    }
    css() {
        console.log(1110)
    }
}
window.$ = function(selector) {
    return new jQuery(selector)
}