JavaScript daily must learn the encapsulation _javascript skill

Source: Internet
Author: User
Tags function prototype

Good friends, we've already explained the basics of JavaScript, starting with today's content, and we're going to start talking about encapsulation, and here we have 1.1-point access to OOP (object-oriented programming), and if programmers used as a language don't even know what OOP is, Or just heard that they did not understand, can not write object-oriented code, then there is no need to learn the program, I will give you a detailed introduction to the object is what, the process is what, to understand the object-oriented, first of all we must know the process-oriented. After you've figured out the process, we can't be blindly oop for OOP, it's just a futile thing to do, because most of the time we write code just to solve a small thing, then we don't have to write oop, just write some process-oriented code, Use a word to describe "local conditions".

Let's start with the process of orientation, first to explain what the process means, we usually say "program" two words in fact the process, the implementation of a program, that is, the implementation of a process, such as: work, is a program, the process is, 9 o'clock on time to the company, do some of their own should be done, 6 o'clock in the afternoon no matter what to do, the process of work is done, leave the company, this is the process; a more specific example, the withdrawal, the implementation of the process we will write a little more clearly:

1, take the bank card to ATM

2. Insert Bank card

3, enter the password

4, the number of input withdrawals

5. ATM Bills

6. Put the money in your pocket

6, if found not to take the number of their own, return to step 4th

7, if you want to print receipts, click on the Print receipt form, if not printing, omit this step

8. Refund Card

9. The procedure is finished

From the steps above we can see that from the first to the last step, this is the order of execution, the 4th to 6th step is a circular process, the 7th step is a branching process, this is the process, that is, the program. The purpose of our code is to simulate some behavioral processes, using the computer's high-speed computing features to serve our lives.

We can encapsulate the withdrawals into a function so that this is a separate process, and we can call this function when we need it, we can do our job, and we'll use one of the simplest examples to express the simplest procedure.

function Kisswife (whosewife) {
 console.log (whosewife+ "face Over");
 Console.log ("I put my lips up");
 Console.log ("Wood, a Sound");
 Console.log ("Pro" +whosewife+ "one time Complete");
}

Kisswife ("my Wife");


Look at the picture and talk, at the right time, we call the Kisswife function, enter the appropriate parameters, we run through a process.

  OOP's goal is to improve code reuse rate , with minimal code to do as much as possible, using parameters, is also an embodiment of object-oriented programming, we have to give a counter example, if we do not use parameters in the case, we want to kiss someone's wife, To write a kisswife function, so that we write a large number of duplicate code, inconvenient code management, a lot of inconvenience, the method is not Shunliu, even in the kiss other wives when the chance of being found greatly increased, brought some unnecessary trouble.

At this time some students want to ask, I think, I think I am not accustomed to using parameters, is not want to pass parameters, code management where there will be inconvenient management? Well, this question is quite in place.

Let me explain, if, in the course of this process, we find that there are unreasonable places, need to modify, for example, I also want to stretch a tongue what, we need to kiss our wife's function to modify (trouble), but also in the kiss the wife's function to modify (trouble + 1), when we have many similar functions, is not to make all the changes (trouble +n); The second disadvantage is that the number of changes, you can guarantee that all changes will not be a one-time error (easy to mistake), this can reflect, if we just write a number of repetitive code, the efficiency of a big discount.

Through the above explanation, the novice reader still failed to understand what is OOP (object-oriented programming), we are now starting from the object to explain, the object here, can not be simply understood as a relationship between the men and women friends, the object refers to everything in the world, the Sun, the sea, people, pets ... Every thing we can want, each object has its own attributes, behavior.

We can understand as shown above, bird is an object, it has its own properties, have their own behavior, the following we use concrete code to encapsulate a class about birds. (Note: In the JavaScript language function keyword is used only to define functions, you can also define a class, it does not use the class keyword like a high-level language, and later, when we speak of inheritance, we also use special methods to implement inheritance)

