vue中xe-utils的强大

每当遇到一个新需求，新问题，都想找到最新最棒的技术…

//引入前端计算工具类
import XEUtils from 'xe-utils'
//案例：
let amountNoTax = 0
let amount = 0
const salesResult = [1,2,3,4,5,6,7.9,8]
for (let i = 0; i < salesResult.length; i++) {amountNoTax = XEUtils.sum([amountNoTax, salesResult[i]])
//amount = XEUtils.sum([amount, salesResult[i]])
}
//结果：amountNoTax=36.9

其他的自己测，多动手，会更深刻些

//常用的函数
基础函数
isNaN (val) 判断是否非数值
isFinite (val) 判断是否为有限数值
isUndefined (val) 判断 Undefined
isArray (val) 判断是否数组
isFloat (val) 判断是否小数
isInteger (val) 判断是否整数
isBoolean (val) 判断是否 Boolean 对象
isString (val) 判断是否 String 对象
isNumber (val) 判断是否 Number 对象
isRegExp (val) 判断是否 RegExp 对象
isObject (val) 判断是否 Object 对象
isPlainObject (val) 判断是否是一个对象
isDate (val) 判断是否 Date 对象
isError (val) 判断是否 Error 对象
isTypeError (val) 判断是否 TypeError 对象
isEmpty (val) 判断是否为空,包括空对象、空数值、空字符串
isNull (val) 判断是否为 Null
isSymbol (val) 判断是否 Symbol 对象
isArguments (val) 判断是否 Arguments 对象
isElement (val) 判断是否 Element 对象
isDocument (val) 判断是否 Document 对象
isWindow (val) 判断是否 Window 对象
isFormData (val) 判断是否 FormData 对象
isMap (val) 判断是否 Map 对象
isWeakMap (val) 判断是否 WeakMap 对象
isSet (val) 判断是否 Set 对象
isWeakSet (val) 判断是否 WeakSet 对象
isLeapYear (date) 判断是否闰年
isEqual (obj1, obj2) 深度比较两个对象之间的值是否相等
isDateSame (date1, date2, format) 判断两个日期是否相同
常用函数toNumber ( num ) 转数值
toInteger ( num ) 转整数
toFixedNumber ( num, digits ) 和 Number.toFixed 类似，区别就是不会对小数进行四舍五入，结果返回数值
toFixedString ( num, digits ) 和 Number.toFixed 类似，区别就是不会对小数进行四舍五入，结果返回字符串
toArray ( array ) 将对象或者伪数组转为新数组
toStringJSON (str) 字符串转 JSON
toJSONString (obj) JSON 转字符串
getType (obj) 获取对象类型
getSize ( obj ) 返回对象的长度
uniqueId ( prefix ) 获取一个全局唯一标识
uniq ( array ) 数组去重
union ( ...array ) 将多个数的值返回唯一的并集数组
random ( min, max ) 获取一个指定范围内随机数
range ( start, stop, step ) 序号列表生成函数
clear (obj[, defs, assigns]) 清空对象; defs如果不传（清空所有属性）、如果传对象（清空并继承)、如果传值(给所有赋值)
remove (obj, iteratee) 移除对象属性
assign (destination, ...sources) 浅拷贝一个或者多个对象到目标对象中，如果第一值是true，则使用深拷贝
clone (obj, deep) 浅拷贝/深拷贝
destructuring (obj, ...target) 将一个或者多个对象值解构到目标对象
trim ( str ) 去除字符串左右两边的空格
trimLeft ( str ) 去除字符串左边的空格
trimRight ( str ) 去除字符串右边的空格
escape ( str ) 转义HTML字符串，替换&, <, >, ", ', `字符
unescape ( str ) 反转 escape
camelCase ( str ) 将带驼峰字符串转成字符串
kebabCase ( str ) 将字符串转成驼峰字符串
repeat ( str, count ) 将字符串重复 n 次
padStart ( str, targetLength, padString ) 用指定字符从前面开始补全字符串
padEnd ( str, targetLength [, padString] ) 用指定字符从后面开始补全字符串
startsWith ( str, val [, startIndex] ) 判断字符串是否在源字符串的头部
endsWith ( str, val [, startIndex] ) 判断字符串是否在源字符串的尾部
slice ( array, start, end ) 裁剪 Arguments 或数组 array，从 start 位置开始到 end 结束，但不包括 end 本身的位置
indexOf (obj, val) 返回对象第一个索引值
findIndexOf (obj, iteratee [, context]) 返回对象第一个索引值
lastIndexOf (obj, val) 从最后开始的索引值,返回对象第一个索引值
findLastIndexOf (obj, iteratee [, context]) 从最后开始的索引值，返回对象第一个索引值
includes (obj, val) 判断对象是否包含该值,成功返回 true 否则 false
includeArrays (array1, array2) 判断数组是否包含另一数组
each ( obj, iteratee [, context] ) 通用迭代器
arrayEach ( obj, iteratee [, context] ) 数组迭代器
objectEach ( obj, iteratee [, context] ) 对象迭代器
lastEach ( obj, iteratee [, context] ) 通用迭代器，从最后开始迭代
lastArrayEach ( obj, iteratee [, context] ) 数组迭代器，从最后开始迭代
lastObjectEach ( obj, iteratee [, context] ) 对象迭代器，从最后开始迭代
forOf ( obj, iteratee [, context] ) 通用迭代器,支持 return false 跳出循环 break
lastForOf ( obj, iteratee [, context] ) 通用迭代器,从最后开始迭代，支持 return false 跳出循环 break
keys (obj) 获取对象所有属性
values (obj) 获取对象所有值
entries (obj) 获取对象所有属性、值
first (obj) 获取对象第一个值
last (obj) 获取对象最后一个值
groupBy ( obj, iteratee [, context] ) 集合分组,默认使用键值分组，如果有 iteratee 则使用结果进行分组
countBy ( obj, iteratee [, context] ) 集合分组统计，返回各组中对象的数量统计
sortBy ( arr, iteratee [, context] ) 数组按属性值升序
shuffle ( array ) 将一个数组随机打乱，返回一个新的数组
sample ( array, number ) 从一个数组中随机返回几个元素
some ( obj, iteratee [, context] ) 对象中的值中的每一项运行给定函数,如果函数对任一项返回 true,则返回 true,否则返回 false
every ( obj, iteratee [, context] ) 对象中的值中的每一项运行给定函数,如果该函数对每一项都返回 true,则返回 true,否则返回 false
filter ( obj, iteratee [, context] ) 根据回调过滤数据
find ( obj, iteratee [, context] ) 查找匹配第一条数据
findKey ( obj, iteratee [, context] ) 查找匹配第一条数据的键
map ( obj, iteratee [, context] ) 指定方法后的返回值组成的新数组
objectMap ( obj, iteratee [, context] ) 指定方法后的返回值组成的新对象
pick (obj, array) 根据 keys 过滤指定的属性值 或者 接收一个判断函数，返回一个新的对象
omit (obj, array) 根据 keys 排除指定的属性值 或者 接收一个判断函数，返回一个新的对象
copyWithin ( array, target, start [, end] ) 浅复制数组的一部分到同一数组中的另一个位置,数组大小不变
sum ( obj, iteratee [, context] ) 求和函数，将数值相加
mean ( obj, iteratee [, context] ) 求平均值函数
reduce ( array, iteratee [, initialValue] ) 接收一个函数作为累加器，数组中的每个值（从左到右）开始合并，最终为一个值
chunk ( array, size ) 将一个数组分割成大小的组。如果数组不能被平均分配，那么最后一块将是剩下的元素
min ( arrb[, iteratee] ) 获取最小值
max ( arr [, iteratee] ) 获取最大值
commafy ( num [, options] ) 数值千分位分隔符、小数点
日期函数now ( ) 返回当前时间戳
timestamp ( date[, format] ) 将日期转为时间戳
toStringDate ( str, format ) 任意格式字符串转为日期
toDateString ( date [, format, options] ) 日期格式化为任意格式字符串
getWhatYear ( date, year [, month] ) 返回前几年或后几年的日期,可以指定年初(first)、年末(last)、月份(0~11)，默认当前
getWhatMonth ( date, month [, day] ) 返回前几月或后几月的日期,可以指定月初(first)、月末(last)、天数，默认当前
getWhatWeek ( date, week [, day] ) 返回前几周或后几周的日期,可以指定星期几(0~6)，默认当前
getWhatDay ( date, day [, mode] ) 返回前几天或后几天的日期
getDayOfYear ( date [, year] ) 返回某个年份的天数,可以指定前几个年或后几个年，默认当前
getYearDay ( date ) 返回某个年份的第几天
getYearWeek ( date ) 返回某个年份的第几周
getMonthWeek ( date ) 返回某个月份的第几周
getDayOfMonth ( date [, month] ) 返回某个月份的天数,可以指定前几个月或后几个月，默认当前
getDateDiff ( startDate, endDate [, rules] ) 返回两个日期之间差距,如果结束日期小于开始日期 done 为 fasle
高级函数toArrayTree ( array, options ) 一个高性能的树结构转换函数，将一个带层级的数据列表转成树结构
toTreeArray ( array, options ) 将一个树结构转成数组列表
property ( path ) 返回一个获取对象属性的函数
pluck ( array, key ) 获取数组对象中某属性值，返回一个数组
invoke ( list, path, ...arguments ) 在list的每个元素上执行方法,任何传递的额外参数都会在调用方法的时候传递给它
zip ( ) 将每个数组中相应位置的值合并在一起
unzip ( arrays ) 与 zip 相反
delay (callback, wait[, ...arguments]) 该方法和 setTimeout 一样的效果，区别就是支持额外参数
bind (callback, context[, ...arguments]) 创建一个绑定上下文的函数
once (callback, context[, ...arguments]) 创建一个只能调用一次的函数,只会返回第一次执行后的结果
after (count, callback, context) 创建一个函数, 调用次数超过 count 次之后执行回调并将所有结果记住后返回
before (count, callback, context) 创建一个函数, 调用次数不超过 count 次之前执行回调并将所有结果记住后返回
throttle (callback, wait[, options]) 创建一个策略函数，当被重复调用函数的时候，至少每隔多少秒毫秒调用一次该函数
debounce (callback, wait[, options]) 创建一个防反跳策略函数，在函数最后一次调用多少毫秒之后才会再次执行，如果在期间内重复调用会重新计算延迟

