What is @antv/util?
@antv/util is a utility library that provides a collection of functions for common programming tasks. It is part of the AntV ecosystem, which is a suite of data visualization tools. The library includes functions for data manipulation, type checking, deep cloning, and more.
What are @antv/util's main functionalities?
Type Checking
The @antv/util package provides various type-checking functions to determine the type of a given value. In this example, `isString` is used to check if a value is a string.
const isString = require('@antv/util/lib/type/isString');
console.log(isString('Hello World')); // true
console.log(isString(123)); // false
Deep Clone
The `deepClone` function creates a deep copy of an object, ensuring that nested objects are also cloned. This is useful for creating independent copies of complex data structures.
const deepClone = require('@antv/util/lib/deepClone');
const obj = { a: 1, b: { c: 2 } };
const clonedObj = deepClone(obj);
console.log(clonedObj); // { a: 1, b: { c: 2 } }
console.log(clonedObj === obj); // false
Data Manipulation
The `groupBy` function allows you to group an array of objects by a specified key. This is useful for organizing data into categories or groups.
const groupBy = require('@antv/util/lib/array/groupBy');
const data = [
{ category: 'fruit', name: 'apple' },
{ category: 'fruit', name: 'banana' },
{ category: 'vegetable', name: 'carrot' }
];
const groupedData = groupBy(data, 'category');
console.log(groupedData); // { fruit: [{ category: 'fruit', name: 'apple' }, { category: 'fruit', name: 'banana' }], vegetable: [{ category: 'vegetable', name: 'carrot' }] }
Other packages similar to @antv/util
lodash
Lodash is a popular utility library that provides a wide range of functions for data manipulation, type checking, and more. It is widely used and has a large community. Compared to @antv/util, Lodash offers a more extensive set of utilities and is more commonly used in the JavaScript ecosystem.
underscore
Underscore is another utility library that offers a variety of functions for common programming tasks. It is similar to Lodash but has a smaller footprint. While @antv/util is part of the AntV ecosystem, Underscore is a standalone library that focuses solely on utility functions.
ramda
Ramda is a functional programming library for JavaScript that emphasizes immutability and side-effect-free functions. It provides a different approach compared to @antv/util, focusing on functional programming paradigms. Ramda is ideal for developers who prefer a functional style of coding.
util
为 antv
开发的轻量级工具方法库。
安装下载
tnpm i --save @antv/util
import { each, get } from '@antv/util';
each(arr, (item, idx) => {
});
const x = get(obj, 'a.b', '');
API 文档
目前使用到的、且推荐使用的 API 文档,不在文档内的不建议使用。
后续方法添加到文档需要经过审核:
- ts 类型定义是否完善
- 单测是否覆盖
- 文档实例是否覆盖全部能力
推荐使用的 API 文档如下:
-
array
-
event
-
object
-
string
-
type
-
function
-
format
- number2color
- parseRadius: 将数值转换成矩形四个角对应的 radius
- toArray
- toString
-
math
- clamp
- fixedBase
- isDecimal
- isEven
- isInteger
- isNegative
- isNumberEqual
- isOdd
- isPositive
- maxBy
- minBy
- toDegree
- toInteger
- toRadian
-
animate
- requestAnimationFrame
- clearAnimationFrame
-
other
- augment
- debounce
- mix
- deepMix
- each
- extend
实例
TODO 完善上述各个方法的使用实例。
import { contains } from '@antv/util';
const has = contains([1, 2, 3], 1);
import { startsWith } from '@antv/util';
startsWith([1, 2, 3], 1);
startsWith('abc', 'b');
import { endsWith } from '@antv/util';
endsWith([1, 2, 3], 1);
endsWith('abc', 'c');
import { groupBy } from '@antv/util';
groupBy([6.1, 4.2, 6.3], Math.floor);
groupBy([ { user: 'lily' }, { user: 'lucy' } ], 'user');
import { groupBy } from '@antv/util';
group([6.1, 4.2, 6.3], Math.floor);
group([ { user: 'lily' }, { user: 'lucy' } ], 'user');
缓存方法的执行结构,一般用于耗时的计算方法。
import { memoize } from '@antv/util';
function max(...args) {
return Math.max(...args);
}
const mmax = memoize(max, (...args) => args.join('-'));
mmax(1, 2, 3, 4, 5);
判断是否是有限数
import { isFinite } from '@antv/util';
isFinite(3);
isFinite('3');
按照 path 给 obj 赋值。方法是 mutable 的。
import { set } from '@antv/util';
set({ a: { b: { c: 1 } } }, 'a.b', 100);