lodash已死？radash庫方法介紹及源碼解析 —— 函數柯里化 + Number篇

来源:https://www.cnblogs.com/muqiqiang/p/18201248
-Advertisement-
Play Games

點贊 + 收藏 = 學會！ 本篇我們介紹radash中函數柯里化和Number 相關的方法使用和源碼解析。深入學習radash中的方法思想和底層實現。 ...


寫在前面

tips：點贊 + 收藏 = 學會！

  • 主頁有更多其他篇章的方法，歡迎訪問查看。
  • 本篇我們繼續介紹radash中函數柯里化和Number 相關的方法使用和源碼解析。

函數柯里化

chain：創建一個函數鏈並依次執行

  1. 使用說明
    1. 功能描述：用於創建一個函數鏈，該鏈依次執行一系列函數，每個函數的輸出都是下一個函數的輸入。這種模式常見於函數式編程，特別是在數據轉換和流水線處理中。
    2. 參數：函數數組（或者說任意數量的函數）。
    3. 返回值：返回一個新的函數。
  2. 使用代碼示例
    import { chain } from 'radash'

const add = (y: number) => (x: number) => x + y
const mult = (y: number) => (x: number) => x * y
const addFive = add(5)
const double = mult(2)

const chained = chain(addFive, double)

chained(0) // => 10
chained(7) // => 24
  3. 源碼解析
    // 定義一個名為 `chain` 的函數。
export function chain(
  // `funcs` 是一個由函數組成的數組，這些函數將會被依次執行。
  // 每個函數都可以接受任意參數，並返回任何類型的值。
  ...funcs: ((...args: any[]) => any)[]
) {
  // `chain` 函數返回一個新的函數，這個新函數接受任意參數。
  return (...args: any[]) => {
    // 使用 `funcs` 數組中的第一個函數和傳入的參數 `args` 來初始化累加器 `acc`。
    // 然後，使用 `reduce` 方法依次執行剩餘的函數。
    return funcs.slice(1).reduce(
      // 在每個迭代中，將前一個函數的返回值作為下一個函數的輸入。
      (acc, fn) => fn(acc),
      // 第一次迭代的初始值是 `funcs` 數組中第一個函數的執行結果。
      funcs[0](...args)
    )
  }
}
    • 方法流程說明：
      1. chain 函數接受任意數量的函數作為參數，並返回一個新的函數。
      2. 當新函數被調用時，它首先使用傳入的參數調用 funcs 數組中的第一個函數。
      3. 然後，它使用 reduce 方法依次執行 funcs 數組中剩餘的函數，每個函數的返回值都被傳遞給下一個函數。
      4. 最終，返回最後一個函數的執行結果。

compose：依次執行傳入的函數，每個函數的輸出作為下一個函數的輸入

  1. 使用說明
    1. 功能描述：接受一系列函數作為參數，並返回一個新的函數。這個新函數將從右到左依次執行傳入的函數，每個函數的輸出作為下一個函數的輸入。這是函數式編程中的組合（composition）模式。
    2. 參數：一系列函數（函數數組）。
    3. 返回值：一個新的函數。
  2. 使用代碼示例
    import { compose } from 'radash'

const useZero = (fn: any) => () => fn(0)
const objectize = (fn: any) => (num: any) => fn({ num })
const increment = (fn: any) => ({ num }: any) => fn({ num: num + 1 })
const returnArg = (arg: any) => (args: any) => args[arg]

const composed = compose(
  useZero,
  objectize,
  increment,
  increment,
  returnArg('num')
)

composed() // => 2
  3. 源碼解析
    // 定義一個名為 `compose` 的函數。
