东莞做网站要多少钱,上海人才网官网站首页,天律网站建设,陕西安康网站建设前言#xff1a;lodash是一款前端必须要知道的js库#xff0c;它里面提供了许多常用的功能和实用的工具函数 基本上我参与的项目中都有lodash#xff0c;只能说lodash太强大了#xff0c;lodash.js 提供了超过 300 个实用的工具函数#xff0c;涵盖了很多常见的编程任务 l… 前言lodash是一款前端必须要知道的js库它里面提供了许多常用的功能和实用的工具函数 基本上我参与的项目中都有lodash只能说lodash太强大了lodash.js 提供了超过 300 个实用的工具函数涵盖了很多常见的编程任务 lodash中文文档lodash中文文档请戳这里
本文只讲一些常用的功能以代码示例说明。最好的方法就是直接去看中文文档文档上的示例也是非常好理解的。
1、安装
npm i --save lodash2、全局引入或直接引入 1、全局引入在main.js中
// 全局引入lodash
import _ from lodash
Vue.prototype._ _2、直接引入
import { cloneDeep } from lodash3、功能 1、深拷贝对象或数组
import { cloneDeep} from lodash;
1、数组深拷贝
this.newArr cloneDeep(this.oldArr),
2、对象深拷贝let obj cloneDeep(Object.assign(this.formData, this.form))// Object.assign 是 JavaScript 中一个常见的浅拷贝函数它用于将多个对象合并成一个对象。loneDeep 函数只能对单个对象进行深拷贝而不能同时对多个对象进行深拷贝。因此为了将多个对象合并成一个新对象并对其进行深拷贝需要先使用 Object.assign 将这些对象合并成一个新对象然后再将这个新对象传递给 cloneDeep 函数进行深拷贝2、四舍五入数字
import { round } from lodash;
changeCurrency(row){
//保留两位小数参数1要四舍五入的数字参数2四舍五入的精度
this.$set(row, currency, round(row.currency, 2))
}3、防抖动
mounted() {// 函数防抖this.getSearchquery this._.debounce(this.getSearchquery, 300)},4、对数组进行排序
import { orderBy} from lodash;
//以createBy字段进行降序排序不指定第三个参数的值默认为升序排序
this.newArr orderBy(this.oldArr,createBy,desc)还有一些比较常用的如
数组操作
chunk将数组拆分为指定大小的小块。
compact去除数组中的假值false、null、0、、undefined 和 NaN。集合操作
map对集合中的每个元素执行相同的操作并返回结果数组。
filter根据指定条件过滤集合中的元素并返回符合条件的元素数组。
reduce对集合中的元素进行累积计算并返回最终结果。函数操作
debounce防抖函数延迟执行函数直到一定时间内没有连续调用。
throttle节流函数在一定时间内只允许函数执行一次。对象操作
assign将源对象的属性复制到目标对象。
pick从对象中选择指定的属性创建一个新对象。
omit从对象中排除指定的属性创建一个新对象。字符串操作
capitalize将字符串的首字母转为大写。
trim去除字符串两端的空格。
