簡(jiǎn)介
underscore.js
作為一個(gè)優(yōu)秀的JavaScript工具庫(kù)掉冶,提供了很多使用的功能汤锨,同時(shí)考慮了瀏覽器的兼容性,并且代碼加上注釋只有2K行凌蔬,很利于閱讀和學(xué)習(xí)。
使用版本:
_.VERSION = '1.8.3';
1 基礎(chǔ)
1.1 立即執(zhí)行函數(shù)
(function() {
...
}());
underscore.js
的文件整體用一個(gè)立即執(zhí)行函數(shù)包裹闯冷,防止其內(nèi)部和其他代碼之間的相互污染砂心。
1.2 獲取全局命名空間
1.3 使用變量保存常用函數(shù)
var push = ArrayProto.push,
slice = ArrayProto.slice,
toString = ObjProto.toString,
hasOwnProperty = ObjProto.hasOwnProperty;
因?yàn)樵谶M(jìn)行壓縮代碼的時(shí)候,push
,slice
等可以被替換為a
,b
等蛇耀,而ArrayProto.push
無(wú)法壓縮辩诞。
1.4 兼容Object.create
var Ctor = function() {}
var baseCreate = function(prototype) {
if (!_.isObject(prototype)) return {};
if (nativeCreate) return nativeCreate(prototype);
Ctor.prototype = prototype;
var result = new Ctor;
Ctor.prototype = null;
return result;
};
如果當(dāng)前環(huán)境不存在Object.create()
,則用baseCreate
代替纺涤。
因?yàn)?code>Object.create(obj)是創(chuàng)建一個(gè)空的對(duì)象译暂,使它的__porto__
指向obj,所以要用一個(gè)暫時(shí)的類(lèi)Ctor
來(lái)實(shí)現(xiàn)撩炊。
1.5 回調(diào)函數(shù)封裝
2 函數(shù)處理相關(guān)
2.1 debounce
_.debounce(function, wait, [immediate])
在function
最后一次調(diào)用后外永,再等待wait
時(shí)間后,再執(zhí)行最后一次函數(shù)拧咳。
如果immediate
為true
伯顶,會(huì)在調(diào)用_.debounce(function, wait, [immediate])
時(shí),立即執(zhí)行一次,并且wait
時(shí)間內(nèi)不會(huì)再執(zhí)行祭衩。
原理:
每次調(diào)用函數(shù)時(shí)灶体,先clearTimeout(timeout)
,清除wait時(shí)間內(nèi)上次的函數(shù)調(diào)用
再執(zhí)行timeout(func,wait)
汪厨。
如果immediate
為true赃春,會(huì)馬上執(zhí)行一次,并且用一個(gè)空的func
占位劫乱,timeout(func,wait)
函數(shù)织中,保證wait
時(shí)間內(nèi)不會(huì)執(zhí)行第二次。
3. 判斷變量類(lèi)型相關(guān)
3.1 isArray
如果存在es5
以上支持的Array.isArray
則用Array.isArray
,否則通過(guò)調(diào)用Object.prototype.toString.call(array)
來(lái)實(shí)現(xiàn)
var isArray = Array.isArray || function (obj) {
return Object.prototype.toString.call(array) === '[object Array]'
}
3.2 isFunction
最好用的方法是type of obj == 'function' || false
衷戈,注意IE8因?yàn)橛衎ug狭吼,
type of obj == 'function'
obj為object的時(shí)候,也會(huì)判斷為true
殖妇,所以用這種方式修復(fù)了bug刁笙。
var nodelist = root.document && root.document.childNodes;
if (typeof /./ != 'function' && typeof Int8Array != 'object' && typeof nodelist != 'function') {
_.isFunction = function (obj) {
return typeof obj == 'function' || false;
};
}
3.3 isObject
obj為函數(shù)/對(duì)象的時(shí)候,都是object谦趣,此外因?yàn)?code>type of null = 'object'疲吸,所以去除了為null`的情況。
_.isObject = function (obj) {
var type = typeof obj
return type === 'function' || type === 'object' && !!object
}