JavaScript's object-oriented Programming Basics _ Basics

Source: Internet
Author: User
Tags inheritance

Re-understanding of object-oriented
in order to illustrate that JavaScript is a thorough object-oriented language, it is necessary to start from the object-oriented concept to explore some of the object-oriented concepts:

    1. All things are objects
    2. object has encapsulation and inheritance attributes
    3. Message communication is used between objects and objects, and there is information hiding

Based on these three points, C + + is a half object-oriented process language because, although he implements the encapsulation, inheritance and polymorphism of the class, there are global functions and variables of a non object nature. Java, C # is a complete object-oriented language that organizes functions and variables in the form of classes so that they cannot be detached from objects. But here the function itself is a process, just attached to a class.

However, object-oriented is just a concept or programming idea, it should not rely on the existence of a language. For example, Java uses object-oriented thinking to construct its language, it implements the mechanism of class, inheritance, derivation, polymorphism, interface and so on. But these mechanisms are just a means of implementing object-oriented programming, not necessarily. In other words, a language can choose the right way to implement the object-oriented according to its own characteristics. So, since most programmers first learn or use advanced compiled languages such as Java and C + + (Java is generally interpreted as a compiler), they have a preconceived acceptance of the object-oriented implementation of "class", so that when learning a scripting language, The concept of object-oriented language is used to judge whether the language is an object-oriented language, or whether it has object-oriented characteristics. This is also one of the important reasons that prevents programmers from learning and mastering JavaScript in depth.
In fact, the JavaScript language implements object-oriented programming in a way called a prototype (prototype). The following is a discussion of the differences in the way in which the object-oriented (class-based) object-oriented and prototype (prototype-based) object-oriented approach constructs the objective world.
Object-oriented and prototype-based object-oriented comparison of class-oriented objects
In a class-oriented object-oriented approach, objects (object) depend on classes (class) to produce them. In a prototype-oriented object-oriented approach, objects (object) are constructed from the use of prototypes (prototype) by constructors (constructor). Give an example of an objective world to illustrate the differences in cognition in two different ways. For example, a factory building a car, on the one hand, workers must refer to a project drawing, design to specify how the car should be made. Engineering drawings Here are like classes in a language, and cars are made by this class (class), while workers and machines (equivalent to constructor) use a variety of components such as engines, tires, and steering wheels (equivalent to prototype properties) Build the car out.
There is, in fact, a debate as to who has expressed the object-oriented idea more thoroughly in both ways. But the author thinks that the prototype object oriented is a more thorough object-oriented way, the reasons are as follows:
First of all, the object in the objective world is the result of the construction of other objects, and abstract "drawings" can not produce a "car", that is, the class is an abstract concept rather than an entity, and the production of objects is an entity;
Secondly, according to the most basic object-oriented principle of everything, class is not an object in itself, but the constructor (constructor) and prototype (prototype) in the archetypal way are itself the objects constructed by other objects in a prototype way.
Again, in class-oriented object-oriented languages, the state of an object is held by an object instance (instance), and the object's behavior methods (method) are held by the class that declares the object, and only the structure and methods of the object can be inherited, and in the archetypal object-oriented language, the object's behavior, The state belongs to the object itself and can be inherited together (reference resources), which is also closer to the objective reality.
Finally, class object-oriented languages such as Java, to make up for the inconvenience of not using global functions and variables in a process-oriented language, allow the declaration of static (static) and static methods in the class. In fact, the objective world does not exist the so-called static concept, because all things are objects! In the prototype object-oriented language, in addition to the built-in object (Build-in object), the existence of global objects, methods or attributes is not allowed, and there is no static concept. All language elements (primitive) must be dependent on the existence of an object. However, due to the features of functional language, the object on which language elements are dependent varies with the context of the runtime (runtime), which is embodied in the change of this pointer. It is this characteristic that is closer to the natural view that all things have their own, that the universe is the root of all living things.


JavaScript Object-oriented Basics

Although JavaScript itself is not a class concept, it still has object-oriented features, although it differs from the generally common object-oriented language.

The simple way to create an object is as follows:

function MyObject () {

};