export function compose(
  // 使用展開運算符接收一個函數數組，每個函數可以接受任意參數並返回任何類型的值。
  ...funcs: ((...args: any[]) => any)[]
) {
  // `compose` 函數返回一個新的函數。
  return (...args: any[]) => {
    // 首先反轉 `funcs` 數組，因為我們需要從右到左執行函數。
    // 然後使用 `reduce` 方法來組合這些函數。
    return funcs.reverse().reduce((acc, fn) => {
      // 在每次迭代中，將上一個函數的返回值（acc）作為當前函數（fn）的參數。
      return fn(acc);
    }, args); // 初始值 `args` 是傳遞給組合函數的參數。
  };
}
    • 方法流程說明：
      1. 接受任意數量的函數作為參數。
      2. 返回一個新的函數，這個新函數接受任意參數。
      3. 當新函數被調用時，它首先反轉 funcs 數組，以確保函數能夠從右到左執行。
      4. 使用 reduce 方法應用每個函數，從最右邊的函數開始，每個函數的返回值都作為下一個函數的輸入。
      5. 最終，返回最左邊函數的執行結果。

debounce：函數防抖

  1. 使用說明
    1. 功能描述：創建一個防抖函數，該函數會在指定的延遲時間後執行。防抖（debouncing）是一種控制函數執行頻率的技術，它確保函數只在最後一次被調用後的一段時間後執行，通常用於處理像視窗調整大小或鍵盤輸入這樣的連續事件。
    2. 參數：配置對象（包含delay——延時）、需要防抖的函數。
    3. 返回值：返回防抖後的函數。
  2. 使用代碼示例
    import { debounce } from 'radash'

const makeSearchRequest = (event) => {
  api.movies.search(event.target.value)
}

input.addEventListener('change', debounce({ delay: 100 }, makeSearchRequest))
  3. 源碼解析
    // 定義一個泛型函數 `debounce`。
export const debounce = <TArgs extends any[]>(
  // 第一個參數是一個對象，包含 `delay` 屬性，它是函數延遲執行的毫秒數。
  { delay }: { delay: number },
  // 第二個參數 `func` 是需要被防抖的函數。
  func: (...args: TArgs) => any
) => {
  // 初始化一個變數 `timer` 用於保存 setTimeout 的返回值。
  let timer: NodeJS.Timeout | undefined = undefined
  // 初始化一個標誌變數 `active` 來控制函數是否應該執行。
  let active = true

  // 定義一個防抖後的函數 `debounced`。
  const debounced: DebounceFunction<TArgs> = (...args: TArgs) => {
    // 如果 `active` 是 `true`，則執行防抖邏輯。
    if (active) {
      // 清除之前的定時器（如果有的話）。
      clearTimeout(timer)
      // 設置一個新的定時器，延遲 `delay` 毫秒後執行 `func`。
      timer = setTimeout(() => {
        // 檢查 `active` 是否仍然是 `true`，如果是，則執行 `func`。
        active && func(...args)
        // 執行後，將 `timer` 設置為 `undefined`。
        timer = undefined
      }, delay)
    } else {
      // 如果 `active` 是 `false`，則立即執行 `func`，不使用防抖邏輯。
      func(...args)
    }
  }
  // 為 `debounced` 函數添加一個方法 `isPending`，用於檢查是否有等待執行的 `func`。
  debounced.isPending = () => {
    return timer !== undefined
  }
  // 為 `debounced` 函數添加一個方法 `cancel`，用於取消執行 `func`。
  debounced.cancel = () => {
    active = false
  }
  // 為 `debounced` 函數添加一個方法 `flush`，用於立即執行 `func`。
  debounced.flush = (...args: TArgs) => func(...args)

  // 返回防抖後的函數 `debounced`。
  return debounced
}
    • 方法流程說明：
      1. 接受一個包含延遲時間 delay 的對象和一個需要被防抖的函數 func 作為參數。
      2. 返回一個新的函數 debounced，這個函數在被連續調用時會取消之前的調用並重新計時。
      3. 如果在延遲時間 delay 內沒有再次被調用，func 將被執行。
      4. debounced 函數提供了三個額外的方法：isPending 檢查是否有等待執行的函數，cancel 取消等待執行的函數，flush 立即執行函數。
      5. 使用 debounce 函數可以幫助你控制函數的執行頻率，尤其是在處理頻繁觸發的事件時。

