OOP IN JS [Object-Oriented in JS Scripts]

zhaozj2021-02-16  43

Goal to easily implement JavaScript-oriented object-oriented

We will learn how to create classes and modules in JS.

Inherited by prototype.

Suppose there are two classes: "Animal" and "DOG", Dog inherits from Animal. Thenimal class is as follows:

// Constructor of animalvar animal = function () {

} // Eat method of animalanimal.prototype.eat = function (food) {// process the food here}

Create an instance and use it:

// Create An Animal ObjectMyanimal = New Animal (); // Let the Animal EatmyAnImal.eat ("Yummy Food");

Dog classes look very similar. We just notify DOG it is inherited in Animal:

// constructor for dogvar dog = function () {

} // "inheriting" from animaldog.prototype = new animal (); // resetting the constructor to dogdog.prototype.constructor = dog;

// bark method of dogdog.prototype.bark = function () {// make some noise}

Now let's create a DOG class, which has a Bark and EAT method:

// Create a new dog object var mydog = new dog (); // let it barkmydog.bark (); // throw it a bonemydog.eat ("yummy bone");

It can be seen that DOG inherits the "EAT" method of the Aninal class .let US Assume the dog neseds to first pre process the food (chew the bone) and then have it processed by the super class animal.we simply overwrite the "EAT" Method And Call The Super Class' "Eat" Method.

Dog.prototype.eat = function (food) {// preprocess the food here // call the super class' Eat method animal.prototype.eat.call (this, food);} Now We Have A Dog How CHews the Bone:

// Create a new Dog object var mydog = new dog (); // use EAT method mydog.eat ("yummy bone");

Let it be more simple .as you have noticed Above there is a lot of type involved in setting up a subclass:

Write a constructor to add its attributes or methods to overload its properties or methods in the new class of inheritance. Every Time The class is buy for prototyping it. But this may not be what we want.

Let us simplify this new class. Do the CAT class as follows:

// Extend a new class "cat" .var cat = Class ("cat", animal, function (thisclass, super) {// called when it should being instacted thisclass.prototype.init = function () { / / Here, Alert ("Cat.Prototype.init ()")} thisclass.prototype.eat = function (Food) {// How to digest food}}) This CAT class can be like other ordinary classes Used.

Class functionThe Class function: Design of a general class constructor inherited from the parent class; it's property className is set; a default toString method is created for convinience; and the classScope function is run with the class and the super class as parameters.When an object is created from the new class the init method is called with all parameters passed to the constructor.When a prototype for subclassing is created from a class, the init method is not called.This makes init act just like any other constructor function in JavaScript.

// Create a new class. The init method of cat shop not be called.var Greencat = Class ("Greencat", CAT, Function () {}); Alert ("Greencat created / ncat.prototype.init () WAS Not Called. "); // Create An Object of Greencatvar MyGreencat = New Greencat (); Alert (" MyGreencat CREATED. ");

Data Hiding If you take a closer look at the Cat above you notice, that there is a function being passed to Class.All variables declared with var withing this function are private to this function.We can now create a class which can use some semi Private Objects Only Visible To The Class Itself.

var SomeClass = Class ( "SomeClass", function (thisClass, Super) {// function only visible within this class var someFunction = function (x) {return 2 * x;} // a method which calls the "private" function thisClass .prototype.somemethod = function (arg) {Return SomeFunction (arg);}}) The following method is as follows: // create an Object of someclassvar obj = new someclass (); // Try the method the return value should be 6ustom (Obj . SomeMethod (3)) The same method can be used to create output classes and modules with subclasses, functions, and other method properties.

转载请注明原文地址:https://www.9cbs.com/read-26329.html

New Post(0)