There are generally two ways to create objects in JavaScript: The functional constructor and the literal method, which is the functional constructor above. The following is an example of a literal method:

var myObject = {

};

The literal method is recommended if only one object is needed, and no other instance of the object is needed. If multiple instances of an object are required, the function constructor is recommended.
Defining Properties and methods

Function Construction Method:

function MyObject () {
 This.iam = ' an object ';

 This.whatami = function () {
 console.log (' I am ' + this.iam);
 };};


Literal method:

var myObject = {
 iAm: ' An object ',

 whatami:function () {
 console.log (' I am ' + this.iam);
 }
;

Both of these methods create an attribute named "IAm", and a method named "Whatami". A property is a variable in an object, and a method is a function in an object.

How to get properties and Invoke methods:

var w = Myobject.iam;

Myobject.whatami ();

When calling a method, be sure to include parentheses, if not parentheses, it is simply a reference to the return method.
The difference between two ways to create objects

    • When you define properties and methods within a function constructor, you use the prefix this, which is not required by literal method.
    • The function constructs the method to assign the value to the attribute and the method time uses =, the literal method uses is:.
    • If there are more than one property or method, the function constructs the method to use; To use, separate, or divide by means of a literal method.

For objects created by the literal method, you can invoke their properties or methods directly with the object's reference:

Myobject.whatami ();

For functional constructs, you need to create an instance of an object to invoke its properties or methods:

var mynewobject = new MyObject ();
Mynewobject.whatami ();

Using constructors

Now let's go back to the previous function construction method:

function MyObject () {
 This.iam = ' an object ';
 This.whatami = function () {
 console.log (' I am ' + this.iam);
 };};


In fact, it seems to be a function, since it is a function, can give it pass parameters? Modify the code slightly:

function MyObject (what) {
 This.iam = what;
 This.whatami = function (language) {
 console.log (' I am ' + this.iam + ' the ' + language + ' language ');
};

Then instantiate the object and pass in the parameter:

var mynewobject = new MyObject (' an object ');
Mynewobject.whatami (' JavaScript ');

Program final output I am an object of the JavaScript language.
Two ways to create an object, which one should I use?

For a literal method, because it does not need to be instantiated, if you modify the value of an object, the value of the object is permanently modified, and any other places that are accessed are the modified values. As for the function construction method, modifying the value is to modify the value of its instance, it can instantiate N objects, each object can have its own different values, and do not interfere with each other. Compare the following sections of code.

First look at the literal method:

var myobjectliteral = {
 MyProperty: ' This is a property '
};

Console.log (Myobjectliteral.myproperty); Log ' is a '

Myobjectliteral.myproperty = ' This is a new property ';

Console.log (Myobjectliteral.myproperty); Log ' is a new '

Even if you create a new variable to point to this object, the result is the same:

var myobjectliteral = {
 MyProperty: ' This is a property '
};

Console.log (Myobjectliteral.myproperty); Log ' is a '

var sameobject = myobjectliteral;

Myobjectliteral.myproperty = ' This are a new property ';

Console.log (Sameobject.myproperty); Log ' is a new '

Then look at the function construction method:


var myobjectconstructor = function () {
   This.myproperty = ' This was a property '} with functional construction method
;

Instantiate an object
var constructorone = new Myobjectconstructor ();

Instantiate the second object
var constructortwo = new Myobjectconstructor ();

Output
Console.log (constructorone.myproperty);//log ' is a property '//

output
console.log ( Constructortwo.myproperty); Log '

is a property ' as expected, the attribute values for two objects are the same. What if you fix a value for one of these objects?

//
myobjectconstructor = function () {
 This.myproperty = ' This was a property ';

Instantiate an object
var constructorone = new Myobjectconstructor ();

Modify the object's properties
Constructorone.myproperty = ' This is a new property ';

Instantiate the second object
var constructortwo = new Myobjectconstructor ();

Output
alert (constructorone.myproperty);//log ' this are a new property '/

output
alert ( Constructortwo.myproperty); Log ' is a '

It can be seen that the different objects that have been instantiated with the function construction method are independent and can each have different values. So, what kind of method to use to create objects, depends on the actual situation.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.