JS Learning 19-day----combination mode

Source: Internet
Author: User

Combination Mode

Objective

I read the blog I wrote today.,typography can be so ugly?can you be a little more ugly??!I looked at the typesetting of my classmates.,It's called a beautiful.,I remember a verse.:good typography, well written.,Husband home early!I've been revising my typography these days.,If you have any comments ,,Welcome Manuscript!Thanks.

Body

Combination mode : Multiple objects are organized into a tree structure to represent the local and the whole , allowing the user to treat the same combination of objects and objects .

1. The collection of objects and the specific child objects within them can be handled in the same way . combining objects and objects that combine the objects enables the same batch of operations . pairs of combinations (Composite) The procedure that the object executes is passed down to all of the constituent objects , allows all constituent objects to perform the same action .

2. objects can be organized into a tree structure , and the entire tree can be traversed . all composite objects implement a method to get their child objects , This method allows you to hide the details of the implementation , Block child Objects , make the inner implementation of a child object non-dependent .

( say the concept is not the style of the Cock )

Think about every time you go to the barber shop for a haircut.,looks like every barber's going to trick you into a card.!!I've been fooled a couple of times.!!I don't want to hear them push me every time.!!tired of trying to make him die.!The barber can't talk to you about a discount on the card .,and they still have a branch .,Franchise Store,Honten,You can use a single card .,This is similar to the definition of a combinatorial pattern,combination Mode definition:group objects into a tree structure to represent"section-OverallThe hierarchy.combined mode allows users to have consistent use of individual objects and composite objects.

Just use the case of the card, say , a card can be used in the head office, branch, franchise store, The storefront hierarchy of this attribute structure is clear .

Then , head office consumption and store consumption is the same reason , the main store and the use of the membership card is also consistent ( hit the fold is the same ).

Don't forget,do you have a haircut ?,give youTenof Points, thepoints can be free of charge once,,so you cut your hair at the head office,whether it's the head office,Branch,Franchise Store,for your membership card, you know you've addedTenof Points,in the head office addedTenof Points,all the dots know that you've addedTenof Points,Integral general you know what??I think you should know what I mean.,I'm a little verbose.,just want you to know.

JsThe combination mode case in

The combination mode is also called part - The whole mode, which combines all the objects into a tree structure. This allows the user to perform the same operation on all members by simply manipulating the topmost interface.
One of the best examples of jquery objects is that 1 jquery objects are actually a set of objects.

In such an HTML page :

<div><span></span>   


We want to cancel the event that is bound on all nodes , and we need to write this :

var allnodes = document.getElementsByTagName ("*"); var len = Allnodes.length;while (len--) {  


Another example of a specific point, or dev.qplus.com the site's instant verification form.


Have you noticed the "Modify data" button below ? If someone takes a Field the validation did not pass , the button that modifies the data will be a state of gray not point . This means that after we re-fill in the form content , we have to verify each field, Make sure they're all OK.

This code is not difficult to implement

if (Namefield.validata () && idcard.validata () && email.validata () && phone.validata ()) {  Alert ("Verify OK");}


It seems that I can solve the problem with a visual pattern, but the problem is that we can't guarantee the number of field in the form , Maybe tomorrow the Product manager will let you delete one or two , or add one or two , then this maintenance method is obviously unreasonable .

A better implementation is a form.validata function that is responsible for distributing the true validata operations to each combined object .
the Form.validata function loops through all the field that needs to be verified . If there is a Field Checksum not passed , Form.validata will return false. The pseudo code is as follows :

Form.validata = function () {  ForEach (fields, function (index, field) {    if (field.validata () = = = False  ) {
   
    return false;    }  })  
   


Simply put , the combined pattern is to organize a batch of sub-objects into a tree structure , a top-level command in the operands of all the objects . increased modularity of the code , for a dynamic HTML the interface has a strong applicability .

A little bit of a summary

Is it still the smattering of the combination mode , unknown so ? It doesn't matter , Well, actually. , What about design patterns? , It doesn't matter what the code is. , no, it won't. , and don't remember the implementation code , It's not useful . , The main idea is to remember the theory and understand it.

Copyright NOTICE: This article for Bo Master original article, without Bo Master permission not reproduced.

JS Learning 19-day----combination mode

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.