zoukankan      html  css  js  c++  java
  • QWrap简介之:apps果实篇之:扩展JS原生类

    就像是一棵树有很多果实一样,QWrap也有很多apps,本文讲解"扩展JS原生类"的应用,即apps/core_retouched.js应用。
    本应用会对原生类进行扩展,方便用户操作原生对象,例如:String、Array、Function等。
    本应用的典型应用场景:jquery专注于dom,所以欠缺原生对象的操作,以及模块加载机制等。本库恰好能提供,并且与jquery无冲突存在。

    前面已有文章讲过core/core_retouch.js,它是一个retouch文件。
    而本文讲的apps/core_retouched.js应用,它是一个复合文件,它由以下文件组成:
    View Code
    document.write('<script type="text/javascript" src="' + srcPath + 'core/core_base.js"><\/script>');
    document.write(
    '<script type="text/javascript" src="' + srcPath + 'core/module.h.js"><\/script>');
    document.write(
    '<script type="text/javascript" src="' + srcPath + 'core/browser.js"><\/script>');
    document.write(
    '<script type="text/javascript" src="' + srcPath + 'core/string.h.js"><\/script>');
    document.write(
    '<script type="text/javascript" src="' + srcPath + 'core/object.h.js"><\/script>');
    document.write(
    '<script type="text/javascript" src="' + srcPath + 'core/array.h.js"><\/script>');
    document.write(
    '<script type="text/javascript" src="' + srcPath + 'core/hashset.h.js"><\/script>');
    document.write(
    '<script type="text/javascript" src="' + srcPath + 'core/date.h.js"><\/script>');
    document.write(
    '<script type="text/javascript" src="' + srcPath + 'core/function.h.js"><\/script>');
    document.write(
    '<script type="text/javascript" src="' + srcPath + 'core/class.h.js"><\/script>');
    document.write(
    '<script type="text/javascript" src="' + srcPath + 'core/helper.h.js"><\/script>');
    document.write(
    '<script type="text/javascript" src="' + srcPath + 'core/custevent.h.js"><\/script>');
    document.write(
    '<script type="text/javascript" src="' + srcPath + 'core/custevent_retouch.js"><\/script>');

    document.write(
    '<script type="text/javascript" src="' + srcPath + 'core/core_retouch.js"><\/script>');

    在实际中,如果要用到按需异步加载,还需要再加上一个模块配置文件(详情参见《QWrap简介之:apps果实篇之:种子》),
    复合文件在发布上线时会将分文件合并成起来,名件名还是不变。合并后的内容为:apps/core_retouched.combo.js

    我们以这一个例子来看jquery + core_retouched的应用。
    View Code
    <HTML><HEAD><TITLE>QWrap---FunctionH.mul</TITLE>
    <META content="text/html; charset=gb2312" http-equiv=Content-Type>
    <script src="http://common.cnblogs.com/script/jquery.js" type="text/javascript"></script>
    <script src="http://dev.qwrap.com/resource/js/apps/core_retouched.js" type="text/javascript"></script>
    </HEAD>
    <body>
    <div id="id1">日期是?</div>
    <div id="id2">时间是?</div>
    <input type=button value="显示" onclick="test()"/>
    </body>
    <script type="text/javascript">
    function test(){
    $(
    '#id1').html('日期是'+new Date().format());
    $(
    '#id2').html('日期是'+new Date().format('hh:mm:ss'));
    }
    </script>
    </HTML>


    上面的例子中,我们需要用到一个日期的格式化,但是这个jquery不会提供,因为jquery专注于dom,没有提供日期格式化的意图。
    而有的同学使用过prototype.js框架,已经习惯了类似于“new Date().format()”、“str.trim()”这样的原型用法,后来转而使用jquery时,就觉得少了很多方法。
    而QWrap的core_retouched应用,恰恰是"扩展JS原生类",专门就是提供这类应用的。

    好的,我们看一下,core_retouched提供了哪些便利:

    字符串相关
        s.byteLen()    //获取字节长度
        s.camelize()    //驼峰化
        s.contains(subStr)    //判断一个字符串是否包含另一个字符串
        s.dbc2sbc()    //全角转半角
        s.decamelize()    //反驼峰化
        s.decode4Html()    //为html作转码
        s.encode4Html()    //为html作解码
        s.encode4HtmlValue()    //为htmlValue作转码
        s.encode4Http()    //为http作转码
        s.encode4Js()    //为js作转码
        s.evalExp(opts)    //eval一个表达式
        s.evalJs(opts)    //eval语句
        s.format(arg0)    //字符串格式化 //一个常用的功能
        s.mulReplace(arr)    //多重update
        s.stripTags()    //去除tag内容
        s.subByte(len, tail)    //按字节长度截取 //这个在前端截取字符串时很有用,所有的洋框架都没提供这个方法。
        s.tmpl(opts)    //字符串模板 //字符串模板是一个很实用的功能,后来jquery也加上了。
        s.trim()    //去两端空格

    数组相关
        Array.toArray(arr) //将一个ArrayLike对象转化成Array对象
        arr.clear()    //清空一个数组
        arr.contains(obj)    //判断数组中是否包含某对象
        arr.every(callback, pThis)    //按标准扩展
        arr.expand()    //将一个深层数组展开一层
        arr.filter(callback, pThis)    //按标准扩展
        arr.forEach(callback, pThis)    //按标准扩展 //有不少库都提供类似的功能,QWrap提供的与标准基本兼容
        arr.indexOf(obj, fromIdx)    //按标准扩展
        arr.lastIndexOf(obj, fromIdx)    //按标准扩展
        arr.map(callback, pThis)    //按标准扩展
        arr.reduce(callback, initial)    //按标准扩展
        arr.reduceRight(callback, initial)    //按标准扩展
        arr.remove(obj)    //从数组中移除某元素
        arr.some(callback, pThis)    //按标准扩展
        arr.unique()    //数组元素除重
        arr.union(arr2)    //数组求并集
        arr.intersect(arr2)    //数组求交集

    日期相关
        d.format(pattern)    //日期格式化

    函数相关
        Function.bind(func, thisObj)    //按标准扩展
        Function.methodize(func, attr)    //静态函数方法化
        Function.mul(func, opt)    //让方法的第一个参数可以是数组
        Function.createInstance(class)    //按标准扩展
        Function.extend(class, p)    //类继承   //各个库实现的类继承千差万别,本实现由月影与好奇提供。

    对象相关
        Object.isArray(obj)    //判断对象是否是数组
        Object.isArrayLike(obj)    //判断对象是否是ArrayLike
        Object.isElement(obj)    //判断对象是否是html元素
        Object.isFunction(obj)    //。。。
        Object.isObject(obj)    //。。。
        Object.isPlainObject(obj)    //。。。
        Object.isString(obj)    //。。。
        Object.dump(obj, props)    //输出指定属性
        Object.fromArray(obj, keys, values)    //按keys与values来扩充对象
        Object.get(obj, prop, nullSensitive)    //强get //某些情况下,可以用ObjectH.get(obj,'a.b.c.d')来代替obj.a && obj.a.b && obj.a.b.c && obj.a.b.c.d
        Object.keys(obj)    //获取keys
        Object.map(obj, fn, thisObj)    //参考array的map,实现Object的map
        Object.mix(des, src, override)    //mixin
        Object.set(obj, prop, value)    //强set
        Object.stringify(obj)    //序列化 //stringify向JSON.stringify靠齐,不过不支持第二个参数
        Object.values()    //获取values

    上面选了几个有点特色的功能加上了链接,不妨花两分钟时间看一眼。----每一个都很有意义,篇幅有限,无法详细介绍,可以自行围观。
    具体的功能,参见上面的链接,这里不用一一赘述。

    另,与apps/core_retouched.js对应的帮助文件,参见有啊版帮助文件中左侧目录树的"JS原生对象扩展"这个节点下的内容。
    apps/core_retouched.js经YUI压缩后大小为17K。可以独立放心使用。
    附:QWrap博客地址:http://www.qwrap.com


  • 相关阅读:
    社保系列10《返回值速查表》
    社保系列7《PSAM卡》
    EMVTag系列11《电子现金发卡行授权码》
    EMVTag系列10《发卡行公钥证书》
    EMVTag系列8《IC卡公钥证书》
    EMVTag系列5《8E 持卡人验证方法(CVM)列表》
    康托展开
    A*搜索 概念
    code1225 搭积木
    code1064 虫食算
  • 原文地址:https://www.cnblogs.com/jkisjk/p/qwrap_apps_core_retouched.html
Copyright © 2011-2022 走看看