JavaScript 继承封装多态实现及原理详解

时间 2019-11-11

标签 javascript 继承封装实现原理详解栏目 JavaScript 繁體版

原文原文链接

面向对象的三大特性javascript

封装html

所谓封装，也就是把客观事物封装成抽象的类，而且类能够把本身的数据和方法只让可信的类或者对象操做，对不可信的进行信息隐藏。封装是面向对象的特征之一，是对象和类概念的主要特性。简单的说，一个类就是一个封装了数据以及操做这些数据的代码的逻辑实体。在一个对象内部，某些代码或某些数据能够是私有的，不能被外界访问。经过这种方式，对象对内部数据提供了不一样级别的保护，以防止程序中无关的部分意外的改变或错误的使用了对象的私有部分。vue

咱们在vue项目中使用混入将公有代码提出来，混入到每一个须要的组件中，让咱们的代码更简洁java

咱们也能够将一些公用的方法，工具进行封装，达到代码复用，让咱们的代码更简洁es6

继承编程

所谓继承是指可让某个类型的对象得到另外一个类型的对象的属性的方法。它支持按级分类的概念。继承是指这样一种能力：它可使用现有类的全部功能，并在无需从新编写原来的类的状况下对这些功能进行扩展。经过继承建立的新类称为“子类”或“派生类”，被继承的类称为“基类”、“父类”或“超类”。继承的过程，就是从通常到特殊的过程。要实现继承，能够经过“继承”（Inheritance）和“组合”（Composition）来实现。继承概念的实现方式有二类：实现继承与接口继承。实现继承是指直接使用基类的属性和方法而无需额外编码的能力；接口继承是指仅使用属性和方法的名称、可是子类必须提供实现的能力；函数

实现继承的几种方式工具

call继承学习

function a (){
this.c=111
}
function b(){
a.call(this)
}
let d = new b()
console.log(d.c) // 111

上面代码至关于函数b继承了函数a的私有属性，经过改变父类的this实现继承this

原型继承

function a (){
this.c=111
}
a.prototype.getName=function(){
return '你好'
}
function b(){
// a.call(this)
}
b.prototype=new a()
b.constructor=b
let d = new b()
console.log(d.c) // 111
console.log(d.getName()) // 你好

原型继承经过将父类的实例赋值给子类的原型，这种方法子类能够继承父类的私有方法也能够继承父类的私有方法

寄生组合继承

function a (){
this.c=111
}
a.prototype.getName=function(){
return '你好'
}
function b(){
a.call(this)
}
b.prototype=Object.create(a.prototype)
let d = new b()
console.log(d.c) // 111
console.log(d.getName()) // 你好

寄生组合继承就是使用call继承改变this，实现私有继承私有，使用object.create实现公有继承公有

es6 extends 继承

class parent{
constructor(){
this.a=1
}
name(){
return 2
}
}
class child extends parent{

}
let A = new child()
console.log(A.a) // 1
console.log(A.name()) // 2

这里经过关键字extends实现子类继承父类的私有和公有，这里须要注意若是子类里面写了constructor，就必须写super不然会报错

class parent{
constructor(){
this.a=1
}
name(){
return 2
}
}
class child extends parent{
constructor(){
// 这里不写super会报错，报错信息以下
}
}
// ncaught ReferenceError: Must call super constructor in derived class before accessing 'this' or returning from derived constructor at new child

多态

所谓多态就是指一个类实例的相同方法在不一样情形有不一样表现形式。多态机制使具备不一样内部结构的对象能够共享相同的外部接口。这意味着，虽然针对不一样对象的具体操做不一样，但经过一个公共的类，它们（那些操做）能够经过相同的方式予以调用。

重载

函数重载是指在同一做用域内，能够有一组具备相同函数名，不一样参数列表的函数，这组函数被称为重载函数。重载函数一般用来命名一组功能类似的函数，这样作减小了函数名的数量，避免了名字空间的污染，对于程序的可读性有很大的好处。

js经过函数名找到对应的函数对象
而后根据函数按照定义时的参数，和表达式参数列表按顺序匹配，多余的参数舍去，不够的参数按undefined处理
而后执行函数代码。

// 能够跟据arguments个数实现重载
function add() {
var sum = 0 ;
for ( var i = 0 ; i < arguments.length; i ++ ) {
sum += arguments[i];
}
return sum;
}
console.log(add()) // 0
console.log(add(1,2)) // 3
console.log(add(1,2,3)) // 6

重写

“实例中的指针仅指向原型，而不是指向构造函数”。

“重写原型对象切断了现有原型与任何以前已经存在的对象实例之间的关系；它们引用的仍然是最初的原型”。

var parent = function(name,age){
this.name = name;
this.age = age;
}

parent.prototype.showProper = function(){
console.log(this.name+":"+this.age);
}

var child = function(name,age){
parent.call(this,name,age);
}

// inheritance
child.prototype = Object.create(parent.prototype);
// child.prototype = new parent();
child.prototype.constructor = child;

// rewrite function
child.prototype.showProper = function(){
console.log('I am '+this.name+":"+this.age);
}

var obj = new child('wozien','22');
obj.showProper();

上面这段代码经过使用寄生组合继承，实现子类私有继承父类私有，子类公有继承父类公有，达到重写父类的showProper

面向对象的5大原则

单一职责原则
开放封闭原则
替换原则
依赖原则
接口分离原则

单一职责原则

单一职责原则就是咱们说的一个方法只作一件事，就好比如今的项目结构，就遵循了单一职责原则

开放封闭原则

开放封闭原则就是对修改关闭，对扩展开放

class a {
add(){
return 11
}
}
class b extends a{

}
let c = new b()
console.log(c.add()) // 111

咱们可使用extends继承父类，能够再b里面修改add函数，实现对修改关闭，对扩展开放

以上就是本文的所有内容，但愿对你们的学习有所帮助

您可能感兴趣的文章:

文章同步发布： https://www.geek-share.com/detail/2775366797.html

JavaScript 继承 封装 多态实现及原理详解

您可能感兴趣的文章:

JavaScript 继承封装多态实现及原理详解