摘要：直接看源碼如果原生支持就用原生的，否知自己實(shí)現(xiàn)一個(gè)結(jié)尾暫時(shí)就介紹這些看起來(lái)并不起眼的工具函數(shù)，在以后的文章和源碼分析中遇到其他的會(huì)陸續(xù)更新到這篇文章中來(lái)。

原文鏈接

源碼地址

今天想寫一篇關(guān)于下劃線這個(gè)庫(kù)中一些小工具函數(shù)的故事，我們都聽過(guò)一句話，一個(gè)成功的男人背后一定有一個(gè)了不起的女人(?，其實(shí)也不一定，也許還有男人呢)，那么一個(gè)經(jīng)久不衰，為程序猿們所稱道的庫(kù)，框架的背后自然也有不少看起來(lái)不起眼，甚至你都懶得正眼瞧他的"小工具"存在。正是這些背后的無(wú)名英雄為類庫(kù)和框架的形成，貢獻(xiàn)了不可磨滅的力量。

第一篇文章說(shuō)了undefined，那我們也從undefined開始。

判斷obj等于undefined與否，是就返回true，反之false。

示例

let a = null
let b = window.b
let c = () => {}
let d = undefined
let e = void 0
let f = "qianlongo"
let g

console.log(_.isUndefined(a)) // false
console.log(_.isUndefined(b)) // true
console.log(_.isUndefined(c())) // true
console.log(_.isUndefined(d)) // true
console.log(_.isUndefined(e)) // true
console.log(_.isUndefined(f)) // false
console.log(_.isUndefined(g)) // true

對(duì)于一個(gè)對(duì)象上不存在的屬性

對(duì)于一個(gè)沒(méi)有返回值的函數(shù)

對(duì)于聲明和卻沒(méi)有賦值的標(biāo)量

對(duì)于直接賦值為undefined(非ie8以下)或者void 0

_.isUndefined都會(huì)返回true，其他情況全都是返回false

需要特別注意的是，有時(shí)候我們會(huì)這樣判斷一個(gè)變量是都存在，a = null
a = undefined都可以通難過(guò)判斷。

if (a == null) { 

}

但是_.isUndefined用的是三等強(qiáng)制判斷，所以null是通過(guò)不了的

_.isUndefined = function(obj) {
  return obj === void 0;
}

判斷obj等于null與否，是就返回true，反之false。

這個(gè)沒(méi)啥說(shuō)的，只有obj輸入null,結(jié)果輸出才為true，因?yàn)閮?nèi)部判斷也是用的三等判斷，不僅值要相等，類型也要相同。

防止全局變量沖突的一種常見解決方案，將_的使用權(quán)交換給上一個(gè)占用_坑位的人。

示例

console.log(_)

遇見重名的事不新鮮對(duì)吧，全國(guó)有多少個(gè)小明啊，我們從小到大課本里到處都是小明和小紅。

這里后面引入的underscore.js把lodash.js給覆蓋了，因?yàn)閮蓚€(gè)庫(kù)都想占用全局的_,結(jié)果后來(lái)者居上。

如果不想lodash被覆蓋怎么辦，總的有個(gè)先來(lái)后到啊。只需要調(diào)用noConflict方法便將占著的_坑位重新歸還給了lodash，而之后我們用my_即可訪問(wèn)所有underscore.js的方法。

let my_ = _.noConflict()

接下來(lái)我們看下源碼怎么實(shí)現(xiàn)的

var previousUnderscore = _ // 在源碼的頂部，保存了前一個(gè)占著_坑位的人
 _.noConflict = function() {
    root._ = previousUnderscore; // 將_重新賦值給前一個(gè)占著_坑位的人
    return this; // 并將_返回以供后續(xù)使用
  };

返回與傳入的參數(shù)value一樣的值

這個(gè)函數(shù)看起來(lái)沒(méi)有什么軟用，但是在后面能夠起非常大的作用，也正體現(xiàn)了，工具雖小，能量卻大

我們先來(lái)簡(jiǎn)單地看下它的應(yīng)用，在后續(xù)的源碼分析中遇到再仔細(xì)講解。

過(guò)濾一個(gè)數(shù)組中為"真"的值

let arr = ["a", "b", null, "false", 0, "c", "", false, {}]
let arr2 = arr.filter(_.identity) // ["a", "b", "false", "c", {}]

復(fù)制數(shù)組

let arr = ["a", "b", null, "false", 0, "c", "", false, {}]
let arr2 = arr.map(_.identity) // ["a", "b", null, "false", 0, "c", "", false, {}]

返回一個(gè)函數(shù)fn，fn執(zhí)行之后再返回當(dāng)初傳進(jìn)來(lái)的value

我們來(lái)看一段github上關(guān)于下劃線的一個(gè)issue，挺有意思的。也許我們比較難列舉出這個(gè)函數(shù)的應(yīng)用，但是至少下面這個(gè)例子是比較好的。

