lodash裡to系列之將資料轉換成數字型別實現示例詳解

導讀	這篇文章主要為大家介紹了lodash裡to系列之將資料轉換成數字型別實現示例詳解，有需要的朋友可以借鑑參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪

在lodash裡的to系列裡，將目標資料轉換為數字型別的資料的方法，包括了toNumber方法、toFinit方法、toInteger方法，toSafeInteger方法，下面來看看各個方法的使用和實現。

toNumber方法主要是將引數value轉換為一個數字型別。

使用如下：

toNumber(3.2)
// => 3.2
toNumber(Number.MIN_VALUE)
// => 5e-324
toNumber(Infinity)
// => Infinity
toNumber('3.2')
 // => 3.2

toNumber方法在實現上藉助了內部封裝的is系列方法，主要是isObject方法和isSymbol方法。

實現上藉助typeof，具體處理如下：

• 對於資料型別直接返回引數。
• 對於symbol型別直接返回NaN。
• 對於物件型別，分兩種情況處理。
• 如果引數原型鏈上存在valueOf方法，直接呼叫其返回結果供後續處理。
• 如果引數原型鏈上不存在valueOf方法，直接轉換成字串型別供後續處理。
• 對於非字串型別的，呼叫隱式轉換。
• 對於其他型別的，會進行正則匹配處理資料格式，reTrim是去除空格，reIsBadHex是去除十六進位制，reIsBinary是去除二進位制，reIsOctal是去除八進位制。
• 對於二進位制和八進位制的字串會呼叫原生的parseInt方法將引數轉換為相應的進位制數。而對於十六進位制則返回NaN，否則呼叫隱式轉換。

原始碼如下：

import isObject from './isObject.js'
import isSymbol from './isSymbol.js'
const NAN = 0 / 0
const reTrim = /^\s+|\s+$/g
const reIsBadHex = /^[-+]0x[0-9a-f]+$/i
const reIsBinary = /^0b[01]+$/i
const reIsOctal = /^0o[0-7]+$/i
const freeParseInt = parseInt
function toNumber(value) {
  if (typeof value === 'number') {
    return value
  }
  if (isSymbol(value)) {
    return NAN
  }
  if (isObject(value)) {
    const other = typeof value.valueOf === 'function' ? value.valueOf() : value
    value = isObject(other) ? `${other}` : other
  }
  if (typeof value !== 'string') {
    return value === 0 ? value : +value
  }
  value = value.replace(reTrim, '')
  const isBinary = reIsBinary.test(value)
  return (isBinary || reIsOctal.test(value))
    ? freeParseInt(value.slice(2), isBinary ? 2 : 8)
    : (reIsBadHex.test(value) ? NAN : +value)
}

toFinit方法主要是將引數value轉換為一個有限的數字。

使用如下：

toFinite(3.2)
// => 3.2
toFinite(Number.MIN_VALUE)
// => 5e-324
toFinite(Infinity)
// => 1.7976931348623157e+308
toFinite('3.2')
// => 3.2

toFinit方法實現上藉助toNumber方法，具體處理如下：

對於不存在的引數會直接返回引數，0的話返回0。

其次呼叫toNumber方法轉換引數，再透過if判斷匹配INFINITY值，將其返回對應的MAX_INTEGER。

原始碼如下：

import toNumber from './toNumber.js'
const INFINITY = 1 / 0
const MAX_INTEGER = 1.7976931348623157e+308
function toFinite(value) {
  if (!value) {
    return value === 0 ? value : 0
  }
  value = toNumber(value)
  if (value === INFINITY || value === -INFINITY) {
    const sign = (value < 0 ? -1 : 1)
    return sign * MAX_INTEGER
  }
  return value === value ? value : 0
}

toInteger方法主要是將引數value轉換為一個整數。

使用如下：

toInteger(3.2)
// => 3
toInteger(Number.MIN_VALUE)
// => 0
toInteger(Infinity)
// => 1.7976931348623157e+308
toInteger('3.2')
// => 3

實現上藉助toFinite方法，首先呼叫toInteger方法將引數轉換為有限的值，然後透過取模操作獲取小數部分，然後取差值。

原始碼如下：

import toFinite from './toFinite.js'
function toInteger(value) {
  const result = toFinite(value)
  const remainder = result % 1
  return remainder ? result - remainder : result
}
export default toInteger

toSafeInteger方法主要是將引數value轉換為安全整數，安全整數可以用於比較和準確的表示。

使用如下：

toSafeInteger(3.2)
// => 3
toSafeInteger(Number.MIN_VALUE)
// => 0
toSafeInteger(Infinity)
// => 9007199254740991
toSafeInteger('3.2')
// => 3

toSafeInteger方法在實現上主要透過toInteger方法，同樣的，對於不存在的引數直接返回引數，而0則返回0。對於小於最小安全數MAX_SAFE_INTEGER則返回MAX_SAFE_INTEGER，值都將限制在[-MAX_SAFE_INTEGER,MAX_SAFE_INTEGER]的區間。

原始碼如下：

import toInteger from './toInteger.js'
const MAX_SAFE_INTEGER = 9007199254740991
function toSafeInteger(value) {
  if (!value) {
    return value === 0 ? value : 0
  }
  value = toInteger(value)
  if (value < -MAX_SAFE_INTEGER) {
    return -MAX_SAFE_INTEGER
  }
  if (value > MAX_SAFE_INTEGER) {
    return MAX_SAFE_INTEGER
  }
  return value
}
export default toSafeInteger

本篇章我們瞭解了toNumber、toFinit、toInteger以及toSafeInteger四個方法，在實現上依次藉助呼叫實現。

toNumber方法是其他方法的核心，其他方法是toNumber方法的擴充。toNumber方法的核心是isObject和isSymbol兩個判斷方法。

原文來自：