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