Javascript object-oriented programming, javascript object-oriented

Javascript object-oriented programming, javascript object-oriented

Before learning js object-oriented programming, you must first know what object-oriented programming is. Object-oriented languages all have the concept of classes, through which you can create objects with the same attributes and methods. But js does not have the concept of classes, so the objects in js are different from those in other languages.

A js object can be defined as a set of No-need attributes. Its attributes can be basic values, objects, and functions. Each object is created based on a reference type.

There are two methods to create an object in js:

1. Create an Object instance:

var person = new Object();

2. Use the object literal:

 var person ={};

3. Factory model:

  function createPerson(name,age,job){      var p = new Object();     p.name=name;     p.age=age;     p.job=job;    return p;    }   var p1=createPerson("jack",22,“front-end Engineer");  var p2=.....;

4. constructor mode:

 function Person(name,age,job){     this.name=name;     this.age=age;    this.job=job;     this.sayName=function(){alert(this.name);};     }    var p1= new Person("jack",22,"front-end Engineer");   var p2=...;

Pause here, because the constructor mode is important. Here, we will explain the following four steps:

(1) create an object;

(2) Assign the constructor scope to this object (so this will point to this newly created object)

(3) execute the code and add attributes for the new object;

(4) return the new object;

Both p1 and p2 created above have a constructor attribute, which points to Person. In addition, p1 and p2 are Object instances even if they are Person instances, because all objects inherit from objects.

Defect: Every method must be re-created on the instance. Functions in js are objects, so you can transfer functions to the external part of the constructor:

 function Person(name,age,job){           this.name=name;          this.age=age;          this.job=job;          this.sayName=sayName;    }     fucntion sayName(){        alert("this.name");   }      var p1=.....;      var p2=....;

5. Original mode:

All functions we create have a prototype attribute, which is a pointer to an object.

JavaScript Object-Oriented Programming

With the concept of Ajax, JavaScript, as a powerful tool of Ajax, has played a soaring role. The most basic use of JavaScript, as well as syntax, browser objects, and so on are not cumbersome here. Focus on how to implement JavaScript object-oriented programming.

1. Use JavaScript to implement classes
JavaScritpt does not have a special mechanism to implement classes. Here we use its function to allow nesting mechanisms to implement classes. A function can contain variables and other functions. In this way, variables can be used as attributes and internal functions can be used as member methods. Therefore, the outer function itself can be used as a class. As follows:

Function myClass ()
{
// This is equivalent to the constructor.
} Here myClass is a class. In fact, we can regard it as a class constructor. The non-constructor section will be described in detail later.

2. How to obtain an instance of a class
When the class is implemented, you can obtain the instance of the class. JavaScript provides a method to obtain the object instance. That is, the new operator. In JavaScript, classes and functions are the same concept. When you use new to operate a function, an object is returned. As follows:
Var obj1 = new myClass ();
3. Reference of object members
There are three methods for referencing a class property or method in JavaScript.
1> point operator
This is the most common reference method and is not cumbersome. The format is as follows:
Object Name. attribute name;
Object Name. method name;
2> Square brackets
JavaScript allows square brackets to reference a member of an object. As follows:
Object Name ["attribute name"];
Object Name ["method name"]; here, square brackets are strings representing properties or method names, not necessarily string constants. You can also use variables. In this way, you can use the variable to pass the attribute or method name. It brings convenience to programming. In some cases, this method can be used when the Code cannot determine the property or method to call. Otherwise, if you use the dot operator, you also need to use the condition judgment to call the attribute or method.
In addition, attributes and method names referenced by square brackets can start with a number or contain spaces. The properties and method names referenced by point numbers follow the rules of the identifier. However, it is generally not recommended to use a non-identifier naming method.

3> Use eval Functions
If you do not want to use variables to pass variables or method names, and do not want to use conditional judgment, the eval function is a good choice. Eval receives a string-type parameter and runs the string as a code in the context to return the execution result. The eval function is used here. As follows:
Alert (eval ("Object Name." + element. value ));
4. Add, modify, and delete object attributes and Methods
In JavaScript, attributes and methods can be dynamically added, modified, and deleted for an object after an object is generated. This is different from other object-oriented languages.
1> Add attributes and Methods
Create an object first. After an empty object is created, there is no property or method. However, we can create it in code.
Var obj1 = new Object ();
// Add attributes
Obj1.ID = 1;
Obj1.Name = "johnson ";

// Add Method
Obj1.showMessage = function ()
{
Alert ("ID:" ...... remaining full text>

Question about javascript object-oriented programming?

It is hard to understand object-oriented programming from javascript.
Because javascript Functions are both functions and classes.
We do not recommend that you understand object-oriented as such.
The first section of your code is a class. The constructor has two parameters: html and high.

The second code is to add a method to the boxPlug class. Prototype is used to make the boxPlug Instance Object use the method.
It is recommended that you first understand object-oriented and then understand javascript object-oriented. Because javascript object-oriented is awkward.