当前位置：首页 > news >正文

js 之 lodash函数库的下载与基础使用

news 来源：原创 2025/5/17 12:58:22

什么是lodash

Lodash是一个流行的JavaScript实用工具库，提供了许多高效、高兼容性的工具函数，能够方便地处理集合、字符串、数值、函数等多种数据类型，大大提高工作效率。

lodsh的安装

$ npm i -g npm
$ npm i --save lodash

lodash的引入

// 引入整个lodash库，体积大：

// 方式1：引入整个lodash对象
import _ from "lodash";
// 方式2：按名称引入特定的函数
import { cloneDeep } from "lodash";
 

//按需引入，减小体积：

// 1.只引入cloneDeep函数
import cloneDeep from "lodash/cloneDeep";
// 2.使用lodash-es
import { cloneDeep } from "lodash-es";

lodash函数库中的所有函数详情见官方文档：

Lodash Documentation

示例：

import React, { useState } from 'react'
import _ from 'lodash'

const App = () => {
  const handleTabChange = (type) => {
    console.log(type)
    setType(type)
    // 基于列表的排序
    if (type === 'hot') {
      // 最热 => 喜欢点赞数量降序
      // lodash函数库,desc降序排序
      setCommentList(_.orderBy(commentList, ['like'], ['desc']))
    } else {
      // 最新 => 创建时间降序
      // lodash函数库,desc降序排序
      setCommentList(_.orderBy(commentList, ['ctime'], ['desc']))
    }
  }


  return (
    <div className="app">
       ......
    </div>
  )
}

export default App