第四章：语言模块

1.字符串的扩展与修复

语言脚本都对字符串特别关注，有关的方法特别多，这些方法有三大类：

第一类：与标签无关的实现：charAt,charCodeAt,concat,lastIndexOf,localeCompare,match,replace,slice,split,substr,substring,toLocaleLowerCase,toLocalUpperCase,toLowerCase,toUpperCase以及从Object继承来的方法。如，toString，valueOf

第二类：与标签有关的实现，都是对原字符串添加的一对标签：anchor,big,blink,blod,fixed,fontcolor,italics,link,small,strike,sub,sup

第三类是后来添加或未标准化的浏览器方法，如trim,quote,toSource,trimLeft,trimRight.其中，trim已经标准化，后四个是FF的私有实现。

先看看prototypejs添加的扩展，

gsub,sub,scan,truncate,strip,stripTags,stripScript,extractScripts,evalScripts,escapeHYML,unescapeHTML,parseQuery,toArray,succ,times,camelize,capitalize,underscore,dasherize,inspect,unfliterJSON,isJSON,evalJSON,include,starsWith,endsWith, empty,blank,interpolate。

其中，gsub,sub,scan与正则相关，直接取ruby的命名

truncate是字符串截取，非常有用。

strip即trim,已标准化

stripTags去掉字符串的标签对，非常有用。

stripScript是单单把script标签去掉，露出script.text

escapeHTML与unescapeHTML是用户输入输出的操作定义，非常有用。

parseQuery基本是对url的search部分的操作。

inspect就是在两端加双引号，用于构建json。

empty和blank是对空白进行判定，很简单的方法。

prototype.js这些框架经常被其它框架抄去，看抄去的功能，我们就知道哪些方法有价值。

rightJs的字符串扩展：include , black , camelize , capitalize , dasherize , empty, endsWith,evalScripts , extarctScripts, includes, on , startsWidth , stripScripts, stripTags, toFlaot, toInt, trim , underscored

Mootools的字符扩展(原型扩展) test, contains , trim , clean , camelCase, hyphenate , capitalize , escapeRegExp , toInt , toFloat , hexToRgb, rgbToHex , substitute , stripScripts

dojo的字符串扩展， rep , pad , substitute , trim , rep就是repeat方法

Ext字符串扩展，capitalize , ellipsis , escape , escapeRegex format htmlDecode, htmlEncode leftPad, parseQueryString , trim , urlAppend

百度七巧板的字符扩展有:decodeHTML ,encodeHTML , escapeReg , filterFormat , format, formatColor , stripTags , toCamelCase, toHalfWidth , trim , wbr

下面举例实现方法：

contains方法：判定一个字符串是否包含另一个字符串。常规思维，使用正则，但每次都要用new RegExp来构造，太麻烦，性能太差。转而使用原生字符串方法。如indexOf , lastIdexOf , search 

    function contains (target, it) {
        return target.lastIndexOf(it) != -1; //indexOf改成search, lastIndexOf也可以
    }

在mootools版中，我们看到它支持更多的参数，目的是判定一个元素的className是否包含某个特定的class。众所周知，元素可以添加多个class,中间以空格隔开，使用mootoos的contains就很方便检测包含关系了。

    function contains (target, str, separator) {
        return separator ? ( separator + target + separator).indexOf(separator + str +separator) > -1 : target.indexOf(str) > -1;
    }

repeat方法： 将一个字符串重复n次，如repeat("ruby",2)得到rubyruby

版本1：利用空数组的join方法

    function repeat (target, n) {
        return (new Array(n + 1)).join(target);
    }

版本2.....6...

版本7，递归在浏览器下做了优化 ，包括ie6,属于最好的实现方式之一

    function repeat (target, n) {
        if (n == 1){
            return target
        }
        var s = repeat(target, Math.floor(n/2));
        s += s;
        if (n % 2) {
            s += target;
        }
        return s;
    }

byteLen方法：取得一个字符串所有字节的长度。这是一个后端转过来的方法。在前端，我们要用户填写文本，需要字节有限制。

版本1：假设字符每个字符Unicode编码小于等于255,byteLength为字符串长度。再遍历字符串，遇到unicode编码大于255时，为byteLength加1

