Javascript object-oriented basics and implementation of interfaces and inheritance classes (1)

Before writing the design pattern, it is necessary to introduce the concept of Javascript object-oriented, so this article takes the object-oriented basics as the starting point.

Theoretical Knowledge

1. javascript is a weak type language. It does not need to declare a type when defining a variable, for example, var Person = new Person (). Its variable type is "var ", the concept of anonymous type is introduced in C #3.0. variables of the weak type have great flexibility, because Javascript will convert the types as needed. Therefore, it also determines that it adopts the late binding method, that is, it knows the type of the variable after running;

2. Needless to say, object-oriented concepts include encapsulation, inheritance, and polymorphism;

3. javascript objects can be divided into three types: local objects, such as String, Array, Date, built-in objects, such as Global, Math, and host objects, it refers to the scopes in traditional object-oriented programming, such as public, protection, private, and static.

Main Content

1. Now let's take a look at how Javascript creates objects:

function Man() { // }Man.prototype.getNickName = function() { return "Leepy";}; var man = new Man();var name = man.getNickName();

In this way, the simplest class and object are created. Here, we can regard function Man () {} as the Man class constructor, and getNickName () as the Man class method, to be accurate, it can be "treated" as a public method of the Man class. Why is it? That's because Javascript does not actually have a proprietary division. Therefore, developers have designated such a statute themselves. What is the statute like? Here I will list the Man class in full:

Function Man () {// Private Static Property var Sex = "male"; // Private Static Method function checkSex () {return (Sex = "male ");} // Private method this. _ getSex = function () {// call the Private Static Method if (checkSex () return "male"; else return "female" ;}// private method this. getFirstName = function () {return "Li" ;}; // Private method this. getLastName = function () {return "Ping" ;};}// public Method Man. prototype. getNickName = function () {return "Leepy" ;}; // public Method Man. prototype. getFullName = fu Nction () {return this. getFirstName () + "" + this. getLastName () ;}; // public Method Man. prototype. getSex = function () {// call the private method return this. _ getSex () ;}; // public static Method Man. say = function () {return "Happy new year! ";}

Does such a class look very similar to a traditional class?

2. Next, this article focuses on how to design an interface with Javascript, and then let the class inherit from it.

First, let's see how the traditional C # Language designs interfaces:

public interface Person{ string GetName(); void SetName(string name);}public class Man : Person{ private string _name; public string GetName() { return _name; } public void SetName(string name) { _name = name; }}

Attributes, methods, events, and types (structures) can be declared in the interface, but variables cannot be declared. However, the specific values of these Members cannot be set, that is, they can only be defined, you cannot assign values to what is defined in it, but interfaces are used as the conventions of its inherited classes or derived classes, the inherited class or its derived class can implement the interface attributes, methods, events, and types, because GetName (), SetName (), the call sequence of methods and attributes must be consistent;

With this interface-based idea, we also need to consider this specification when designing Javascript interface classes. Let me start with the main JS file Caller:

var Person = new Interface("Person", [["getName", 0], ["setName", 1]]);

The Interface class is the Interface class to be discussed later. The first parameter "Person" is the name of the Interface class, the second parameter is a two-dimensional array, and "getName" is the name of the Interface method, "0" indicates the number of parameters included in this method. Because Javascript is a weak language, the type is uncertain. Therefore, you only need to remember the number of parameters. "0" can be omitted without writing ), the same applies to "setName. This interface is well defined. How to use it?

function Man() { this.name = ""; Interface.registerImplements(this, Person);}Man.prototype.getName = function() { return this.name;};Man.prototype.setName = function(name) { this.name = name;};

The Man constructor contains

Interface. registerImplements (this, Person );

It is used to inherit the instantiated this object from the Person interface, and then inherit the class to implement the interface method.

The code looks clear and simple, so now we need to introduce the real core code Interface. js:

First look at the Interface constructor Section

Unction Interface (name, methods) {if (arguments. length! = 2) {throw new Error ("interface constructor includes" + arguments. length + "parameters, but two parameters are required. ");} this. name = name; this. methods = []; if (methods. length <1) {throw new Error ("the second parameter is an empty array. ");} for (var I = 0, len = methods. length; I <len; I ++) {if (typeof methods [I] [0]! = 'String') {throw new Error ("the first parameter of the interface constructor must be of the string type. ");} if (methods [I] [1] & typeof methods [I] [1]! = 'Number') {throw new Error ("the second parameter of the interface constructor must be of the integer type. ");} if (methods [I]. length = 1) {methods [I] [1] = 0;} this. methods. push (methods [I]) ;}};

Var Person = new Interface ("Person", [["getName", 0], ["setName", 1]);, save the two parameters respectively;