摘要:首先是通過創建一個函數,然后向其傳遞參與計算的值,也就是說應該是返回一個函數,并且有兩個參數。事實上就是這樣,返回值是一個,是被加數,是加數。
源碼注釋版
這一組函數都是數學計算相關的,主要分為三類:
加減乘除:add、subtract、multiply、divide
求最大最小平均值:max、maxBy、min、minBy、sum、sumBy、mean、meanBy
小數的四舍五入:ceil、floor、round
加減乘除在加減乘除的源碼中可以看到這四個函數都引用了一個 createMathOpeartion 這個函數,然后是這樣使用這個函數的:
// 加法 const add = createMathOperation((augend, addend) => augend + addend, 0) // 減法 const subtract = createMathOperation((minuend, subtrahend) => minuend - subtrahend, 0) // 乘法 const multiply = createMathOperation((multiplier, multiplicand) => multiplier * multiplicand, 1) // 除法 const divide = createMathOperation((dividend, divisor) => dividend / divisor, 1)
可以發現,它們的實現方式都是一樣的,向 createMathOperation 傳遞一個函數,這個函數就是原生的加減乘除,所以主要的還是要看看 createMathOperation 是啥。
createMathOperation源碼注釋版
/** * Creates a function that performs a mathematical operation on two values. * * @private * @param {Function} operator The function to perform the operation. * @param {number} [defaultValue] The value used for `undefined` arguments. * @returns {Function} Returns the new mathematical operation function. */
從這個函數說明中可以看出,這個函數有兩個參數:
operator:原生四則運算函數
defaultValue:默認值,當未傳遞參數時返回的(原生計算中一般返回 NaN)
我們拿 add 來舉例。
const add = createMathOperation((augend, addend) => augend + addend, 0) const result = add(5, 3) console.log(result) // 8
首先是通過 createMathOperation 創建一個 add 函數,然后向其傳遞參與計算的值,也就是說 createMathOperation 應該是返回一個函數,并且有兩個參數。事實上就是這樣,返回值是一個 function(value, other),value 是被加數,other 是加數。
在進行加減乘除運算的時候,還需要考慮一點的就是參與計算的兩個值的數據類型,是字符串還是數字?或者是 undefined?這里的實現方法滿足以下幾個規則:
兩個值都為 undefined 時,返回 defaultValue
其中一個值為 undefined 時,返回另一個值
有一個值為字符串時,用 baseToString 將兩個值都轉換成 string 進行計算
其它情況,用 baseToNumber 將兩個值都轉換成 number 進行計算
undefined 和 null 在四則運算中的區別我注意到代碼中是判斷 value === undefined,是 ===,說明這里嚴格區分 undefined 和 null ,這是之前沒注意到的地方。這是為什么呢?
我拿原生的加減乘除做了個實驗:
console.log(1 + undefined) // NaN console.log(1 + null) // 1 console.log(1 - undefined) // NaN console.log(1 - null) // 1 console.log(1 * undefined) // NaN console.log(1 * null) // 0 console.log(1 / undefined) // NaN console.log(1 / null) // Infinity
undefined 參與計算的結果都是 NaN,null 參與計算是將它看作 0。
嗯,我們不一樣,每個人都有不同的境遇 ~
But,why?為啥我們不一樣?
我們知道 undefined 和 null 其中有一個區別是:
undefined 是定義了但是沒有賦值
null 是為定義
如果按照這個區別,應該把 undefined 當作 0 啊,但是結果貌似不是這樣,查查規范咯
在這就看得比較清楚了,ToNumber 運算符會將 undefined 轉換成 NaN,而將 null 轉換成 +0。
baseToString源碼注釋版
/** * The base implementation of `toString` which doesn"t convert nullish * values to empty strings. * * @private * @param {*} value The value to process. * @returns {string} Returns the string. */
規則:
如果 typeof 返回 string,則直接返回 value
如果是數組,則遞歸對數組中的每一項都執行 baseToString,直到不是數組為止,返回的是一個不含 [] 的字符串,相當于 [].join("") 的結果
如果 isSymbol 判斷為 true,則用 toString.call 來轉換
其它情況,就直接用模板字符串的方式返回字符串
對于 isSymbol,感覺還沒理解到位,先不展開說了。。。
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://m.specialneedsforspecialkids.com/yun/90035.html
摘要:原文首發于源碼講解這是我們閱讀源碼的第篇博客,在這篇文章里我們來學習一下的方法。好啦,關于函數暫時就先講到這里啦。與惡龍纏斗過久自身亦成為惡龍凝視深淵過久深淵將回以凝視。 原文首發于Lodash源碼講解 這是我們閱讀Lodash源碼的第2篇博客,在這篇文章里我們來學習一下Lodash的chunk方法。 chunk函數內部依賴其他的函數,依賴的函數如下所示; slice 按照慣例,我們先...
摘要:同時,這里會設置一個定時器,在等待后會執行,的主要作用就是觸發。最后,如果不再有函數調用,就會在定時器結束時執行。問題就出在對于定時器的控制上。 本文同步自我的Blog 前段時間團隊內部搞了一個代碼訓練營,大家組織在一起實現 lodash 的 throttle 和 debounce,實現起來覺得并不麻煩,但是最后和官方的一對比,發現功能的實現上還是有差距的,為了尋找我的問題,把官方源碼...
摘要:萬條數據依賴讀源碼之從看稀疏數組與密集數組原理的原理歸結起來就是切割和放置。尺在切割之前,需要用尺確定切割的數量。容器的長度剛好與塊的數量一致。當與塊的數量相等時,表示已經切割完畢,停止切割,最后將結果返回。 以不正義開始的事情,必須用罪惡使它鞏固?!勘葋啞尔溈税住? 最近很多事似乎印證了這句話,一句謊言最后要用一百句謊言來圓謊。 本文為讀 lodash 源碼的第二篇,后續文章會...
摘要:而這個秒就能理解的代碼片段,摒棄了許多不必要的代碼,只實現了最核心的部分,不像和那樣,考慮參數邊界值問題,例如,參數的類型是否符合預期等。使用根據斷言函數對數組進行過濾,返回條件為真值的對象。 之前翻譯過一篇文章,《我喜歡的5個編程技巧》,里面的一個技巧是借鑒一個網站的代碼片段,好奇的小手點下鏈接后,發現是一個有 47000 多star的倉庫,30-seconds-of-code。 倉...
摘要:今天要講的,是我從的源碼實現文件中學到的幾個很基礎,卻又容易被忽略的知識點。在函數式編程中,函數是一等公民,它可以只是根據參數,做簡單的組合操作,再作為別的函數的返回值。所以,閱讀源碼,是一種很棒的重溫基礎知識的方式。 showImg(https://segmentfault.com/img/bVbpTSY?w=750&h=422); 前言 上一篇文章 「前端面試題系列8」數組去重(1...
閱讀 2864·2021-09-27 13:35
閱讀 630·2021-09-23 11:22
閱讀 2901·2019-08-30 15:54
閱讀 1616·2019-08-29 16:27
閱讀 2474·2019-08-29 15:05
閱讀 2358·2019-08-23 18:11
閱讀 3528·2019-08-23 16:32
閱讀 2948·2019-08-23 14:56