function byteLen (target) {
        var byteLength = target.length, 
            i = 0;
        for ( ; i < target.length ; i++) {
            if (target.charCodeAt(i) > 255) {
                byteLength++;
            }
        }
        return byteLength;
    }

truncate方法，用于对字符串进行截断处理，当超过限定长度，默认添加三个点号等

    function truncate (target, length , truncation) {
        length = length || 30;
        truncation = truncation === void(0) ? '...' : truncation;
        return target.length > length ? target.slice(0, length - truncation.length) + truncation : String(target);
    }

camelize方法，转换为驼峰命名风格

    function camelize (target) {
        if (target.indexOf('_') < 0 && target.indexOf('_') < 0) {
            return target; //提前判断，提高响应效率
        }
        return target.replace(/[-_][^-_]/g , function(match){
            return match.charCodeAt(1).toUpperCase();
        })
    }

underscored方法。转换为下划线风格

function underscored(target){
        return target.replace(/([a-z\d])([A-Z])/g , '$1_$2').replace(/\-/g , '_').toLowerCase();
    }

dasherize方法，转换为连字符风格，亦指css变量风格（承上面的方法）

    function dasherize(target){
        return underscored(target).replace(/_/g, '-');
    }

capitalize方法，首字母大写

    function capitalize(target) {
        return target.charAt(0).toUpperCase() + target.substring(1).toLowerCase();
    }

stripTags方法，移除字符中的html标签。但有一个缺陷，如果其中有script标签，会把不该显示的脚本也显示出来。

    function stripTags(target){
        return String(target || "") .replace(/<[^>]+>/g, '');
    }

escapeHTML和unescapeHTML略

escapeRegExp方法：将字符串安全格式转换为正则表达式的源码

    function escapeRegExp(target){
        return target.replace(/([-.*+?^${}()|[\]\/\\])/g, '\\$1');
    }

 pad方法，与trim方法相反，pad可以为字符串的某一端添加字符串。常见的是在日历的月份前面加补0，因此，被称为fillZero。

    function pad(target,n){
        var zero = new Array(n).join('0');
        var str = zero + target;
        var resulet = str.substr(-n);
        return resulet;
    }

高级方法，也是mass Framework使用的版本，支持更多的参数。允许从左边或从右填充。以及使用什么内容进行填充。

    function pad (target, n, filling, right, radix){
        var num = target.toString(radix || 10);
        filling = filling || "0";
        while (num.length < n){
            if(!right){
                num = filling + num;
            } else {
                num += filling;
            }
            return num;
        }
    }

