Home > Developer > JavaScript

QWrap entry-apps fruit extension JS native class

Source: Internet
Author: User
Developer on Alibaba Coud: Build your first app with APIs, SDKs, and tutorials on the Alibaba Cloud. Read more ＞

Like a tree with many fruits, QWrap also has many apps"Extensions of JS native classes"Application, that is, apps/core_retouched.jshttp: // dev.qwrap.com/resource/js/#/core_retouched.js) application. This application extends native classes to facilitate user operations on native objects, such as String, Array, and Function.

Typical application scenarios of this application: jquery focuses on dom, so it lacks native object operations and module loading mechanisms. This library is exactly available and does not conflict with jquery.

As mentioned in previous articles, core/core_retouch.js is a retouch file.

The apps/core_retouched.js application described in this article is a composite file consisting of the following files:

 
 
    
  
  
  1. document.write('<script type="text/javascript" src="' + srcPath + 'core/core_base.js"><\/script>');  
    2. 
  
  
  2. document.write('<script type="text/javascript" src="' + srcPath + 'core/module.h.js"><\/script>');  
    3. 
  
  
  3. document.write('<script type="text/javascript" src="' + srcPath + 'core/browser.js"><\/script>');  
    4. 
  
  
  4. document.write('<script type="text/javascript" src="' + srcPath + 'core/string.h.js"><\/script>');  
    5. 
  
  
  5. document.write('<script type="text/javascript" src="' + srcPath + 'core/object.h.js"><\/script>');  
    6. 
  
  
  6. document.write('<script type="text/javascript" src="' + srcPath + 'core/array.h.js"><\/script>');  
    7. 
  
  
  7. document.write('<script type="text/javascript" src="' + srcPath + 'core/hashset.h.js"><\/script>');  
    8. 
  
  
  8. document.write('<script type="text/javascript" src="' + srcPath + 'core/date.h.js"><\/script>');  
    9. 
  
  
  9. document.write('<script type="text/javascript" src="' + srcPath + 'core/function.h.js"><\/script>');  
    10. 
  
  
  10. document.write('<script type="text/javascript" src="' + srcPath + 'core/class.h.js"><\/script>');  
    11. 
  
  
  11. document.write('<script type="text/javascript" src="' + srcPath + 'core/helper.h.js"><\/script>');  
    12. 
  
  
  12. document.write('<script type="text/javascript" src="' + srcPath + 'core/custevent.h.js"><\/script>');  
    13. 
  
  
  13. document.write('<script type="text/javascript" src="' + srcPath + 'core/custevent_retouch.js"><\/script>');  
    14. 
  
  
  14.  
    15. 
  
  
  15. document.write('<script type="text/javascript" src="' + srcPath + 'core/core_retouch.js"><\/script>'); 
    16.

In practice, if you want to use on-demand asynchronous loading, you also need to add a module configuration file. For details, see QWrap getting started apps.
When a composite file is released and launched, it is merged into multiple files, and the file name remains unchanged. Merged content: apps/core_retouched.combo.js