Declare a bird
function Bird () {
 this.name = "pigeon";
 This.color = "Gray";
 This.habitat = "cage";
 This.weight = "500 grams";
}

Using a prototype chain to define a row for a bird, or to define a property, however, attributes generally use the This keyword to declare
//behavior and attributes, in fact, at the same level, after which we use for to validate

//tweet
Bird.prototype.Sing = function () {
 console.log ("Goo-cuckoo");
}
Eating
Bird.prototype.Eat = function () {
 console.log ("Eat a grain of corn");
}
Flying
Bird.prototype.Fly = function () {
 Console.log ("Flying in the Sky");
}
Hatching eggs
Bird.prototype.Brood = function () {
 cossole.log ("Hatching pigeon Eggs");
}

Now our class has been declared well, but how do we use it? Now it is just a class, is not an example, is that I speak of pigeons, examples, is a specific pigeon, how to get a specific pigeon? Look at the code below.

Use the new keyword to get an instance of
var gezi = new Bird ();

Now we can call its properties, as well as the method of

In this way, every pigeon we get is the same, how do we get pigeons with their own characteristics? have their own unique characteristics, in fact, the attributes are not the same, then we will change the function of the Declaration

In fact, we just need to modify the
function Bird (_color,_habitat,_weight) {
 this.name = "pigeon" in a small way here;
 This.color = _color;
 This.habitat = _habitat;
 This.weight = _weight;
}

And then we'll take a look at how to instantiate a pigeon.

We have now instantiated two pigeons
var gezi_a = new Bird ("White", "Wild", "300 grams");
var gezi_b = new Bird ("gray-white", "Greenhouse", "550 grams");

In this way, we can construct the pigeon that has its own characteristic to come out, from the above example, we are in fact not difficult to see, encapsulation, in fact, we can describe the object of the class to express, we can use the New keyword to instantiate the object, the object has its own independent properties, behavior, such an object, We can make it easy for us to operate, encapsulation is a way to embody oop, we first encapsulate a class, then, and then the new instance, which is written more than we use the code to construct two pigeon class less code, if we also construct the 3rd Pigeon, and then new one, we can construct the object , it feels like a code thing. To improve the reuse rate of code, OOP is reflected in this.

At this point, someone asked, just to say that we use the benefits of OOP, not to see how to write OOP code in the end, then there is a way of not OOP, the same as the case of pigeons

Declares a pigeon
function Gezi_c () {
 console.log ("Kind of Pigeon");
 Console.log ("Color is Blue");
 Console.log ("Live on the Treetops");
 Console.log ("400 grams of weight");
 Console.log ("Flying in the Sky");
}
Perform a
gezi_c ();

If we're going to say 100 pigeons again, it's going to be a lot of repetition of code like the one above, and that's the process-oriented code. Believe that novice friends have a vague concept of oop it, slowly realize that this feeling can be understood in two days, eat not big fat, we will continue to talk about the inheritance and polymorphism of OOP thought.

To continue the previous declaration of the bird class, the attribute and behavior are the same level, and can be declared in two ways, the attribute in the constructor with the This keyword declaration, the behavior function is declared with the prototype keyword, prototype is the standard extension of the function prototype chain, The reason we write this is to put the use of JavaScript language into the realm of high-level languages, to simulate the use of advanced languages, and we'll start by verifying that bird instance objects have properties and behavior functions at the same level.

We are now using the front of the Bird class
var obj = new Bird () with no parameters;

Print them out for
(Var pro in obj) {
  console.log (pro + ": + Obj[pro]);
}

See, for...in is used to loop through the object's properties and array of subscript, the name of the behavior function is also the object of the attribute, now verify the previous statement, I believe that we now have a certain understanding of the concept of OOP packaging.

To sum up, what we are talking about today is actually to the abstraction of things, and then, the behavior of these attributes encapsulated into a class, using the new keyword to instantiate a specific object, so that greatly improve the use of code, improve the efficiency.

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.