memo：創建一個記憶化（memoized）版本的給定函數

  1. 使用說明
    0. 功能描述：記憶化是一種優化技術，它存儲函數執行的結果，併在後續調用中重用這個結果，以避免重覆執行相同計算。這種技術特別適用於計算成本高昂或調用頻繁的函數。
    0. 參數：需要被記憶化的函數、可選配置對象。
    0. 返回值：返回一個記憶版本的函數。
  2. 使用代碼示例
    import { memo } from 'radash'

const timestamp = memo(() => Date.now())

const now = timestamp()
const later = timestamp()

now === later // => true
  3. 源碼解析
    // 定義一個泛型函數 `memo`。
export const memo = <TArgs extends any[], TResult>(
  // 第一個參數 `func` 是需要被記憶化的函數。
  func: (...args: TArgs) => TResult,
  // 第二個參數 `options` 是一個可選的配置對象。
  options: {
    // `key` 是一個可選的函數，用於根據函數的參數生成一個唯一的緩存鍵。
    key?: (...args: TArgs) => string
    // `ttl` 是一個可選的數字，表示緩存的生存時間（以毫秒為單位）。
    ttl?: number
  } = {} // 如果沒有提供 `options`，則使用一個空對象作為預設值。
) => {
  // `memo` 函數返回一個記憶化版本的 `func`。
  return memoize({}, func, options.key ?? null, options.ttl ?? null) as (
    // 返回的函數類型與原始 `func` 相同。
    ...args: TArgs
  ) => TResult
}
    • 方法流程說明：
      1. memo 函數接受一個函數 func 和一個可選的配置對象 options。
      2. options 對象包含兩個可選的屬性：key 和 ttl。key 是一個函數，用於生成緩存鍵；ttl 是緩存的生存時間。
      3. memo 函數調用 memoize 函數（在代碼片段中未定義）來創建一個記憶化版本的 func。memoize 函數接受一個緩存對象、原始函數 func、鍵生成函數 options.key 和生存時間 options.ttl。
      4. 如果沒有提供 options.key，則使用 null 作為預設值；如果沒有提供 options.ttl，也使用 null 作為預設值。
      5. memo 函數返回一個記憶化版本的 func，它的類型與原始 func 相同。

partial ：創建一個偏應用的部分函數（允許你預先填充一些參數，只需傳入剩餘參數）

  1. 使用說明
    1. 功能描述：創建一個新函數，這個新函數是原始函數 fn 的偏應用版本。偏應用（Partial Application）是一種函數式編程技術，它允許你預先填充一些參數，並返回一個新函數，這個新函數只需要剩餘的參數就可以執行。
    2. 參數：原始函數，原始參數數組。
    3. 返回值：返回一個接受剩餘的參數數組 rest的新函數。
  2. 使用代碼示例
    import { partial } from 'radash'

const add = (a: number, b: number) => a + b

const addFive = partial(add, 5)

addFive(2) // => 7
  3. 源碼解析
    // 定義一個泛型函數 `partial`。
export const partial = <T extends any[], TA extends Partial<T>, R>(
  // `fn` 是原始函數，它接受一個參數數組 `T` 並返回一個結果 `R`。
  fn: (...args: T) => R,
  // 使用展開運算符接收一個或多個預先填充的參數數組 `args`，其類型為 `TA`。
  // `TA` 是原始參數數組 `T` 的部分類型。
  ...args: TA
) => {
  // `partial` 函數返回一個新函數，這個新函數接受剩餘的參數數組 `rest`。
  return (...rest: RemoveItemsInFront<T, TA>) =>
    // 新函數調用原始函數 `fn`，首先展開預先填充的參數 `args`，然後展開剩餘的參數 `rest`。
    // 使用類型斷言 `as T` 確保參數數組的類型正確。
    fn(...([...args, ...rest] as T))
}
    • 這段代碼中使用了幾個未定義的函數和類型，如 tryit、list、fork 和 sort，以及類型 WorkItemResult<K>。我們可以假設這些函數和類型具有以下功能：
      1. partial 函數接受一個原始函數 fn 和一系列預先填充的參數 args。
      2. 返回一個新函數，這個新函數接受剩餘的參數 rest。
      3. 當新函數被調用時，它將預先填充的參數 args 和剩餘的參數 rest 合併成一個完整的參數數組，並調用原始函數 fn。
      4. 原始函數 fn 被執行，並返回結果。
      5. 類型 RemoveItemsInFront<T, TA> 是一個類型操作，它從類型 T 中移除與 TA 對應的項。它在這段代碼中沒有定義，我們可以假設它的作用是確保 rest 參數只包含原始函數 fn 還需要的參數。

