javascript--Object-Oriented understanding

Source: Internet
Author: User

JS event-driven, object-based non-compiler language, so first look at the object creation problem.


The creation of objects in JS is not the same as the previously learned language using the Class keyword, divided into two categories, the general way to create and use the function keyword. The usual way is to create an object every time, if you want to create a similar object there will be a lot of similar code, which is incompatible with object-oriented, so the use of function is equivalent to using class to create a class, you can instantiate the object through the class.

An instance of a generic creation object

Use the new object () method var box=new object ();//Create an object, new can omit box.name= ' hyh ';//Add Property namebox.age=23;//Add Property agefunction Objrun () {//Use function to declare a method return ' 123 ';}; Box.run=objrun;  Add a method to an object
Use literal var box={  name: ' Hyh ',//Add Property  age:28  run:function () {  //use literal way to create method return ' 123 ';}        
the disadvantage of creating objects is that we've already said so.using the Function keyword (equivalent to creating a class)
Use Factory mode function CreateObject (name,age) {var obj=new object ();//Create object with new object obj.name=name;//add attribute, value is the argument obj.age =age;obj.run=function () {//Add method return this.name+this.age//method returns the name and age};return obj;} var box1=createobject (' Yung ', 100);//Use

A class is created using a factory model, and an object can be instantiated directly from a parameter. Cons: Unrecognized object of which class was instantiated, as follows:

Alert (typeof Box1),//object, only know that Box1 is an object alert (Box1 instanceof object);//true, only the instance of object, because it is used in the schema is the new object () -party-created objects
to solve this problem, use the constructor method

function Box (name,age) {  this.arry=[];//create array this.name=name;this.age=age;this.run=function () {return this.name+ This.age};} var box1=new Box (' Yung ', 100); Use  must have Newalert (box1 instanceof box);//true, very clear identification box1 is an example of box

compared to the factory model
1, do not need to use the new Object (), the background automatically
2, no return, back automatically back
3, where this represents the creation of the "class"
Note: When you create using a constructor, you use the prototype (prototype), the properties and methods that are added with prototype all instantiated objects are shared, for example
function Box () {}; box.prototype={//use the literal way to add the prototype, you can also add Name: ' Yung ', age:100,family:[' sister ', ' brother ', ' sister '],run:function () {return this.name+this.age+this.family;}} var box1=new box ();//The value is set in the prototype when instantiated, can not be sent to the alert (box1.family); Box1.family.push (' elder brother ');//add element to Box1 ' Brother ', is essentially added to the prototype, the object later instantiated will contain the element alert (box1.family), var box2=new box (),//due to the sharing of the prototype, resulting in Box2 family also added the element ' elder brother ' alert ( box2.family);
The above code we can understand through a picture


Summary
JS is an object-based non-compiled language, the creation of objects and previously learned language is not the same, but the summary will be found only the form of changes, the principle is not changed, a lot of points can and the original knowledge on, JS feel more fragmented but with the original knowledge of the relationship will be better after, So a lot of summing up also to combine the following blog instance a lot of practice re-understanding.


javascript--Object-Oriented understanding

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.