wbr方法，为目标字符串添加wbr换行。不过需要注意的是，它不是为每个字符串都插入<wbr>字样，而是相当于在组成文本节点的报语法中的每个字符后插入<wbr>字样。如果是aa<span>bb</span>cc,返回a<wbr>a<span>b<wbr>b</span>c<wbr>c<wbr>，在opear浏览器上，默认的css不会添加上wbr样式，需要在css上添加，wbr:after{content:"\00200B"}解决此问题

    function wbr (target){
        return String(target).replace(/(?:<[^>]+>) | (?:&#?[0-9a-z]{2,6};) | (.{1})/gi,'$&<wbr>').replace(/><wbr>/g,'>');
    }

format方法，在c语言中，有一个printf方法，我们可以在后面添加不同的类型的参数嵌入到将要输出的字符串中。这是非常有用的方法，因为在javascript中涉及到大量这样字符串拼接的工作 ，如果涉及逻辑，我们可以用模板，如果轻量点，我们可以用这个方法。

在不同的框架中名字不同，prototype.js 叫interpolate,Base2叫format,mootools叫substitute。

    function format (str, object){
        var array = Array.prototype.slice.call(arguments, 1);
        return str.replace(/\\?\#{([^{}]+)\}/gm,function(match, name) {
            if(match.charAt(0) == '\\')
                return match.slice(1);
            var index = Number(name)
            if(index >= 0)
                return array[index];
            if (object && object[name] !== void 0)
                return object[name];
            return '';
        });
    }
    var a = format("resulet is #{0}, #{1}",22,33)
    console.log(a) // resulet is 22, 33
    var b = format ( "#{name} is a #{sex} #{am}" ,{
        name:"wangjie",
        sex:"man",
        am:"111"
    });
    console.log(b) // wangjie is a man 111

它支持两种传参方法，如果字符串的占位符为0,1,2这样的非零整数，要求传入两个或以上的参数，否则就传入一个对象，键名为占位符。

quote方法，在字符串的两端加上双引号。然后内部需要转义的地方都要转义。用于接装JSON的键名或模析系统中

    //code.google.com/jQuery-json
    var escapeable = /["\\\x00-\x1f\x7f-\x9f]/g,
                    meta = {
                        '\b':'\\b',
                        '\t':'\\t',
                        '\n':'\\n',
                        '\f':'\\f',
                        '\r':'\\r',
                        '"':'\\"',
                        '\\':'\\\\'
                    };
    function quote(target){
        if (target.match(escapeable)){
            return '"' + target.replace(escapeable,function(a) {
                var c = meta[a];
                if(typeof c === 'string') {
                    return c;
                }
                return '\\u' + ('0000' + c.charCodeAt(0).toString(16)).slice(-4)
            }) + '"';
        }
        return '"' + target + '"';
    }               

当然，如果浏览器支持原生的JSON，我们直接用JSON.stringify就行了，另外，FF在JSON发明之前，就支持String.prototype.quote与String.quote方法了，我们使用quote之前判定浏览器是否内置这些方法

字符串好像没有打的浏览器兼容问题，有的话是IE6,IE7不支持用数组中括号取它的每一个字符，需要用charAt来取。IE678不支持垂直分表符，因此有如下hack

var isIe678 = !+"\v1";

修复旧版本IE中的trim函数。这是一个很常用的操作，通常我们需要把表单的两侧空白清除掉

版本1，用了两次正则，实际速度非常惊人，主要得益于浏览器的内部优化。base2使用这种优化，引起了其它浏览器的跟风。于是正则的实现再也比不过字符串方法了。一个著名的例子，字符串拼接。直接相加比Array做成的StringBuffer还快。而StringBuffer技术在早些年备受推崇。

    function trim(str){
        return str.replace(/^\s\s*/, '').replace(/\s\s*$/, '');
    }

版本2

利用两个候选操作符链接两个正则，这样做就失去了浏览器优化的机会。由于看起来很优雅，很多类库都使用它。如jQuery,mootools

    function trim(str){
        return str.replace(/^\s+|\s+$/g, '');
    }

版本3

更好的改进版

    function trim(str){
        var str = str.replace(/^\s\s*/, ""),
                ws = /\s/,
                i = str.length;
    while (ws.test(str.charAt(--i)))
        return str.slice(0, i + 1);
    }

2.数组的扩展与修复

得益于Prototype.js的ruby式数组方法的侵略，让jser()的前端工程师大开眼界，原来对数组的操作是如此的丰富多彩。原来的javascript数组方法就是基于栈与队列的一套方法，像splice()还是很晚的时候加入的。让我们回顾一下用法。

pop()方法，出栈操作，删除并返回数组的最后一个元素

push()方法，出栈操作，向数组的末尾添加一个或更多元素，并返回新的长度。

shift()方法，出队操作，删除并返回数组的第一个元素

unshift()方法，入队操作，向数组的开头添加一个或更多的元素，返回新的长度

slice()方法，切片操作，从数组中分离出一个子数组，功能类似字符串的substring、slice、substr这三兄弟。此方法也常用于转换类数组对象为真正的数组

sort()方法，对数组元素进行排序，有一个可选参数，为比较函数。

reverse()方法，颠倒数组中元素的顺序。

splice()方法，用于用于同时对原数组进行增删操作，数组的remove方法就是基于它而写的

concat()方法，用于把原数组与参数合并成一个新数组，如果参数为数组，那么它会把其第一维的元素放入新的数组中。因此我们可以利用它实现数组的平坦化操作和克隆操作。

join()方法，把数组的所有元素放入一个字符串。元素通过指定的分隔符进行分隔。你可以想象成字符串的split的反操作。

在ecma262v5中，它把标准浏览器早已经实现的几个方法进行了入户处理。从此，我们可以安心的使用forEach()方法，不用担心他们被废弃掉了。

indexOf()方法，定位操作。同上，不是从后遍历。索引操作可以说是字符串的同名方法的翻版，存在就返回非负操作。不存在就返回-1.

forEach()方法。迭代操作。将数组的元素依次传入一个函数中执行，prototype.js对应的名字为 each。

map()方法，收集操作。将数组的元素依次传入一个函数中执行，然后把它们的返回值组成一个新数组返回。prototype.js对应的名字为collect.

fliter()方法。过滤操作，将数组的元素依次传入一个函数中执行，然后把返回值为true的那个元素放入新的数组中返回。prototype.js中它有三个名字，select、filter、findAll

some()方法，只要数组中有一个元素满足条件（放进函数返回true）。那么它就返回true.prototype.js对应的名字为any

every()方法，只有数组的元素满足调条件（放进给定函数返回true）它才返回true。prototype.js对应的名字为any

reduce()方法，归化操作。将数组中的元素归化为一个简单的数值。prototype.js对应的名字为inject

reduceRight()方法：归化操作，将数组中的元素归化为一个简单的数值。同上，不过是从后遍历。

由于许多扩展也基于这些新的标准方法，因此我们先给出IE678兼容方案，全部在数组原型上修复他们。

    Array.prototype.indexOf = function(item, index){
        var n = this.length, i = ~~index;
        if(i<0)
            i += n;
        for(; i<n; i++)
            if(this[i] === item)
                return i;
            return -1;
    }

    Array.prototype.lastIndexOf = function(ietm, index){
    var n = this.length,
        i = index == null ? n - 1 : index;
    if (i < 0)
        i = Math.max(0, n + 1);
    for (; i >= 0; i--)
        if (this[i] === item)
           return i;
    return -1;
    }

像forEach map filter some every这几个方法，在结构上非常相似，我们可以这样生成他们。

    function iterator (vars, body, ret){
        var fun = 'for (var ' + vars + 'i = 0,n =  this.length; i < n; i++ ){' +
             body.replace('_', '((i in this) && fn.call(scope,this[i],i,this))') 
             + '}' + ret
             return Function ("fn,scope", fun);
    }
    Array.prototype.forEach = iterator('','_','');
    Array.prototype.filter = iterator('r=[],j=0', 'if(_)r[j++]=this[i]', 'return r');
    Array.prototype.map = iterator('r=[],', 'r[i]=_' , 'return r');
    Array.prototype.some = iterator('','if(_)return true', 'return false');
    Array.prototype.every = iterator('','if(!_)return false','return true')

造轮子的同学注意：数组的空元素不会再上述方法中遍历出来。

    [1,2,,4].forEach(function(e){
        console.log(e)
    })

接下来，我们将对数组的扩展进行总结，除去上述的

prototype.js的数组扩展：eachSlice , detect , grep , include , inGruopsOf , invoke, max, min, partition, pluck , reject, sortBy , zip , size, clear, first, last, compact, faltten , without, uniq , intersect, clone, inspect

Right.js 的数组扩展有 include, clean , clone , conpact, empty , first , flatten , includes, last, max , merge , min , random, reject, shuffle , size , sortBy, sum , uniq ,walk, without

mootools的数组扩展，clean, clone , associate , link , contains, append, getLast , getRandom, include, combine, erase, empty, flatten, min, max, mean, sum, erase, insert.

Ext的数组扩展， contains, pluck, clean, qunique, form , remove, include, merge,insersect, difference, flatten, min , max, mean, sum, erase, insert

Underscore.js 的数组扩展， detect, reject, invoke , pluck, sortBy, groupBy, sortedIndex, first, last, compact, flatten,without , union, intersection , difference, quiq, zip

qooxdoo数组扩展， insertAfter, insertAt, insertBefore , max , min , remove , removeAll , removeAt, sum , unique.

百度七巧板扩展， contains ,empty , find , remove , removeAt , unique

我们可以发现，Prototype.js 的一套方法影响深远， 许多库都有它的影子。我们可以根据需要与框架宗旨指定自己的数组扩展， 我们在这些方面考虑如下：
至少包含：平坦化， 去重， 乱序，移除这几个操作，其次是两个集合间的操作，如取并集。差集，交集。
下面是各种具体实现。

contains方法， 判定数组是否包含指定的目标

    function contains(target, item){
        return target.indexOf(item) > -1
    }

removeAt方法，移除数组中指定位置的元素，返回布尔表示成功与否

    function removeAt(target, index){
        return !!target.splice(index, 1).length
    }

remove方法，移除数组中第一个匹配传参的那个元素，返回布尔表示成功与否。

    function remove(target, ietm){
        var index = target.indexOf(ietm);
        if(~index)
            return removeAt(target,index);
        return false;
    }

shuffle方法，对数组进行洗牌。若不影响原数组，可以先拷贝一份出来操作，有关洗牌，可以参考
博文：http://bost.ocks.org/mike/shuffle/

    function shuffle(target){
        var j, x,  i = target.length;
        for(; i > 0; j = parseInt(Math.random() * i) ,
            x = target[--i],target[i] = target[j] = x) {
        }
        return target
    }

random方法，从数组中随机选出一个元素出来

    function random(target){
        return target[Math.floor(Math.random() * target.length)];
    }

flatten方法，对数组进行平坦化处理，返回一个一维的新数组

    function flatten(target){
        var resulet = [];
        target.forEach(function(item){
            if (Array.isArray(item)) {
                resulet = resulet.concat(flatten(item));
            } else{
                resulet.push(ietm)
            }
        });
        return resulet;
    }

unique方法，对数组去重，返回一个没有重复元素的新数组

    function unique(target){
        var resulet = [];
        loop: for (var i = 0, n = target.length; i < n; i++){
            for (var x = i + 1; x < n; x++){
                if (target[x] === target[i])
                    continue loop;
            }
            resulet.push(target[i]);
        }
        return resulet;
    }

compact方法，过滤数组中的null和undefined，但不影响数组。

    function compact (target) {
        return target.filter(function(el){
            return el != null;
        });
    }

pluck方法，获得对象数组中的每个元素的指定属性，组成数组返回

    function pluck(target, name){
        var resulet = [], prop;
        target.forEach(function(ietm){
            prop = ietm[name];
            if (prop != null)
                resulet.push(prop);
        });
        return resulet;
    }

groupBy方法：根据指定条件（如回调或对象的某个属性）进行分组，构成对象返回

    function groupBy(target, val){
        var resulet = {};
        var iterator = $.isFunction(val) ? val : function (obj){
            return obj[val];
        };
        target.forEach(function(value, index){
            var key = iterator (value, index);
            (resulet[key] || resulet[key] = [])).push(value);
        });
        return resulet
    }

sortBy方法：根据指定条件进行排序，通常用于对象数组

    function sortBy(target, fn, scope){
        var array = target.map(function(ietm, index){
            return {
                el: ietm,
                re: fn.call(scope, ietm, index)
            };
        }).sort(function(left, right){
            var a = left.re, b = right.re;
            return a < b ? -1 : a > b ? 1: 0;
        })
        return pluck(array, 'el');
    }

union方法，对两个数组取并集

    function union (target, array){
        return unique(target.concat(array));
    }

intersect方法：对两个数组取交集

    function intersect(target, array){
        return target.filter(function(n){
            return ~array.indexOf(n);
        });
    }

diff方法，对两个数组取差集

    function diff(target, array){
        var resulet = target.slice();
        for (var i = 0, i < resulet.length; j++) {
            for (var j = 0; j < resulet.length; j++) {
                if (resulet[i] === array[j]){
                    resulet.splice(i, 1);
                    i--;
                    break;
                }
            }
        }
        return resulet;
    }

min方法，返回数组的最小值，用于数字数组

    function min (target){
        return Math.min.apply(0, target);
    }

max方法，返回数组中的最大值。用于数字数组

    function max(target){
        return Math.max.apply(0, target);
    }

 3.数值的扩展与修复

数值没有什么好扩展的，而且javascript的数值精度问题一向臭名昭著，修复不是一两行代码的事情。先看扩展。

Prototype.js为它添加了8个原型方法，Succ是加1，times是将回调重复执行制定次数，toPaddingString与上面提到的字符串扩展方法pad作用一样，toColorPart是转十六机制，abs,ceil,floor,是从Math中提取出来的

mootools的情况，limit是从数值限在一个闭开间中，如果大于或小于其边界，则等于其最大值或最小值，times与prototype.js用法相似，round是Math.round的增强版，添加了精度控制，toFloat，toInt是从window中偷学来的。

看看mass Framework对数字的扩展

limit方法，确保数值在[n1,n2]闭区间之内，如果超出界限，则置换为离它最近的最大值或最小值。

    function limit(target, n1, n2){
        var a = [n1, n2].sort();
        if (target < a[0])
            target = a[0];
        if(target > a[1])
            target = a[1];
        return target;
    }

nearer方法，求出距离数值最近的那个数。

    function nearer(target, n1, n2){
        var diff1 = Math.abs(target - n1),
            diff2 = Math.abs(target - n2);
        return diff1 < diff2 ? n1 : n2
    }

Number下唯一要修复的方法是toFixed，它是用来校正精确度，最后的那个数会四舍五入操作，但在一些浏览器中，并未这么操作。
简单修复可以这样处理

    if(0.9.toFixed(0) !== '1') {
        Number.Prototype.toFixed = function(n) {
            var power = Math.pow(10, n);
            var fixed = (Math.round(this*power)/power).toString();
                if(n == 0)
                    return fixed;
                if(fixed.indexOf('.') < 0)
                    fixed += '.';
                var padding = n + 1 (fixed.length - fixed.indexOf('.'));
                for (var i = 0; i < padding; i++)
                    fixed += '0';
                return fixed;
        }
    }

关于javascript误差运算不在这里呈现了，但在工作中，我们尽量避免小数操作与大数操作，或者转交后台处理，实在避免不了，可以引入专业的库来实现。

4.函数的扩展与修复

V5对函数的唯一扩展就是bind函数，众所周知，这来自prototype.js，此外，其它重要的函数都来自prototype.js

prototype.js的函数扩展如下：

argumentNames：取得函数的形参，以字符串形式返回，这只要用于其类工厂的方法链设计

bind,不用多描述，劫持作用域，并预先添加更多的参数。

bindAsEventListener 如bind相似，但强制返回函数的第一个参数为事件对象，这是用于修复IE多投事件API与标准API的差异。

curry 函数柯里化，用于一个操作分成多步进行，并可以改变原函数的行为。

wrap:AOP 的实现。

delay:setTimeout的偷懒写法。

defer:强制延迟0.01秒才执行原函数

methodize：将一个函数变成其调用对象的方法，这也是为其类工厂的方法服务。

首先我们看bind方法，它用到了著名的闭包（所谓闭包，就是引用着外部变量的内部函数），比如下面这个函数

    var observable = function(val){
        var cur = val; //一个内部变量
        function field(neo) {
            if (arguments.length){ //setter
                if (cur !== neo) {
                    cur = neo
                }
            } else { //getter
                return cur;
            }
        }
        field();
        return field;
    }

它里边的field函数将于外部的cur构成一个闭包。prototype.js中的bind方法只要依仗原来=函数与经过切片话的args构成闭包，而这个方法就是名副其实的curry柯里化，用户最初的那个传参，劫持到返回函数修正this的指向。

    Function.Prototype.bind = function(context) {
        if (arguments.length < 2 && context == void 0)
            return this;
        var _method = this, args = [].slice.call(arguments, 1);
        return function() {
            return _method.apply(context, args.context.apply(args, arguments));
        }
    }

因为有这个原型扩展，我们才可以修复ie的多投事件API attachEvent回到的this问题，它总是指向window对象，而标准的浏览器的的addEventListener中的this则其调用对象

    var addEvent = document.addEventListener ? 
           function (el, type, fn, capture){
               el.addEventListener (type, fn, capture)
           } : 
           function (el, type, fn) {
               el.attachEvent("on" + type, fn.bind(el, event))
           }

ECMA62 V5对其认证以后，唯一的增强是对调用者进行监测，确保它是一个函数。顺便总结一下这三个东西。

call是obj.method(a, b, c)到method(obj,[a, b, c])的变换，它要求第二个参数必须存在，一定是数组或Arguments这样的类数组，NodeList这样具有争议性的东西就不能传入进去！
因此，jQuery对两个数组或类数组的合并就使用jQuery.merge,放弃使用Array.prototype.push.apply。

bind就是apply的变种，保证返回值是一个函数。

这三个方法非常有用，我们设法将其还原出来。

    var bind = function(bind) {
        return {
            bind: bind.bind(bind),
            call: bind.bind(bind.call),
            apply: bind.bind(bind.apply)
        }
    } (Function.Prototype.bind)

那么怎么使用它们呢，比如我们想合并两个数组，直接调用concat方法：

    var concat = bind.apply([].concat);
    var a = [1, [2,3], 4];
    var b = [1, 3];

使用bind.bind方法可以将它们的结果进一步平坦化

    var concat = bind.apply([].concat);
    console.log(concat(b,a)); //=> [1,3,1,2,3,4]

又如切片化操作，它经常用于转换类数组对象为纯数组

    var slice = bind([].slice)
    var array = slice({
        0: "aaa",
        1: "bbb",
        2: "ccc",
        3: "ddd"
        length: 4
    });
    console.log(array) //=> ["aaa","bbb","ccc","ddd"]

更常用的操作是转换arguments对象，目的是为了使用数组的一系列方法

    function test() {
        var args = slice(arguments)
        console.log(args)//=> [1,2,3,4,5]
    }
    test(1, 2, 3, 4, 5)

 

我们可以将hasOwnProperty提取出来，判定对象是否在本地就拥有某属性

    var hasOwn = bind.call(Object.Prototype.hasOwnProperty);
    hasOwn([],"xx") //false
    //使用bind.bind就需要多执行一次
    var hasOwn2 = bind.bind(Object.Prototype.hasOwnProperty);
    hasOwn2([],"xx")() //false

上面的bind.bind的行为就是一种curry，它给了你一种传参的机会，这样你就可以在内部判定参数的个数，决定是否继续返回函数还是结果。这在设计计算器的连续运算上非常有用。从此角度，我们可以得到一条信息，bind着重作用域的劫持，curry在于参数的不断补充。

我们可以编写一个curry，当所有步骤输入的参数个数等于最初定义时的函数形参个数，就执行它。

    function curry(fn) {
        function inner(len, arg) {
            if (len == 0)
                return fn.apply(null, arg);
            return function(x) {
                return inner(len - 1, arg.concat(x));
            };
        }
        return inner(fn.length, []);
    }
    function sum(x, y, z, w){
        return x + y + z + w;
    }

    curry(sum)('a')('b')('c')('d'); //=> 'abcd'

不过这里我们假定了用户每次都只传入一个参数，我们可以改进下

    function curry2(fn) {
        function inner (len, arg){
            if (len <= 0)
                return fn.apply(null, arg);
            return function() {
                return inner (len - arguments.length,
                    arg.concat(Array.apply([],arguments)));
            }
        }
        return inner(fn.length, []);
    }

这样，我们就可以在中途传递多个参数，或不传递参数

curry2(sum)('a')('b','c')('d'); //=> 'abcd'
curry2(sum)('a')()('b','c')()('d'); //=> 'abcd'    

不过，上面的函数形式有个更帅气的名称，叫self-curry,或recurry.它强调的是递归自身来补全参数。
与curry相似的partial。curry的不足 参数总是通过push的方式来补全，而partial则是在定义时所有参数都已经有了，但某些位置上的参数值是个占位符，我们在接下来的传参只是替换掉它们。博客上专门有《partial application in javascript》来介绍这个内容。

    Function.Prototype.partial = function(){
        var fn = this, args = Array.prototype.slice.call(arguments);
        return function() {
            var arg = 0;
            for (var i = 0 ;  i < args.length && arg < arguments.length; i++)
                if (args[i] === undefined)
                    args[i] = arguments[args++];
            return fn.apply(this, args);
        }
    }

它是使用undefined作为占位符的。

    var delay = setTimeout.partial(undefined, 10);
    //接下来的工作就代替掉第一个参数
    delay(function() {
        console.log("A  call to this function will be temporarily delayed")
    })

curry、partial应用场景在前端世界应用的并不多，前端讲究的是即时显示，许多API都是同步的，后端由于IO操作等耗时够长，像node.js提供了大量的异步函数来提高性能，防止堵塞。但是过多的异步函数必然带来回调嵌套的问题。因此，我们需要curry等函数变换。将嵌套减少到可以接受的程度。在ajax中会讲述他们的使用办法。

函数的修复，这涉及到方法，apply和call,这两个方法的本质就是生成一个新的函数。将原函数与用于的传参放到里面执行而已，在javascript中创造一个函数有很多办法，常见的有函数声明和函数表达式，次之是函数构造器，再次之是eval,setTimeout....

5.日期的扩展与修复

Date构造器是javascript中传参最丰富的构造器。大致分为四种：

    new Date();
    new Date(value); //传入毫秒鼠
    new Date(dateString)
    new Date(year, month, day/*, hour, minute, second, minllisecond*/)

其中，第三种可以玩N多花样，个人建议只使用"2009/07/12 12:34:56",后面的分秒可以省略。这个所有的浏览器都支持，此构造器的兼容列表可见此文。

http://dygraphs.com/date-formats.html

若要修正它的传参，可能是个庞大的工程。并且影响Object.prototype.toString的类型的判断。因此，不建议修正。es5.js中的源码，可以参考

https://github.com/kriskowal/es5-shim/blob/master/es5-shim.js

javascript的日期是抄自java.util.Date,但是Date这个类的很多方法对时区等支持不够，且不少都过时，java程序员也推荐使用calnedar类代替Date类。javascript可以选择余地比较小。如对属性使用了前后矛盾的偏移量。月份与小时都是基于0.月份中的天数则是基于1，而年则是从1900开始的.

接下来，我们为旧版的浏览器添加几个ecma262标准化日期方法吧

    if(!Date.now) {
        Date.now = function(){
            return + new Date;
        }
    }
    if (!Date.prototype.toISOString) {
        void function() {
            function pad (number) {
                var r = String(number);
                if (r.length === 1) {
                    r = '0' + r ;
                }
                return r
            }
        Date.prototype.toJSON = Date.prototype.toISOString = function() {
            return this.getUTCFllYear()
            + '_' + pad(this.getUTCMonth() + 1)
            + '_' + pad(this.getUTCDate())
            + 'T' + pad(this.getUTCHours())
            + ':' + pad(this.getUTCMinutes())
            + ':' + pad(this.getUTCSeconds())
            + '.' + String((this.getUTCMilliseconds()/1000).toFixed(3)).clice(2, 5)
            + 'Z';
        }
        }();
    }

IE67 中，getYear， setYear方法存在bug.这个修起来比较简单:

    if ((new Date).getYear() > 1900){
        Date.prototype.getYear = function(){
            return this.getFullYear() - 1900;
        };
    Date.prototype.setYear = function(year){
        return this.setFullYear(year); //+1900
    };
    }

至于扩展，由于涉及本地化的原因，外国许多日期库都需要改一改才能用。其中以dataFormat这个很有用的方法为最。先给一些常用的扩展。

传入两个Date类型的日期，求其相隔的天数

    var getDatePeriod = function(start, finish){
        return Math.abs(start * 1 - finish * 1) / 60 / 60 / 1000 / 24;
    }

传入一个Date类型的日期，判断它所在月的第一天。

    var getFirstDateInMouth = function(date) {
        return new Date(Date.getFullYear(), Date.getMonth(), 1);
    }

传入一个Date类型的日期，判断它所在月的最后一天。

    var getLastDateInMouth = function(date) {
        return new Date(Date.getFullYear(), Date.getMonth() + 1, 0);
    }

判断是否是闰年

    Date.prototype.isLeapYear = function(){
        return new Date(this.getFullYear(),2 ,0).getDate() == 29;
    }

获得当前月份的天数

    function getDaysInMotn1(date) {
        switch (Date.getMonth()) {
            case 0:
            case 2:
            case 4:
            case 6:
            case 7:
            case 9:
            case 11:
                return 31;
            case 1:
                var y = Date.getFullYear();
                return y % 4 == 0 && y % 100 != 0 || y % 400 == 0 ? 29 : 28;
            default :
                return 30;
        }
    }

    function getDaysInMonth2(date) {
        return new Date(date.getFullYear(), date.getMonth() + 1, 0).getDate();
    }

dateFormat方法太长，此处略。

（本章完结）

上一章： 第三章：模块加载系统（requirejs）  下一章：第5章，浏览器的嗅探与特征侦测