partob：創建一個偏應用的部分函數（跟partial類似，不過接收參數不一樣）

  1. 使用說明
    1. 功能描述：創建一個新的函數，該函數是原始函數 fn 的偏應用版本。這個新函數將接受一個對象參數 restobj，它包含了原始函數 fn 所需參數的剩餘部分，然後將 restobj 與預先填充的參數對象 argobj 合併後調用 fn。
    2. 參數：原始函數、預先填充的參數對象。
    3. 返回值：返回一個接收剩餘參數對象 restobj的新函數。
  2. 使用代碼示例
    import { partob } from 'radash'

const add = (props: { a: number; b: number }) => props.a + props.b

const addFive = partob(add, { a: 5 })

addFive({ b: 2 }) // => 7
  3. 源碼解析
    // 定義一個泛型函數 `partob`。
export const partob = <T, K, PartialArgs extends Partial<T>>(
  // `fn` 是原始函數，它接受一個類型為 `T` 的參數對象，並返回一個類型為 `K` 的結果。
  fn: (args: T) => K,
  // `argobj` 是一個預先填充的參數對象，其類型為 `PartialArgs`，它是原始參數對象 `T` 的部分類型。
  argobj: PartialArgs
) => {
  // `partob` 函數返回一個新的函數，該函數接受一個類型為 `Omit<T, keyof PartialArgs>` 的參數對象 `restobj`。
  // `Omit<T, keyof PartialArgs>` 表示從 `T` 中省略掉 `PartialArgs` 中已有的鍵，只保留剩餘的鍵。
  return (restobj: Omit<T, keyof PartialArgs>): K =>
    // 新函數調用原始函數 `fn`，傳入合併後的參數對象。
    fn({
      // 使用展開運算符將 `argobj` 和 `restobj` 合併為一個新對象。
      // 這裡的類型斷言確保合併後的對象符合原始參數對象 `T` 的類型。
      ...(argobj as Partial<T>),
      ...(restobj as Partial<T>)
    } as T)
}
    • 方法流程說明：
      1. partob 函數接受一個原始函數 fn 和預先填充的參數對象 argobj。
      2. 返回一個新的函數，該函數接受剩餘參數對象 restobj。
      3. 當新函數被調用時，它將預先填充的參數對象 argobj 和剩餘參數對象 restobj 合併成一個完整的參數對象，並調用原始函數 fn。
      4. 原始函數 fn 被執行，並返回結果。

proxied：創建動態代理對象

  1. 使用說明
    1. 功能描述：創建的代理對象可以攔截對其屬性的訪問並返回由一個處理函數 handler 產生的值。
    2. 參數：處理函數（該函數接受一個屬性名）。
    3. 返回值：返回一個新的 Proxy 對象。
  2. 使用代碼示例
    import { proxied } from 'radash'

type Property = 'name' | 'size' | 'getLocation'

const person = proxied((prop: Property) => {
  switch (prop) {
    case 'name':
      return 'Joe'
    case 'size':
      return 20
    case 'getLocation'
      return () => 'here'
  }
})

person.name // => Joe
person.size // => 20
person.getLocation() // => here
  3. 源碼解析
    // 定義一個泛型函數 `proxied`。
