Analysis of JavaScript OOP functions, javascriptoop

Source: Internet
Author: User

Analysis of JavaScript OOP functions, javascriptoop
According to Brandon Eich, the founder of JavaScript, the best language structure of JavaScript is:

In my opinion, the most brilliant idea of JS is to break throughOOPThe limitation of the object, rather than the class, has become a first-class citizen (Eich's and 5 are the embodiment of this idea ).

C ++, Java, C #, and other languages are actually class-oriented. They emphasize type and do not support individual objects. They only have "commonalities" but not "individuality ". JavaScript, as a "Dynamic Language", naturally supports the dynamic creation of objects and the dynamic modification of objects.

Below is my supplement to Eich:

JavaScript object is a first-class citizen, and the function is the super-set of the object.

A function is a common object. It has a property or a "member function". The following code proves this:

FunctionFoo(X, y)

{

If (Foo. Xyz = undefined ){

Foo. Xyz = 0;

}

Else {

Foo. Xyz + = x + y;

}

Console. log ('Foo. Xyz: '+Foo. Xyz );

}

 

Foo(1, 2); // 0

Foo(1, 2); // 3

Foo(1, 2); // 6

 

The above function foo defines the propertyXyz, And the same as a general object.

 

The function can also have a "member function". The following code proves this:

FunctionFoo(X, y)

{

Var z = (x + y );

Console. log ('x + y = '+ z );

}

Foo. Bar = function () {console. log ('Hello, I am bar .')};

 

Foo(1, 2); // x + y = 3

Foo. Bar (); // Hello, I am bar.

 

But non-function objects cannot be used as functions. The following code does not work:

 

Var obj = {p1: 100 };

Obj ();

 

The conclusion is: a function is a common object, not a special citizen.()Operator. While() OperatorIs an attribute containing "executable string (executable literal.

 

Support for the class concept in JavaScript

 

As mentioned above, JavaScript truly improves the status of objects to a level-1 level, and expands and enriches our understanding of OOP.

However, class is indispensable or even crucial for any serious OOP project. This is the third article of Eich: prototype importance. During the consulting process, I often helped projects that do not like to use class and class inheritance properly, greatly reducing repeated code and improving program abstraction and maintainability.

 

JavaScript has no class. Microsoft TypeScript supports class, interface, and inheritance, both through functions and prototype. Prototype, together with an object of another citizen, is the golden key to implement class.

So what is prototype?Actually, it is nothing more than a function object.Named (Named)Attribute.This attribute is added to the language itself, not to programming. It is the "Commonality" of functions, and we know that class is the commonality of objects.

The following is an example to illustrate how to use functions (called constructor) and prototype to simulate class

FunctionMyClass(X, y)

{

This. prop1 = x;

This. prop2 = y;

}

MyClass.Prototype. GetProp1 = function () {console. log ('this. prop1: '+ this. prop1 );}

 

VarObj= {};//Line1: Manually create an object

MyClass. call (obj, 10, 20 );//Line2: Call constructor manually on obj1

Obj. constructor =MyClass;//Line3: Set MyClass as obj's constructor manually

CallMemberFunc (obj, 'getprop1 ');//Line4: 10(Simulating member function call)

 

VarObj2= {};//Line5: Manually create another object

MyClass. call (obj2, 30, 40 );//Line6: Call constructor manually on obj2

Obj2.constructor = MyClass ;//Line7: Set MyClass as obj's constructor manually

CallMemberFunc (obj2, 'getprop1 ');//Line8: 30(Simulating member function call)

 

Each function in JavaScript has a prototype attribute. In fact, this is just convenient. You can also create an attribute by yourself. The purpose of this attribute is to add attributes and functions to all objects using this function in a table similar to c ++ vtble. So how can we hook an object with this prototype? JavaScript provides eachTo beThe object of a Member in class has a new attribute:Constructor. Constructor is used as an ID to identify a specific class, and this constructor, of course, is notInitialized FunctionsNo!

All of this can be manually implemented using the existing language structure provided by JavaScript. The above example illustrates this.

Our goal is to createMyClassOfInstances:ObjAndObj2.MyClassIs a "Constructor", more specifically "initialization function ".

First, manually create obj (Line1), And then callMyClass(Line2) To initialize the new object, and thenConstructorAttributeSetMyClass(Line3In this way, the obj andMyClassOfPrototypeContact.

We created obj2 (Line5~Line7).

Do these two objects belong to the same class? Yes, there are two proofs:

A) obj. constructor = obj2.constructor is established to prove that they belong to the same constructor, that is, they belong to the same class.

B)CallMemberFuncCall any function with MyClass. prototype (Line4AndLine8)

So what is callMemberFunc? Is it universal? The answer is yes. below is my callMemberFunc definition, which can be used to call any function (some functions need to be enhanced, such as function parameter processing ).

 

// Call a member function for an object

Function callMemberFunc (obj, name ){

If (obj [name]! = Undefined ){

// Console. log ('getprop' + 'found '+ name + 'value :');

Return obj [name]. call (obj );

}

If (obj. constructor! = Undefined ){

// Console. log ('getprop' + 'found '+ name +' in constructor. prototype, value :');

Return obj.Constructor.Prototype[Name]. call (obj );

}

}

In short, JavaScript can implement the class-oriented program design through simple construction, so that the class function of OOP can be implemented. I am only partial implementation here, but it is consistent with the basic functions of the Code Compiled by JavaScript.

Syntax sugar of JavaScript also makes it easy to implement the above ideas:

 

Var obj3 =NewMyClass (40, 50 );//Line9: Use 'new' operator

Obj3.getProp1 ();//Line10: 40

 

JavaScript's new operator (Line9) To replace the above manual code (Line1~Line3), While callMemberFunc is simply called directly "(Line10.

Summary

JavaScript programming is a brand-new experience and extension of OOP. It brings objects to a lofty position. It is also a big unification of FP (functional programming) and OOP Based on OOP.

 

2014-9-1Seattle


In Web applications, what are the main functions of JavaScript?

Javascript is a Web-based client script technology.
The core idea of this technology is to increase the interaction between users and browsers and enhance the user experience when using web applications.
To put it bluntly, with javascript, many interactive operations can be performed on webpages. For example, if you enter a text box, you will be prompted for incorrect numbers or frequent webpage couplets. All are written in javascript.

What can javascript do?

Javascript was first invented to implement some cool functions on the client (browser). As a Form Verification script language, it saves the time to submit HTTP requests for data verification to the server (which was very precious in the past ).
However, javascript has changed a lot since now. The library has borrowed an old Chinese book about javascript, which is mostly a fancy and useless example, these greatly underestimate and deviate from what javascript can do.
What can javascript do?
A few years ago, Google launched a series of awesome Internet applications such as gmail and Google map, using javascript, A technology called Ajax is popular (of course, this is not Google's first, it was originally available, and it is Ajax implemented using iframe ). Now javascript has been re-examined and evolved into a popular programming language.
It is mainly used for web development. The main functions are some basic digital computing, string operations, very powerful regular expressions, Object-based programming, Ajax just mentioned, and the potential of javascript is revealed, developed a lot of awesome web applications.
Of course, due to the diversity of browsers, the sequelae of the browser war in the past, the javascript standards supported by browser vendors are different, some standards have been developed, such as ECMA and DOM.
Some famous javascript class libraries, jQuery, YUI, and MooTools emerged during this period. These libraries solve most browser compatibility problems and added some programming thought patterns, the programming efficiency is greatly improved, but javascript becomes easier to use.

Related Article

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.