vue中xe-utils的强大相关推荐

Vue中的插件小练习
提到vue插件,想必大家一下想到就是官方推荐的vue-router.vue等,功能还是蛮强大的,那,我们一直在使用插件,那是否也可以开发一个自己的插件呢? 开发插件: 插件通常会为vue添加全局功能, ...
vue ts 设置tslint提示_Typescript 在 Vue 中的实践(包含2.x、3.x)
1 使用 typescript 的优势聊到 ts 时有一个不能规避的问题:为什么要使用 ts ,相比 js 有什么优势吗?下面我从两个方面试着回答一下这个问题: 1.1 项目开发时的便利避免低级 ...
Vue中怎样封装与使用公共状态属性组件实现类似枚举类的效果
场景如果一个状态量在多个地方用到,或者一个业务用到多个状态量. 可以使用类似枚举类代替直接使用明文表示. 这样如果需要修改状态量的值就不用再每个地方都要修改. Vue中要实现同样的效果,比如自定义一 ...
Vue中前端加密使用RSA加密下的JSEncrypt防止明文暴露
场景前端使用Vue在进行登录时,需要将密码存进cookie中. 为了防止密码明文暴露,前端需要采用加密方式对密码进行加密. 常用加密方式之一就是RSA加密解密. RSA加密是一种非对称加密.可以在不 ...
Vue中通过Axios向SpringBoot发送get和post请求
场景前端使用Vue+ElementUI实现页面布局. 跨域请求使用axios. 为了将axios的请求对象封装成公共的.新建request.js import axios from 'axios' ...
快速入门在Vue中使用滑动插件Swiper
前言 swiper 开源.免费.强大的滑动插件. swiper中文网 https://www.swiper.com.cn/ Swiper4中文API https://www.swiper.com.cn ...
vue中config/index.js:配置的详细理解
当我们需要和后台分离部署的时候,必须配置config/index.js: 用vue-cli 自动构建的目录里面 (环境变量及其基本变量的配置) 1 2 3 4 5 6 7 8 9 10 11 12 ...
stylus在vue中的使用
stylus是一个css预处理器,比较流行的css预处理器有sass.less.stylus,它们都一样,都是css的语法糖,可以使用变量,可以有简单的逻辑,使css的开发效率更高,更易维护.styl ...
Knockout中ko.utils中处理数组的方法集合
每一套框架基本上都会有一个工具类,如:Vue中的Vue.util.Knockout中的ko.utils.jQuery直接将一些工具类放到了$里面,如果你还需要更多的工具类可以试试lodash.本文只介 ...
总结Vue中index.html、main.js、App.vue、index.js之间关系以及Vue项目加载流程
总结Vue中index.html.main.js.App.vue.index.js之间关系以及Vue项目加载流程文章目录总结Vue中index.html.main.js.App.vue.index ...

vue中xe-utils的强大

vue中xe-utils的强大相关推荐

最新文章

热门文章