export const proxied = <T, K>(
  // `handler` 是一個函數，接受一個屬性名 `propertyName` 並返回一個類型為 `K` 的值。
  handler: (propertyName: T) => K
): Record<string, K> => {
  // 返回一個新的 Proxy 對象。
  return new Proxy(
    // 第一個參數是要代理的目標對象，這裡是一個空對象。
    {},
    // 第二個參數是一個處理器對象，它定義了多種攔截操作的方法。
    {
      // `get` 方法用於攔截對屬性的讀取操作。
      get: (target, propertyName: any) =>
        // 當嘗試讀取屬性時，調用 `handler` 函數並傳入屬性名。
        // 返回 `handler` 函數的結果作為屬性的值。
        handler(propertyName)
    }
  )
}
    • 方法流程說明：
      1. proxied 函數接受一個 handler 函數作為參數。
      2. 使用 new Proxy() 創建一個新的 Proxy 對象，它代理一個空對象。
      3. 定義 Proxy 對象的 get 方法，用於攔截對代理對象屬性的讀取操作。
      4. 當嘗試讀取任何屬性時，get 方法調用 handler 函數，傳入被讀取的屬性名稱。
      5. handler 函數返回的值作為屬性的值返回給調用者。
      6. 返回創建的 Proxy 對象，它的類型為 Record<string, K>，表示一個對象，其屬性名為字元串，屬性值的類型為 K。

throttle ：函數節流

  1. 使用說明
    1. 功能描述：節流（Throttling）是一種控制函數調用頻率的技術，它確保函數在指定的時間間隔內最多只執行一次。這通常用於限制頻繁觸發的事件（如視窗調整大小、滾動等）的處理函數。
    2. 參數：對象（{interval}）—— 觸發間隔、需要節流的函數。
    3. 返回值：返回節流後的函數。
  2. 使用代碼示例
    import { throttle } from 'radash'

const onMouseMove = () => {
  rerender()
}

addEventListener('mousemove', throttle({ interval: 200 }, onMouseMove))
  3. 源碼解析
    // 定義一個泛型函數 `throttle`。
export const throttle = <TArgs extends any[]>(
  // 第一個參數是一個對象，包含 `interval` 屬性，它是函數執行之間的毫秒間隔。
  { interval }: { interval: number },
  // 第二個參數 `func` 是需要被節流的函數。
  func: (...args: TArgs) => any
) => {
  // 初始化一個標誌變數 `ready`，表示函數是否準備好執行。
  let ready = true
  // 初始化一個變數 `timer` 用於保存 setTimeout 的返回值。
  let timer: NodeJS.Timeout | undefined = undefined

  // 定義一個節流後的函數 `throttled`。
  const throttled: ThrottledFunction<TArgs> = (...args: TArgs) => {
    // 如果函數尚未準備好執行，直接返回。
    if (!ready) return
    // 調用 `func` 並傳入參數。
    func(...args)
    // 設置 `ready` 為 `false`，防止函數在間隔時間內再次執行。
    ready = false
    // 設置一個定時器，在 `interval` 毫秒後將 `ready` 重新設為 `true`，允許函數再次執行。
    timer = setTimeout(() => {
      ready = true
      // 定時器執行完畢後，清除 `timer`。
      timer = undefined
    }, interval)
  }
  
  // 為 `throttled` 函數添加一個方法 `isThrottled`，用於檢查函數是否處於節流狀態。
  throttled.isThrottled = () => {
    return timer !== undefined
  }
  
  // 返回節流後的函數 `throttled`。
  return throttled
}
    • 方法流程說明：
      1. throttle 函數接受一個配置對象（包含 interval 屬性）和一個需要被節流的函數 func 作為參數。
      2. 返回一個新的函數 throttled，該函數在被連續調用時會限制函數的執行頻率。
      3. 當 throttled 函數被調用時，如果 ready 是 true（即函數準備好執行），func 將被執行。
      4. 執行 func 後，ready 設置為 false，並通過 setTimeout 設置一個定時器，定時器在 interval 毫秒後執行，將 ready 設置回 true。
      5. 如果 throttled 函數在定時器完成之前再次被調用，由於 ready 是 false，func 不會被執行。
      6. throttled 函數提供了一個額外的方法 isThrottled，用於檢查函數是否正在等待下一次執行的間隔。

Number相關

