JS is an object-oriented language, all objects
First, what is object-oriented?
Simple, let's just say it. There are some things in life, such as (Haha, think of an iphone, for example), and we don't know how it works? But we will press the button, with a couple of days will be used, oh my God, do not know the principle will be used, good.
Then the Javascrip method in the Date object all know, this brother has a son (the daughter can also do, you say what is what) GetMonth method, then you know how it knows what month it is now? I don't know. I'll take care of him, but me.
In fact, we do not need to know the principle can use its function, is object-oriented.
In fact, the object is a whole, providing some functions and operations externally, and you do not know how it operates inside. In programming we call object-oriented, and in life, but not the same.
In programming, just like jQuery, you know how it's $ (' div ') to get the DOM object, don't know. (' I know ', ' Go aside, you're looking at the source. You're breaking the machine, you don't know? As long as you know what it does, is he an object-oriented programmer?
Second, the object-oriented characteristics
1, Abstract: suction refers to the core of the things out, and we have to solve the problem related to the things put out in front of
2, encapsulation: Let the people who use the object do not consider the internal implementation, only consider the use of the function to protect the internal code, only set aside some API interface for users to use
3, inheritance: Just for the reuse of code, from the parent class inherited some methods and properties, subclasses also have some of their own properties
4, polymorphic: In fact, different objects have different effects with the same operation. Polymorphic thinking is actually the "what to Do" and "who to do" separate
Third, the composition of the object
1. Method function: Process, dynamic
2. Attribute variables: state, static
Iv. This current method belongs to who is who
For example, clicking on this in the event is actually the one in the OnClick method of the DOM object that triggered the event, which is, of course, someone else's own.
Another example of this in a function, this function is a method of window, of course, this is also window
And oh, don't add properties and methods on the system object, that's not good.
So who does it add to? In object, other date Ah array Ah, these objects are some fun features,
Object is also the most powerful of its own function is, no function ~ ~ ~ ~ ~ ~ so we can give him to add properties and methods without having to think about whether to overwrite
V. Ways to create objects
1, the most basic
1 var New Object () 2 obj.name = ' Shizhikai '3 obj.age = ' 3 year old '4function() {5 Console.log ( this//This is who?) You know? obj 6 }
But this is too much trouble, I have to write 100 people, that has to write 100 times. Is there any other way? Yes
2, the factory way through the constructor function
functionCreateperson (name,age) {//Raw Materials varobj=NewObject (); //processingObj.name=name; Obj.age=Age ; Obj.showage=function() {alert ( This. Age)} //Factory returnobj;}varObj1=createperson ("Shizhikai", ' 3 years old ')varObj2=createperson ("Ni", ' 18 years old '); alert (obj1.showname)//function () {alert (this.name)}Alert (Obj2.showname)//function () {alert (this.name)}
The results are all the same, but compare:
1 // false
It's not the same here!! In that case, I have 100 objects that have 100 different ways to occupy the inside charge ~ ~ ~
There are two kinds of problems:1. the creation of the object does not use the new feeling heart empty 2. Methods are different words too Occupy space ~ ~ ~
then solve it.
1 functionCreateperson (name,age) {2 //The raw material system is sneaky.3 //var this=new Object ();4 //processing5 This. name=name;6 This. age=Age ;7 This. showname=function() {8Alert This. Name)9 }Ten //Factory system sneaking around. One //return this; A } - - varobj1=NewCreateperson ("Shizhikai", ' 3 years old ') the varObj2=NewCreateperson ("Ni", ' 18 years old ');
So the code is a lot less, very cool, and there is new , in fact, the use of a concept, any function can be new
Such as
function AA () {}console.log (new AA ()) // Object
Then it becomes the object, then it is the new out of its own ~ ~ ~ ~
But there is still a problem,
// false
It also takes up memory
Then continue to solve
It's going to be something you have to say in object-oriented, and it's important . . Prototype prototype ~ ~ ~
Six, . Prototype
Let's start with an example. , for example, there are two bears, bear, Kumaji to steal the same apple tree honey Nest, The bear stole the Bear two see Bear big Apple will quit, To find the apple tree theory, why he
have I not, this is not reasonable, after all Big Bear The Apple was taken by itself. Kumaji of course not, but if you say The nest of Honey is built on top of apples. words, so Big Bear you don't have to get the apples, just the whole nest, hahaha. Both Bears have, and everyone is happy.
1 var xiong1=[1,2,3];2 varxiong2=[4,5,6];
3xiong1.sum=function(){
4 varResult=0;5 for(vari=0;i< This. length;i++){6result+= This[i]7 }8 returnresult;9 }TenAlert (Xiong1.sum ())//6
OneAlert (Xiong2.sum ())//Error
Just like this example, Xiong2 There is no such method, if you want, you can only add it, and then write it again
1 xiong2.sum=function() {2 var result=0; 3 for (var i=0;i<this. length;i++) {4 result+=this[ I]5 }6 return result; 7 }
This is still trouble, the memory
1 varxiong1=[1,2,3];2 varxiong2=[4,5,6];3array.prototype.sum=function(){4 varResult=0;5 for(vari=0;i< This. length;i++){6result+= This[i]7 }8 returnresult;9 }Ten OneAlert (Xiong1.sum ())//6 AAlert (Xiong2.sum ())// the - - the functionCreateperson (name,age) { - This. name=name; - This. age=Age ; - } +Createperson.prototype.showage=function(){ - This. showage=function() { +Console.log ( This. Age) A } at}
Then the last knowledge point of the two problems can be solved Oh ~ ~ ~
So it's going to be a wide-ranging one.
Use the constructor to write your own properties and methods, use the prototype to write the common properties and methods, this way is called mixed mode
So, object-oriented? No, I'll see you in the next section. I went to dinner .....
What is JavaScript object-oriented? A