数组要领
定义
var emptyArray = []
concat = emptyArray.concat
filter = emptyArray.filter
slice = emptyArray.slicezepto 一开始就定义了一个空数组 emptyArray，定义这个空数组是为了获得数组的 concat、filter、slice 要领
compact
function compact(array) {
return filter.call(array, function(item) {
return item != null
})
}删除数组中的 null 和 undefined
这里用的是数组的 filter 要领，过滤出 item != null 的元素，构成新的数组。这里删撤除 null 很轻易邃晓，为何还能够删除 undefined 呢？这是因为这里用了 != ，而不是用 !== ，用 != 时， null 各 undefined 都邑先转换成 false 再举行比较。
关于 null 和 undefined 引荐看看这篇文章： undefined与null的区分
flatten
function flatten(array) {
return array.length > 0 ? $.fn.concat.apply([], array) : array
}将数组扁平化，比方将数组 [1,[2,3],[4,5],6,[7,[89]] 变成 [1,2,3,4,5,6,7,[8,9]] ,这个要领只能睁开一层，多层嵌套也只能睁开一层。
这里，我们先把 $.fn.concat 等价于数组的原生要领 concat，背面的章节也会剖析 $.fn.concat 的。
这里比较奇妙的是利用了 apply ，apply 会将 array 中的 item 当做参数，concat.apply([], [1,2,3,[4,5]]) 相当于 [].concat(1,2,3,[4,5])，如许数组就扁平化了。
uniq
uniq = function(array) {
return filter.call(array, function(item, idx) {
return array.indexOf(item) == idx
})
}数组去重。
数组去重的道理是检测 item 在数组中第一次涌现的位置是不是和 item 所处的位置相称，假如不相称，则证实不是第一次涌现，将其过滤掉。
字符串要领
camelize
camelize = function(str) {
return str.replace(/-+(.)?/g, function(match, chr) {
return chr ? chr.toUpperCase() : ''
})
}将 word-word 的情势的字符串转换成 wordWord 的情势， - 能够为一个或多个。
正则表达式匹配了一个或多个 - ，捕捉组是捕捉 - 号后的第一个字母，并将字母变成大写。
dasherize
function dasherize(str) {
return str.replace(/::/g, '/')
.replace(/([A-Z]+)([A-Z][a-z])/g, '$1_$2')
.replace(/([a-z\d])([A-Z])/g, '$1_$2')
.replace(/_/g, '-')
.toLowerCase()
}将驼峰式的写法转换成连字符 - 的写法。
比方 a = A6DExample::Before
第一个正则表达式是将字符串中的 :: 替换成 / 。a 变成 A6DExample/Before
第二个正则是在涌现一次或屡次大写字母和涌现一次大写字母和一连一次或屡次小写字母之间到场 _。a 变成 A6D_Example/Before
第三个正则是将涌现一次小写字母或数字和涌现一次大写字母之间加上 _。a 变成A6_D_Example/Before
第四个正则表达式是将 _ 替换成 -。a 变成A6-D-Example/Before
末了是将一切的大写字母转换成小写字母。a 变成 a6-d-example/before
我对正则不太熟悉，正则诠释部份参考自:zepto源码–compact、flatten、camelize、dasherize、uniq–进修笔记
数据范例检测
定义
class2type = {},
toString = class2type.toString,
// Populate the class2type map
$.each("Boolean Number String Function Array Date RegExp Object Error".split(" "), function(i, name) {
class2type["[object " + name + "]"] = name.toLowerCase()
})$.each 函数背面的文章会讲到，这段代码是将基础范例挂到 class2type 对象上。class2type 将会是以下的情势：
class2type = {
"[object Boolean]": "boolean",
"[object Number]": "number"
...
} type
function type(obj) {
return obj == null ? String(obj) :
class2type[toString.call(obj)] || "object"
}type 函数返回的是数据的范例。
假如 obj == null ，也就是 null 和 undefined，返回的是字符串 null 或 undefined
不然挪用 Object.prototype.toString （toString = class2type.toString）要领，将返回的效果作为 class2type 的 key 取值。Object.prototype.toString 对差别的数据范例会返回形如 [object Boolean] 的效果。
假如都不是以上状况，默许返回 object 范例。
isFunction & isObject
function isFunction(value) {
return type(value) === 'function'
}
function isObject(obj) {
return type(obj) == 'object'
}挪用 type 函数，推断返回的范例字符串，就晓得是什么数据范例了
isWindow
function isWindow(obj) {
return obj != null && obj == obj.window
}推断是不是为浏览器的 window 对象
要为 window 对象起首要满足的前提是不能为 null 或许 undefined， 而且 obj.window 为本身的援用。
isDocument
function isDocument(obj) {
return obj != null && obj.nodeType == obj.DOCUMENT_NODE
}推断是不是为 document 对象
节点上有 nodeType 属性，每一个属性值都有对应的常量。document 的 nodeType 值为 9 ，常量为 DOCUMENT_NODE。
isPlainObject
function isPlainObject(obj) {
return isObject(obj) && !isWindow(obj) && Object.getPrototypeof(obj) == Object.prototype
}推断是不是为地道的对象
地道对象起首必需是对象 isObject(obj)
而且不是 window 对象 !isWindow(obj)
而且原型要和 Object 的原型相称
isArray
isArray = Array.isArray ||
function(object) { return object instanceof Array}这个要领来用推断是不是为数组范例。
假如浏览器支撑数组的 isArray 原生要领，就采纳原生要领，不然检测数据是不是为 Array 的实例。
我们都晓得，instanceof 的检测的道理是查找实例的 prototype 是不是在组织函数的原型链上，假如在，则返回 true。 所以用 instanceof 可能会获得不太正确的效果。比方：
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<script>
window.onload = function () {
var fwindow = window.framePage.contentWindow // frame 页面的window对象
var fArray = fwindow.Array // frame 页面的Array
var fdata = fwindow.data // frame 页面的 data [1,2,3]
console.log(fdata instanceof fArray) // true
console.log(fdata instanceof Array) // false
}
</script>
<title>Document</title>
</head>
<body>
<iframe id="framePage" src="frame.html" frameborder="0"></iframe>
</body>
</html>frame.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
window.data = [1,2,3]
</script>
</head>
<body>
<p>frame page</p>
</body>
</html>因为 iframe 是在自力的环境中运转的，所以 fdata instanceof Array 返回的 false 。
在 MDN 上看到，能够用如许的 ployfill 来运用 isArray
if (!Array.isArray) {
Array.isArray = function(arg) {
return Object.prototype.toString.call(arg) === '[object Array]'
}
}也就是说，isArray 能够修改成如许：
isArray = Array.isArray ||
function(object) { return Object.prototype.toString.call(object) === '[object Array]'}为何 zepto 不如许写呢？晓得的能够留言示知下。
likeArray
function likeArray(obj) {
var length = !!obj && // obj必需存在
'length' in obj && // obj 中必需存在 length 属性
obj.length, // 返回 length的值
type = $.type(obj) // 挪用 type 函数，返回 obj 的数据范例。这里我有点不太邃晓，为何要覆蓋掉上面定义的 type 函数呢？再定义多一个变量，直接挪用 type 函数不好吗？
return 'function' != type && // 不为function范例
!isWindow(obj) && // 而且不为window范例
(
'array' == type || length === 0 || // 假如为 array 范例或许length 的值为 0，返回true
(typeof length == 'number' && length > 0 && (length - 1) in obj) // 或许 length 为数字，而且 length的值大于零，而且 length - 1 为 obj 的 key
)
}推断是不是为数据是不是为类数组。
类数组的情势以下：
likeArrayData = {
'0': 0,
'1': 1,
"2": 2
length: 3
}能够看到，类数组都有 length 属性，而且 key 为按0,1,2,3 递次的数字。
代码已经有解释了，这里再简朴总结下
起首将 function范例和 window 对象消除
再将 type 为 array 和 length === 0 的认为是类数组。type 为 array 比较轻易邃晓，length === 0 实在就是将其看作为空数组。
末了一种状况必需要满足三个前提：
length必需为数字length必需大于0，示意有元素存在于类数组中key
length - 1必需存在于obj中。我们都晓得，数组末了的index值为length -1，这里也是搜检末了一个key是不是存在。
系列文章
参考
末了，一切文章都邑同步发送到微信民众号上，迎接关注,迎接提意见：