inRange ：檢查給定數字是否在兩個數字之間

  1. 使用說明
    1. 功能描述：檢查給定數字是否在兩個數字之間。判斷包含起始值。不包含結束值。範圍的開始和結束可以是升序或降序。如果未指定結束值，則將其設置為起始值。並且把起始值設置為0。
    2. 參數：需要檢查的值，判斷的起始值，[判斷的結束值]。
    3. 返回值：在範圍內返回 true，否則返回 false。
  2. 使用代碼示例
    import { inRange } from 'radash'

inRange(10, 0, 20) // true
inRange(9.99, 0, 10) // true
inRange(Math.PI, 0, 3.15) // true
inRange(10, 10, 20) // true
inRange(10, 0, 10) // false

inRange(1, 2) // true
inRange(1, 0) // false
  3. 源碼解析
    // 定義一個名為 `inRange` 的函數。
function inRange(number, start, end) {
    // 首先檢查傳入的參數類型是否正確：`number` 和 `start` 必須是數字類型，
    // `end` 要麼是未定義，要麼是數字類型。
    const isTypeSafe = typeof number === "number" && typeof start === "number" && (typeof end === "undefined" || typeof end === "number");
    // 如果參數類型不正確，直接返回 `false`。
    if (!isTypeSafe) {
      return false;
    }

    // 如果 `end` 參數未提供（即 `undefined`），則將 `end` 設置為 `start` 的值，
    // 而將 `start` 設置為 `0`。這樣就創建了一個從 `0` 到 `start` 的範圍。
    if (typeof end === "undefined") {
      end = start;
      start = 0;
    }

    // 檢查 `number` 是否在 `start` 和 `end` 指定的範圍內。
    // 使用 `Math.min` 和 `Math.max` 來確保 `start` 和 `end` 的順序正確，
    // 即使它們被反向提供（例如 `end` 小於 `start`）。
    return number >= Math.min(start, end) && number < Math.max(start, end);
}
    • 方法流程說明：
      1. 首先驗證所有參數的類型。如果 number 或 start 不是數字，或者 end 不是數字且不是 undefined，函數返回 false。
      2. 如果 end 參數未定義，函數將其解釋為只提供了一個參數的情況，即一個從 0 到 start 的範圍。
      3. 函數計算 number 是否大於等於範圍的最小值（Math.min(start, end)）並且小於範圍的最大值（Math.max(start, end)）。
      4. 如果 number 在這個範圍內，函數返回 true；否則返回 false。

toFloat ：可能的情況下，將一個值轉為浮點值

  1. 使用說明
    1. 功能描述：將一個值轉換為浮點數。如果轉換失敗或者提供的值是 null 或 undefined，函數將返回預設值。
    2. 參數：需要轉換的值、預設值。
    3. 返回值：能轉換則返迴轉換後的浮點數，否則返回傳入的預設值。
  2. 使用代碼示例
    import { toFloat } from 'radash'

toFloat(0) // => 0.0
toFloat(null) // => 0.0
toFloat(null, 3.33) // => 3.33
  3. 源碼解析
    // 定義一個名為 `toFloat` 的函數。
const toFloat = (value, defaultValue) => {
  // 如果沒有提供 `defaultValue`，則使用 `0` 作為預設值。
  // `void 0` 是 `undefined` 的一種安全寫法。
  const def = defaultValue === void 0 ? 0 : defaultValue;

  // 如果 `value` 是 `null` 或 `undefined`，返回預設值 `def`。
  if (value === null || value === void 0) {
    return def;
  }

  // 嘗試將 `value` 轉換為浮點數。
  const result = parseFloat(value);

  // 如果轉換結果是 `NaN`（Not-a-Number），返回預設值 `def`。
  // 否則，返迴轉換後的浮點數 `result`。
  return isNaN(result) ? def : result;
};
    • 方法流程說明：
      1. 首先檢查 defaultValue 是否提供，如果沒有提供，則將 def 設置為 0。
      2. 檢查 value 是否是 null 或 undefined，如果是，返回 def。
      3. 使用 parseFloat 函數嘗試將 value 轉換為浮點數。
      4. 使用 isNaN 函數檢查轉換結果是否為 NaN。
      5. 如果結果是 NaN，返回 def；如果轉換成功，返回浮點數結果 result。