let age = 18
let cacheAge = _.constant(age)

age += 10
console.log(cacheAge()) // 18

為什么可以緩存住18，我們看下源碼大概就知道了，源碼創(chuàng)建了常見的閉包，閉包常見的作用之一就是讓外面通過(guò)函數(shù)調(diào)用的形式去訪問(wèn)內(nèi)部的變量，以及在一定的生命周期內(nèi)，緩存住變量。

 _.constant = function(value) {
    return function() {
      return value;
    };
  };

一個(gè)空函數(shù)，啥也不干，調(diào)用了就返回undefined給你，可以作為默認(rèn)的回調(diào)參數(shù)

又是一個(gè)看起來(lái)啥用都沒(méi)有的函數(shù)，然而事實(shí)真的是這樣嗎？請(qǐng)移步以下幾個(gè)鏈接

What is the use of jQuery.noop() function?

What is the JavaScript convention for no operation?

例子不用多，總結(jié)一下

1. 給一個(gè)變量賦值為一個(gè)空函數(shù)，在后續(xù)的調(diào)用中你不需要去檢測(cè)他是不是undefined

2. 為什么不給需要的變量重新設(shè)置一個(gè)空函數(shù)？ _.noop已經(jīng)創(chuàng)建了一個(gè)函數(shù)空間，讓其他變量也指向這個(gè)函數(shù)，可以減少js中不必要的花銷

調(diào)用給定的iteratee迭代函數(shù)n次，iteratee每次都接收一個(gè)索引值index，最后返回一個(gè)數(shù)組，數(shù)組中存著這幾次iteratee的回調(diào)結(jié)果

示例

let count = 0
let result = _.times(6, (i) => {
  console.log(++count)
  return `hello:${i}`
})

console.log(result) // ["hello:0", "hello:1", "hello:2", "hello:3", "hello:4", "hello:5"]

console.log(count) // 6

可以看到傳進(jìn)去的函數(shù)執(zhí)行執(zhí)行了6次，并將對(duì)應(yīng)的每次執(zhí)行的結(jié)果存在了數(shù)組中返回。

返回一個(gè)[min, max]之間的隨機(jī)整數(shù)，如果沒(méi)有傳max，則區(qū)間是[0, min]

示例

let num1 = _.random(10, 20) // maybe 13 or other
let num2 = _.random(10) // maybe 6 or other

源碼

_.random = function(min, max) {
  if (max == null) { // 如果只有一個(gè)參數(shù)
    max = min; // 就把第一個(gè)參數(shù)當(dāng)最大值
    min = 0; // 0作為最小值
  }
  return min + Math.floor(Math.random() * (max - min + 1));
  // 試想我們要求取[4, 10)之間的某個(gè)整數(shù)
  // (min) 就是保證最小值可以取到4
  // (max - min + 1) => (10 - 4 + 1) => 7
  // Math.random() * 7 => [0, 1) * 7 => [0, 7)
  // Math.floor([0, 7)) => 最小取0， 最大取6
  // 最后變成 4 + [0, 6] => [4, 10]
};

當(dāng)然啦，如果你傳入非整數(shù)，或者max < min的數(shù)，那結(jié)果就有可能不能按照預(yù)期出現(xiàn)了

生成唯一的id，如果prefix不存在則直接將數(shù)字id返回，這個(gè)函數(shù)在給dom添加唯一的id的時(shí)候比較有用。

let pre = "qianlongo"
let id1 = _.uniqueId() // 1
let id2 = _.uniqueId(pre) // qianlongo2

源碼

var idCounter = 0;
_.uniqueId = function(prefix) {
  var id = ++idCounter + ""; // 轉(zhuǎn)成字符串
  return prefix ? prefix + id : id;
};

一個(gè)優(yōu)化的方式來(lái)獲得一個(gè)當(dāng)前時(shí)間的整數(shù)時(shí)間戳。

直接看源碼

_.now = Date.now || function() { // 如果原生支持now就用原生的，否知自己實(shí)現(xiàn)一個(gè)
  return new Date().getTime();
};

暫時(shí)就介紹這些看起來(lái)并不起眼的工具函數(shù)，在以后的文章和源碼分析中遇到其他的會(huì)陸續(xù)更新到這篇文章中來(lái)。寫一篇文章真夠耗費(fèi)時(shí)間的，陸陸續(xù)續(xù)用了好幾個(gè)小時(shí)才寫這么點(diǎn)。

不介意的話，在文章開頭的源碼地址那里點(diǎn)一個(gè)小星星吧?

不介意的話，在文章開頭的源碼地址那里點(diǎn)一個(gè)小星星吧?

不介意的話，在文章開頭的源碼地址那里點(diǎn)一個(gè)小星星吧?