Here is an example of the jquery + core_retouched application.

 
 
    
  
  
  1. <HTML> <HEAD> <TITLE> QWrap --- FunctionH. mul </TITLE>
    2. 
  
  
  2. <META content = "text/html; charset = gb2312" http-equiv = Content-Type>
    3. 
  
  
  3. <Script src = "http://common.cnblogs.com/script/jquery.js" type = "text/javascript"> </script>
    4. 
  
  
  4. <Script src = "http://dev.qwrap.com/resource/js/apps/core_retouched.js" type = "text/javascript"> </script>
    5. 
  
  
  5. </HEAD>
    6. 
  
  
  6. <Body>
    7. 
  
  
  7. <Div id = "id1"> what is the date? </Div>
    8. 
  
  
  8. <Div id = "id2"> what is the time? </Div>
    9. 
  
  
  9. <Input type = button value = "show" onclick = "test ()"/>
    10. 
  
  
  10. </Body>
    11. 
  
  
  11. <Script type = "text/javascript">
    12. 
  
  
  12. Function test (){
    13. 
  
  
  13. Values ('regionid1'hangzhou.html ('date is '+ new Date (). format ());
    14. 
  
  
  14. Values ('regionid2'region.html ('date is '+ new Date (). format ('hh: mm: ss '));
    15. 
  
  
  15. }
    16. 
  
  
  16. </Script>
    17. 
  
  
  17. </HTML>
    18.

In the above example, we need to use a date format, but this jquery does not provide, because jquery focuses on dom and does not provide the date format intent.

Some users have used prototype. js framework, like "new Date (). format () "," str. trim () "is a prototype usage. when I switched to jquery later, I felt that many methods were missing.

QWrap's core_retouched application is precisely "extended JS native class", specifically providing such applications.

Okay. Let's take a look at the convenience provided by core_retouched:

String-related

S. byteLen () // get the byte length

S. camelize () // hump

S. contains (subStr) // determines whether a string contains another string

S. dbc2sbc () // returns the fullwidth to halfwidth.

S. decamelize () // anti-hump

S. decode4Html () // transcode html

S. encode4Html () // decodes html

S. encode4HtmlValue () // transcode for htmlValue

S. encode4Http () // transcode http

S. encode4Js () // transcode js

S. evalExp (opts) // eval an expression

S. evalJs (opts) // eval statement

S. format (arg0) // string formatting // a Common Function

S. mulReplace (arr) // multiple update

S. stripTags () // remove tag content

S. subByte (len, tail) // truncate by byte length // This is useful when intercepting strings at the front end. This method is not provided by all foreign frameworks.

S. tmpl (opts) // string template is a very practical function. Later jquery also added.

S. trim () // remove spaces at both ends

Array-related:

Array. toArray (arr) // converts an ArrayLike object to an Array object.

Arr. clear () // clear an array

Arr. contains (obj) // determines whether the array contains an object.

Arr. every (callback, pThis) // scale according to the standard

Arr. expand () // expands a deep array Layer

Arr. filter (callback, pThis) // scale according to the standard

Arr. forEach (callback, pThis) // scale according to the standard // many libraries provide similar functions, and QWrap provides basic compatibility with the standard

Arr. indexOf (obj, fromIdx) // scale according to Standard

Arr. lastIndexOf (obj, fromIdx) // scale according to Standard

Arr. map (callback, pThis) // scale according to the standard

Arr. reduce (callback, initial) // scale according to Standard

Arr. reduceRight (callback, initial) // scale according to Standard

Arr. remove (obj) // remove an element from the array

Arr. some (callback, pThis) // scale according to the standard

Arr. unique () // array element deduplication

Arr. union (arr2) // returns the union of arrays.

Arr. intersect (arr2) // returns the intersection of arrays.

Date-related

D. format (pattern) // format the date

Function-related

Function. bind (func, thisObj) // scale according to the standard

Function. methodize (func, attr) // method of static functions

Function. mul (func, opt) // Let the first parameter of the method be an array

Function. createInstance (class) // scale according to the standard

Function. extend (class, p) // class inheritance // The class inheritance implemented by each library varies widely. This implementation is provided by shadow and curiosity.

Object-related

Object. isArray (obj) // determines whether the Object is an array.

Object. isArrayLike (obj) // determines whether the Object is ArrayLike.

Object. isElement (obj) // determines whether the Object is an html element.

Object. isFunction (obj )//...

Object. isObject (obj )//...

Object. isPlainObject (obj )//...

Object. isString (obj )//...

Object. dump (obj, props) // specify the output attribute

Object. fromArray (obj, keys, values) // expand the Object by keys and values

Object. get (obj, prop, nullSensitive) // strong get // in some cases, you can use ObjectH. get (obj, 'a. b. c. d ') to replace obj. a & obj. a. B & obj. a. b. c & obj. a. b. c. d

Object. keys (obj) // get keys

Object. map (obj, fn, thisObj) // refer to the map of array to implement the Object map.

Object. mix (des, src, override) // mixin

Object. set (obj, prop, value) // strong set

Object. stringify (obj) // serialize // stringify depends on JSON. stringify, but the second parameter is not supported.

Object. values () // obtain values

I have selected several special features and added links. It may take two minutes to take a look. ---- Every one of them is meaningful, limited in length, and cannot be described in detail. You can view them on your own.

For more information about the specific functions, see the link above.

In addition, for the help file corresponding to apps/core_retouched.js, see the content under the node "JS native object extension" in the left-side directory tree of the Help file.

The size of apps/core_retouched.js compressed by YUI is 17 K. It can be used independently and securely.

Appendix: QWrap blog: http://www.qwrap.com

Original article: http://www.cnblogs.com/jkisjk/archive/2011/04/21/qwrap_apps_core_retouched.html

This article is an English version of an article which is originally in the Chinese language on aliyun.com and is provided for information purposes only. This website makes no representation or warranty of any kind, either expressed or implied, as to the accuracy, completeness ownership or reliability of the article or any translations thereof. If you have any concerns or complaints relating to the article, please send an email, providing a detailed description of the concern or complaint, to info-contact@alibabacloud.com. A staff member will contact you within 5 working days. Once verified, infringing content will be removed immediately.

Related Keywords:
node js abstract class node js error class class file extension cartoon fruit fruit vector fruit spl fetch fruit
Related Article
JavaScript solution to the eight Queens Problem method summar...
Http status code: 301, 302 redirection, 302 redirection
Ajax and 302 response code Testing

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.

What's Trending
Top 10 Tags
datastax versions naming convention zookeeper client class definition md5 microsoft sql server 2005 data structures exception handling error handling
Top 10 Keywords
microsoft download center down wordpress address url site address url wordpress address url windows installer 4 0 download 302 not found web address url definition site address url wordpress db2 integer mac os installation step by step pdf abbreviation for return

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

  • Sales Support

    1 on 1 presale consultation

    Chat Contact Sales

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

    Open a Ticket

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

    Learn More