toInt：可能的情況下，將一個值轉為整數

  1. 使用說明
    1. 功能描述：將一個值轉換為整數。如果轉換失敗或者提供的值是 null 或 undefined，函數將返回預設值。
    2. 參數：需要轉換的值、預設值。
    3. 返回值：能轉換則返迴轉換後的整數，否則返回傳入的預設值。
  2. 使用代碼示例
    import { toInt } from 'radash'

toInt(0) // => 0
toInt(null) // => 0
toInt(null, 3) // => 3
  3. 源碼解析
    // 定義一個名為 `toFloat` 的函數。
const toFloat = (value, defaultValue) => {
  // 如果沒有提供 `defaultValue`，則使用 `0` 作為預設值。
  // `void 0` 是 `undefined` 的一種安全寫法。
  const def = defaultValue === void 0 ? 0 : defaultValue;

  // 如果 `value` 是 `null` 或 `undefined`，返回預設值 `def`。
  if (value === null || value === void 0) {
    return def;
  }

  // 嘗試將 `value` 轉換為浮點數。
  const result = parseFloat(value);

  // 如果轉換結果是 `NaN`（Not-a-Number），返回預設值 `def`。
  // 否則，返迴轉換後的浮點數 `result`。
  return isNaN(result) ? def : result;
};
    • 方法流程說明：
      1. 首先檢查 defaultValue 是否提供，如果沒有提供，則將 def 設置為 0。
      2. 檢查 value 是否是 null 或 undefined，如果是，返回 def。
      3. 使用 parseFloat 函數嘗試將 value 轉換為浮點數。
      4. 使用 isNaN 函數檢查轉換結果是否為 NaN。
      5. 如果結果是 NaN，返回 def；如果轉換成功，返回浮點數結果 result。

寫在後面

  • 老實說能看到這裡的人呢，都是美麗帥氣有眼光又多金的人才，感謝閱讀到最後，Peace and Love！
  • 後續我們會繼續分享 Radash 庫中其他方法的使用和源碼解析。
  • 大家有任何問題或見解，歡迎評論區留言交流和批評指正！！！
  • 你的每一個點贊和收藏都是作者寫作的動力！！！（求個點贊《《小聲逼逼》》）
  • 點擊訪問：radash官網

