JavaScript inheritance to achieve polymorphism and encapsulation principle Detailed

Three characteristics of object-oriented

Package

The so-called package, which is the objective things packaged as an abstract class, and the class can put their data and methods allow only trusted class or object manipulation, hiding on untrusted information. Packaging is one of the features of object-oriented concepts and the main properties of the object classes. Briefly, a class is a logical entity that encapsulates data and operation code data. In an internal object, some code or some data may be private and can not be accessed outside world. In this manner, the internal data objects provide different levels of protection to prevent accidental changing part of the program irrelevant or incorrect use of the private portion of the object.

We will make public use of mixed code, mixed into each component needed in vue project, so that our code more concise

We can also be some common methods, tools package, to achieve code reuse, so that our code more concise

inherit

The so-called inheritance is one that can make objects of a type of a method for obtaining the properties of an object of another type. It supports the concept of by-level classification. Inheritance refers to such a capability: it can use all the features of an existing class, and without having to rewrite these functions extend the case of the original class. Create a new class by inheriting called "sub-class" or "derived class", inherited class called "base class", "parent" or "superclass." Succession process, that is, from the general to the particular process. To achieve inheritance, can be achieved by "inheritance" (Inheritance) and "combination" (Composition). Implementation of the concept of inheritance are two categories: implementation inheritance and interface inheritance. Means a direct inheritance properties and methods of the base class and without additional coding capability; inherits the interface is the use of only the attributes and methods of the name, but subclass must provide the ability to achieve;

Inheritance in several ways

call inheritance

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

The above code corresponds to the function a function b inherited private property, by changing the inheritance of this parent

Prototypal inheritance

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()) // 你好

Examples of prototype prototype inheritance by assigning subclasses of the parent class, this method subclasses inherit parent class private private methods of the parent class can inherit

Parasitic combination of inheritance

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()) // 你好

Parasitic inheritance is to use a combination of inherited call to change this, to achieve private inheritance of private, public use object.create achieve public inheritance

es6 extends inheritance

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

Here achieve private and public subclass inherits the parent class by keyword extends, It should be noted if a subclass written inside a constructor, otherwise it will have to write super error

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

Polymorphism

Polymorphism refers to the so-called method of the same instance of a class have different forms in different situations. Of polymorphism so that objects having different internal structures can share the same external interface. This means that, although different specific actions for different objects, but through a common class, they (those operations) can be invoked in the same way.

Overload

Function overloading means within the same scope, there may be a group having the same function name, a list of functions of different parameters, the set of functions are called overloaded function. Overloaded functions normally used to name a set of functions similar functionality, this reduces the number of function names, to avoid the contamination of the name space, for readability a great advantage.

  • js find the corresponding function object through the function name
  • Then based on the function according to the parameters, parameter list, and when the expression is defined in order to match, discarding the extra parameters, the parameters as undefined process not
  • Then execute the function code.
// the number of arguments can be achieved with the data overload 
function the Add () { 
var SUM = 0; 
for (var I = 0; I <The arguments.length; I ++) { 
SUM + = arguments [I]; 
} 
return SUM ; 
} 
the console.log (the Add ()) // 0 
the console.log (the Add (1,2)). 3 // 
the console.log (the Add (l, 2,3)) //. 6

Rewrite

"Pointer to the prototype example only, and not to the constructor."

"Rewriting the prototype object severed the relationship between object instances and any existing prototypes previously existed; they refer to is still the first prototype."

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();

The above code by using a combination of parasitic inheritance, implementation subclass parent private private inheritance, the subclass inherits the parent class public public, to override the parent class showProper

The five principles of object-oriented

  • Single Responsibility Principle
  • Open Closed Principle
  • Substitution principle
  • Dependencies Principle
  • The principle of separation Interface

Single Responsibility Principle

Single Responsibility Principle is a method we are talking about only one thing, it is now such a project structure, it follows the principle of single responsibility

Open Closed Principle

Open Closed Principle is closed for modification, open to extension

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

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

We can use extends inherit the parent class, you can then modify the add function inside b, achieve closed for modification, open to extension

That's all for this article, I want to help learning

You may also be interested in the article:

Article simultaneous release:  https://www.geek-share.com/detail/2775366797.html

Guess you like

Origin www.cnblogs.com/xxcn/p/11267831.html