1 | # util
|
2 |
|
3 | > 为 `antv` 开发的轻量级工具方法库。
|
4 |
|
5 |
|
6 | ## 安装下载
|
7 |
|
8 | > tnpm i --save @antv/util
|
9 |
|
10 | ```js
|
11 | // 所有的 api 是都这么引入,名字不同而已
|
12 | import { each, get } from '@antv/util';
|
13 |
|
14 | each(arr, (item, idx) => {
|
15 |
|
16 | });
|
17 |
|
18 | const x = get(obj, 'a.b', '');
|
19 | ```
|
20 |
|
21 | ## API 文档
|
22 |
|
23 | > 目前使用到的、且推荐使用的 API 文档,不在文档内的不建议使用。
|
24 |
|
25 | 后续方法添加到文档需要经过审核:
|
26 |
|
27 | 1. ts 类型定义是否完善
|
28 | 2. 单测是否覆盖
|
29 | 3. 文档实例是否覆盖全部能力
|
30 |
|
31 |
|
32 | > 推荐使用的 API 文档如下:
|
33 | - array
|
34 | - [contains](#contains)
|
35 | - [difference](#)
|
36 | - [map](#)
|
37 | - [find](#)
|
38 | - [findIndex](#)
|
39 | - firstValue
|
40 | - [filter](#)
|
41 | - [flatten](#)
|
42 | - flattenDeep
|
43 | - getRange
|
44 | - pull
|
45 | - pullAt
|
46 | - sortBy
|
47 | - valuesOfKey
|
48 | - head
|
49 | - last
|
50 | - [reduce](#)
|
51 | - [remove](#)
|
52 | - [sortBy](#)
|
53 | - [union](#)
|
54 | - [uniq](#)
|
55 | - [toArray](#)
|
56 | - [groupBy](#)
|
57 | - [group](#)
|
58 | - [startsWith](#)
|
59 | - [endsWith](#)
|
60 | - [every](#)
|
61 | - [some](#)
|
62 | - indexOf
|
63 |
|
64 | - event
|
65 | - [getWrapBehavior](#)
|
66 | - [wrapBehavior](#)
|
67 |
|
68 | - object
|
69 | - [clone](#)
|
70 | - has
|
71 | - hasKey
|
72 | - keys
|
73 | - isMatch
|
74 | - [forIn](#)
|
75 | - values
|
76 | - [mapValues](#)
|
77 | - [mapKeys](#)
|
78 | - [get](#)
|
79 | - [set](#)
|
80 | - [groupBy](#)
|
81 | - [isEqual](#)
|
82 | - isEqualWith
|
83 | - [pick](#)
|
84 | - string
|
85 | - [lowerCase](#)
|
86 | - [upperCase](#)
|
87 | - substitute
|
88 | - upperFirst
|
89 | - lowerFirst
|
90 | - [toString](#)
|
91 | - [uniqueId](#)
|
92 | - type
|
93 | - [getType](#)
|
94 | - isArguments
|
95 | - [isArray](#)
|
96 | - isArrayLike
|
97 | - [isBoolean](#)
|
98 | - [isDate](#)
|
99 | - isError
|
100 | - [isFunction](#)
|
101 | - [isFinite](#)
|
102 | - [isNil](#)
|
103 | - [isNull](#)
|
104 | - [isNumber](#)
|
105 | - [isObject](#)
|
106 | - isObjectLike
|
107 | - isPlainObject
|
108 | - isPrototype
|
109 | - isType
|
110 | - isElement
|
111 | - [isRegExp](#)
|
112 | - [isString](#)
|
113 | - [isUndefined](#)
|
114 | - [isEmpty](#)
|
115 | - function
|
116 | - [debounce](#)
|
117 | - [throttle](#)
|
118 | - [noop](#)
|
119 | - [identity](#)
|
120 | - [memoize](#)
|
121 | - noop
|
122 | - size
|
123 | - format
|
124 | - number2color
|
125 | - parseRadius: 将数值转换成矩形四个角对应的 radius
|
126 | - toArray
|
127 | - toString
|
128 | - math
|
129 | - clamp
|
130 | - fixedBase
|
131 | - isDecimal
|
132 | - isEven
|
133 | - isInteger
|
134 | - isNegative
|
135 | - isNumberEqual
|
136 | - isOdd
|
137 | - isPositive
|
138 | - maxBy
|
139 | - minBy
|
140 | - toDegree
|
141 | - toInteger
|
142 | - toRadian
|
143 | - animate
|
144 | - requestAnimationFrame
|
145 | - clearAnimationFrame
|
146 | - other
|
147 | - augment
|
148 | - debounce
|
149 | - mix
|
150 | - deepMix
|
151 | - each
|
152 | - extend
|
153 | ## 实例
|
154 |
|
155 | > TODO 完善上述各个方法的使用实例。
|
156 |
|
157 |
|
158 | - contains
|
159 |
|
160 | ```js
|
161 | import { contains } from '@antv/util';
|
162 |
|
163 | const has = contains([1, 2, 3], 1);
|
164 | ```
|
165 |
|
166 | - startsWith
|
167 |
|
168 | ```js
|
169 | import { startsWith } from '@antv/util';
|
170 |
|
171 | startsWith([1, 2, 3], 1);
|
172 | // true
|
173 |
|
174 | startsWith('abc', 'b');
|
175 | // false
|
176 | ```
|
177 |
|
178 | - endsWith
|
179 |
|
180 | ```js
|
181 | import { endsWith } from '@antv/util';
|
182 |
|
183 | endsWith([1, 2, 3], 1);
|
184 | // false
|
185 |
|
186 | endsWith('abc', 'c');
|
187 | // true
|
188 | ```
|
189 |
|
190 |
|
191 | - groupBy
|
192 |
|
193 | ```js
|
194 | import { groupBy } from '@antv/util';
|
195 |
|
196 | groupBy([6.1, 4.2, 6.3], Math.floor);
|
197 | // => { '4': [4.2], '6': [6.1, 6.3] }
|
198 |
|
199 | // 根据元素键值来分组
|
200 | groupBy([ { user: 'lily' }, { user: 'lucy' } ], 'user');
|
201 | ```
|
202 |
|
203 |
|
204 | - group
|
205 |
|
206 | ```js
|
207 | import { groupBy } from '@antv/util';
|
208 |
|
209 | group([6.1, 4.2, 6.3], Math.floor);
|
210 | // => [ [4.2], [6.1, 6.3] ]
|
211 |
|
212 | group([ { user: 'lily' }, { user: 'lucy' } ], 'user');
|
213 | // [ [{ user: 'lily' }], [{ user: 'lucy' }] ]
|
214 | ```
|
215 |
|
216 |
|
217 | - memoize
|
218 |
|
219 | > 缓存方法的执行结构,一般用于耗时的计算方法。
|
220 |
|
221 | ```js
|
222 | import { memoize } from '@antv/util';
|
223 |
|
224 | function max(...args) {
|
225 | return Math.max(...args);
|
226 | }
|
227 |
|
228 | // 第二个参数,是将变量变成 key,如果没有,则直接取第一个参数作为 key
|
229 | const mmax = memoize(max, (...args) => args.join('-'));
|
230 |
|
231 | mmax(1, 2, 3, 4, 5);
|
232 | ```
|
233 |
|
234 | - isFinite
|
235 |
|
236 | > 判断是否是有限数
|
237 |
|
238 | ```js
|
239 | import { isFinite } from '@antv/util';
|
240 |
|
241 | isFinite(3);
|
242 | // => true
|
243 |
|
244 | isFinite('3');
|
245 | // => false
|
246 | ```
|
247 |
|
248 | - set
|
249 |
|
250 | > 按照 path 给 obj 赋值。方法是 mutable 的。
|
251 |
|
252 | ```js
|
253 | import { set } from '@antv/util';
|
254 |
|
255 | set({ a: { b: { c: 1 } } }, 'a.b', 100);
|
256 | // return the original object.
|
257 | ```
|