您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • MySQL的索引優化
    哪些場景下MySQL會使用索引查詢數據，哪些場景下MySQL不會使用索引查詢數據，以及如何使用索引提示來告知查詢優化器使用索引、忽略索引和強制索引索引。 ...
  • MySQL 8.0 Reference Manual（讀書筆記51節--Optimizing Subqueries, Derived Tables, View References, and Common Table Expressions(1)）
    本文首發於公眾號：Hunter後端 原文鏈接：MySQL面試必備三之事務 這一篇筆記介紹一下 MySQL 的事務，面試中常被問到關於事務的幾個問題如下： 事務是什麼 為什麼需要事務，事務有什麼作用 事務的特點 事務可能帶來哪些問題 事務有哪些隔離級別，這些隔離級別都可以解決哪些問題 可重覆讀隔離級別 ...
  • 推薦系統：精排多目標融合與超參數學習方法
    粗排/精排的個性化多任務學習模型，能預估20多個不同的預估值，如點擊率、有效播放率、播放時長、點贊率、關註率等，那如何用它來排序呢？從多任務學習到多目標排序，中間有一個過渡，即如何把這些預估值融合成一個單一的排序分，最後實現多目標精排。這也就引入了本文要介紹的正題：多目標融合（multi-task ... ...
  • MySQL 8.0 Reference Manual（讀書筆記50節--Optimizing SELECT Statements(5)）
    通過詳細的查詢 SQL 語句分析，深入挖掘潛在的性能瓶頸，結合資料庫架構、索引優化以及查詢執行計劃等方面，提出針對性的優化建議，以提升查詢性能和系統效率。 ...
  • 鴻蒙HarmonyOS實戰-Stage模型（開發卡片事件）
    一、開發卡片事件 HarmonyOS元服務卡片頁面（Metaservice Card Page）是指在HarmonyOS系統中，用於展示元服務的頁面界面。元服務是指一組提供特定功能或服務的組件，例如天氣服務、音樂播放服務等。元服務卡片頁面可以顯示元服務的相關信息和操作選項，用戶可以通過點擊卡片頁 ...
  • 鴻蒙HarmonyOS實戰-Stage模型（開發卡片頁面）
    一、開發卡片頁面 HarmonyOS元服務卡片頁面（Metaservice Card Page）是指在HarmonyOS系統中，用於展示元服務的頁面界面。元服務是指一組提供特定功能或服務的組件，例如天氣服務、音樂播放服務等。元服務卡片頁面可以顯示元服務的相關信息和操作選項，用戶可以通過點擊卡片頁 ...
  • 鴻蒙HarmonyOS實戰-Stage模型（服務卡片的模塊和創建）
    一、服務卡片的模塊和創建 在HarmonyOS中，服務卡片是一種提供即時信息和快速操作的小組件，類似於Android中的通知欄。服務卡片可以顯示各種類型的信息，包括通知、天氣、日曆事件、音樂播放器、快捷方式等。用戶可以根據自己的需求配置服務卡片，並通過輕掃或點擊來查看詳細信息或執行操作。此外，服 ...
  • TypeScript入門介紹
    一、是什麼 單點登錄（Single Sign On），簡稱為 SSO，是目前比較流行的企業業務整合的解決方案之一 SSO的定義是在多個應用系統中，用戶只需要登錄一次就可以訪問所有相互信任的應用系統 SSO 一般都需要一個獨立的認證中心（passport），子系統的登錄均得通過passport，子系統 ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發（一）：使用.NET MAUI開發第一個安卓APP
    移動開發（一）：使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說，近來想嘗試開發一款安卓APP，考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP，畢竟是使用Visual Studio開發工具，使用起來也比較的順手，結合微軟官方的教程進行了安卓 ...
  • wpf ToggleButton選中效果和一個登錄界面
    前言 QuestPDF 是一個開源 .NET 庫，用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫，它徹底改變了我們生成 PDF 文檔的方 ...
  • 彈幕樹洞項目功能新增篇
    項目地址 項目後端地址： https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址： ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址： http://tree ...
  • 第27篇 sqlserver2022詳細安裝步驟
    話不多說，直接開乾 一.下載 1.官方鏈接下載： https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe，運行開始下載SQL server； 二. ...
  • .NET 開源高性能 MQTT 類庫
    前言 隨著物聯網（IoT）技術的迅猛發展，MQTT（消息隊列遙測傳輸）協議憑藉其輕量級和高效性，已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫，為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog文檔翻譯系列（六） - 可用的接收器、增強器、格式化輸出
    Serilog支持多種接收器用於日誌存儲，增強器用於添加屬性，LogContext管理動態屬性，支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項，適用於不同需求。 ...
  • 警惕 Visual Studio 屬性求值副作用導致邏輯不符合預期
    目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據，爬取信息時需要模擬瀏覽器行為，否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下： 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • [使用目前最新版]HybridCLR6.9.0+YooAsset2.2.4實現純C# Unity熱更新方案 (一)
    1.前言 什麼是熱更新 游戲或者軟體更新時，無需重新下載客戶端進行安裝，而是在應用程式啟動的情況下，在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR，Xlua，ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles，Addressable， ...
  • 在 ASP.NET Core Web API 中使用操作篩選器統一處理通用操作
    本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺，其實像阿裡雲，騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後，它會送 ...
  • 第28篇 如何.net中實現高效可靠數據同步api
    通過以下方式可以高效，並保證數據同步的可靠性 1.API設計 使用RESTful設計，確保API端點明確，並使用適當的HTTP方法（如POST用於創建，PUT用於更新）。 設計清晰的請求和響應模型，以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證，確保接收到的數據符合預期格 ...
所有分類