类似 jQuery 的 dom 操作库。
namespace $ {
class $ extends Select {
find(selector: string): $;
each(fn: types.AnyFn): $;
offset(): $offset.IOffset;
hide(): $;
show(): $;
first(): $;
last(): $;
get(index: number): Element;
eq(index: number): $;
on(event: string, selector: string, handler: types.AnyFn): $;
on(event: string, handler: types.AnyFn): $;
off(event: string, selector: string, handler: types.AnyFn): $;
off(event: string, handler: types.AnyFn): $;
html(): string;
html(value: string): $;
text(): string;
text(value: string): $;
val(): string;
val(value: string): $;
css(name: string): string;
css(name: string, value: string): $;
css(properties: types.PlainObj<string | number>): $;
attr(name: string): string;
attr(name: string, value: string): $;
attr(attributes: types.PlainObj<string>): $;
data(name: string): string;
data(name: string, value: string): $;
data(attributes: types.PlainObj<string>): $;
rmAttr(name: string): $;
remove(): $;
addClass(name: string | string[]): $;
rmClass(name: string): $;
toggleClass(name: string): $;
hasClass(name: string): boolean;
parent(): $;
append(content: string | Element): $;
prepend(content: string | Element): $;
before(content: string | Element): $;
after(content: string | Element): $;
}
}
declare function $(selector: string | Element | Document): $.$;
offset, hide, show, first, last, get, eq, on, off, html, text, val, css, attr, data, rmAttr, remove, addClass, rmClass, toggleClass, hasClass, append, prepend, before, after
const $btn = $('#btn');
$btn.html('eustia');
$btn.addClass('btn');
$btn.show();
$btn.on('click', function() {
// Do something...
});
操作元素属性。
namespace $attr {
function remove(element: $safeEls.El, name: string): void;
}
function $attr(
element: $safeEls.El,
name: string,
value: string
): void;
function $attr(
element: $safeEls.El,
attributes: types.PlainObj<string>
): void;
function $attr(element: $safeEls.El, name: string): string;
获取元素集中第一个元素的指定属性值。
参数名 | 说明 |
---|---|
element | 目标元素集 |
name | 属性名 |
返回值 | 第一个元素的属性值 |
设置元素集中一个或多个属性的值。
参数名 | 说明 |
---|---|
element | 目标元素集 |
name | 属性名 |
val | 属性值 |
参数名 | 说明 |
---|---|
element | 目标元素集 |
attributes | 包含多个要设置属性-值对的对象 |
对元素集中的所有元素,移除指定的属性。
参数名 | 说明 |
---|---|
element | 目标元素集 |
name | 属性名 |
$attr('#test', 'attr1', 'test');
$attr('#test', 'attr1'); // -> test
$attr.remove('#test', 'attr1');
$attr('#test', {
attr1: 'test',
attr2: 'test'
});
操作元素 class。
const $class: {
add(element: $safeEls.El, name: string | string[]): void;
has(element: $safeEls.El, name: string): boolean;
toggle(element: $safeEls.El, name: string): void;
remove(element: $safeEls.El, name: string): void;
};
对元素集中的所有元素,添加指定的 class。
参数名 | 说明 |
---|---|
element | 目标元素集 |
names | 添加的 class |
判断元素集中是否有元素含有指定的 class。
参数名 | 说明 |
---|---|
element | 目标元素集 |
name | class 值 |
返回值 | 如果有,返回真 |
对于元素集中的每个元素,如果含有指定的 class 就将其删除,反之则添加。
参数名 | 说明 |
---|---|
element | 目标元素集 |
name | class 值 |
对于元素集中的所有元素,移除指定的 class。
参数名 | 说明 |
---|---|
element | 目标元素集 |
name | class 值 |
$class.add('#test', 'class1');
$class.add('#test', ['class1', 'class2']);
$class.has('#test', 'class1'); // -> true
$class.remove('#test', 'class1');
$class.has('#test', 'class1'); // -> false
$class.toggle('#test', 'class1');
$class.has('#test', 'class1'); // -> true
操作元素样式。
function $css(element: $safeEls.El, name: string): string;
function $css(
element: $safeEls.El,
name: string,
val: string
): void;
function $css(
element: $safeEls.El,
properties: types.PlainObj<string | number>
): void;
获取元素集中第一个元素的指定样式。
参数名 | 说明 |
---|---|
element | 目标元素集 |
name | 样式名 |
返回值 | 样式值 |
设置元素集中一个或多个样式的值。
参数名 | 说明 |
---|---|
element | 目标元素集 |
name | 样式名 |
val | 样式值 |
参数名 | 说明 |
---|---|
element | 目标元素集 |
properties | 包含多个要设置样式-值对的对象 |
$css('#test', {
color: '#fff',
background: 'black',
opacity: 0.5
});
$css('#test', 'display', 'block');
$css('#test', 'color'); // -> #fff
同 $attr,自动给属性名加 data- 前缀。
function $data(
element: $safeEls.El,
name: string,
value: string
): void;
function $data(
element: $safeEls.El,
attributes: types.PlainObj<string>
): void;
function $data(element: $safeEls.El, name: string): string;
$data('#test', 'attr1', 'eustia');
给指定 dom 元素绑定事件。
const $event: {
on(
element: $safeEls.El,
event: string,
selector: string,
handler: types.AnyFn
): void;
on(element: $safeEls.El, event: string, handler: types.AnyFn): void;
off(
element: $safeEls.El,
event: string,
selector: string,
handler: types.AnyFn
): void;
off(element: $safeEls.El, event: string, handler: types.AnyFn): void;
};
function clickHandler() {
// Do something...
}
$event.on('#test', 'click', clickHandler);
$event.off('#test', 'click', clickHandler);
插入 html 到不同位置。
namespace $insert {
type IInsert = (element: $safeEls.El, content: string | Element) => void;
}
const $insert: {
before: $insert.IInsert;
after: $insert.IInsert;
append: $insert.IInsert;
prepend: $insert.IInsert;
};
插入 html 到元素前。
插入 html 到元素后。
插入 html 到元素内部前。
插入 html 到元素内部后。
参数名 | 说明 |
---|---|
element | 目标元素集 |
content | html 字符串或元素 |
// <div id="test"><div class="mark"></div></div>
$insert.before('#test', '<div>licia</div>');
// -> <div>licia</div><div id="test"><div class="mark"></div></div>
$insert.after('#test', '<div>licia</div>');
// -> <div id="test"><div class="mark"></div></div><div>licia</div>
$insert.prepend('#test', '<div>licia</div>');
// -> <div id="test"><div>licia</div><div class="mark"></div></div>
$insert.append('#test', '<div>licia</div>');
// -> <div id="test"><div class="mark"></div><div>licia</div></div>
获取元素在文档中的位置。
namespace $offset {
interface IOffset {
left: number;
top: number;
width: number;
height: number;
}
}
function $offset(element: $safeEls.El): $offset.IOffset;
参数名 | 说明 |
---|---|
element | 目标元素集 |
返回值 | 元素位置 |
$offset('#test'); // -> {left: 0, top: 0, width: 0, height: 0}
设置或获取元素的 html, text,val 等值。
namespace $property {
interface IProperty {
(element: $safeEls.El, value: string): void;
(element: $safeEls.El): string;
}
}
const $property: {
html: $property.IProperty;
val: $property.IProperty;
text: $property.IProperty;
};
设置或获取元素的 html 值。
设置或获取元素的 text 值。
设置或获取元素的 val 值。
$property.html('#test', 'licia');
$property.html('#test'); // -> licia
移除指定元素集。
function $remove(element: $safeEls.El);
参数名 | 说明 |
---|---|
element | 目标元素集 |
$remove('#test');
将值转换为数组,如果值为字符串,使用 querySelector 获取元素集。
namespace $safeEls {
type El = Element | Element[] | NodeListOf<Element> | string;
}
function $safeEls(val: $safeEls.El): Element[];
参数名 | 说明 |
---|---|
val | 要转换的值 |
返回值 | 元素集 |
$safeEls(document.querySelector('.test'));
$safeEls(document.querySelectorAll('.test'));
$safeEls('.test'); // -> Array of elements with test class
显示元素。
function $show(element: $safeEls.El): void;
参数名 | 说明 |
---|---|
element | 目标元素集 |
$show('#test');
JavaScript 基准测试。
namespace Benchmark {
interface IOptions {
minTime?: number;
maxTime?: number;
minSamples?: number;
delay?: number;
name?: string;
}
interface IResult {
name: string;
mean: number;
variance: number;
deviation: number;
sem: number;
moe: number;
rme: number;
hz: number;
sample: number[];
}
}
class Benchmark {
constructor(fn: types.AnyFn, options?: Benchmark.IOptions);
run(): Promise<Benchmark.IResult>;
static all(
benches: Array<types.AnyFn | Benchmark>,
options?: Benchmark.IOptions
): Promise<Benchmark.IResult[]>;
}
参数名 | 说明 |
---|---|
fn | 要测试的代码 |
options | 测试选项 |
可用选项:
参数名 | 说明 |
---|---|
minTime=50 | 用于减少误差的时间 |
maxTime=5000 | 测试运行最大时间 |
minSamples=5 | 最小样本数量 |
delay=5 | 测试周期间隔 |
name | 测试名称 |
运行基准测试,返回 promise。
[static] 运行多个基准测试。
const benchmark = new Benchmark(
function test() {
!!'Hello World!'.match(/o/);
},
{
maxTime: 1500
}
);
benchmark.run().then(result => {
console.log(String(result));
});
Benchmark.all([
function regExp() {
/o/.test('Hello World!');
},
function indexOf() {
'Hello World!'.indexOf('o') > -1;
},
function match() {
!!'Hello World!'.match(/o/);
}
]).then(results => {
console.log(String(results));
});
如果支持 Blob,直接返回 Blob,否则使用 BlobBuilder 进行兼容。
参数名 | 说明 |
---|---|
parts | Blob 分片 |
options | 选项 |
const blob = new Blob([]);
布隆过滤器实现。
class BloomFilter {
constructor(size?: number, k?: number);
add(val: string): void;
test(val: string): boolean;
}
参数名 | 说明 |
---|---|
size=1024 | 桶数目 |
k=3 | 哈希函数数目 |
添加元素。
参数名 | 说明 |
---|---|
val | 要加的值 |
检测元素是否在过滤器中。
参数名 | 说明 |
---|---|
val | 要检查的值 |
返回值 | 如果可能在返回真,如果绝对不在返回假 |
const bloom = new BloomFilter(256, 3);
bloom.add('Bruce Wayne');
bloom.add('Clark Kent');
bloom.test('Clark Kent'); // -> true
bloom.test('Bruce Wayne'); // -> true
bloom.test('Tony Stark'); // -> false
修改对象的属性值时,无需关心键值的大小写情况。
class Caseless {
constructor(obj: any);
getKey(key: string): string | void;
set(key: string, val: any): void;
get(key: string): any;
remove(key: string): void;
has(key: string): boolean;
}
参数名 | 说明 |
---|---|
obj | 目标对象 |
获取原始键值。
参数名 | 说明 |
---|---|
key | 不区分大小写的键名 |
返回值 | 原始键值 |
设置值。
参数名 | 说明 |
---|---|
key | 不区分大小写的键名 |
val | 要设置的值 |
获取值。
参数名 | 说明 |
---|---|
key | 不区分大小写的键名 |
返回值 | 键值 |
移除值。
参数名 | 说明 |
---|---|
key | 不区分大小写的键名 |
判断是否存在给定的键名。
参数名 | 说明 |
---|---|
key | 不区分大小写的键名 |
返回值 | 如果有,返回真 |
const headers = { 'Content-Type': 'text/javascript' };
const c = new Caseless(headers);
c.set('content-type', 'text/css');
console.log(headers); // -> { 'Content-Type': 'text/css' }
c.getKey('content-type'); // -> 'Content-Type'
c.remove('content-type');
c.has('content-type'); // -> false
可以相互连接的消息通道。
class Channel extends Emitter {
send(msg: any): void;
connect(channel: Channel): void;
disconnect(channel: Channel): void;
isConnected(channel: Channel): boolean;
destroy(): void;
}
发送消息给所有连接的通道。
参数名 | 说明 |
---|---|
msg | 要发送的消息 |
连接到指定通道。
参数名 | 说明 |
---|---|
channel | 要连接的通道 |
断开与指定通道的连接。
参数名 | 说明 |
---|---|
channel | 要断开的通道 |
检查两个通道是否连接。
参数名 | 说明 |
---|---|
channel | 目标通道 |
返回值 | 是否连接 |
销毁通道,断开所有连接的通道。
const channelA = new Channel();
const channelB = new Channel();
channelA.connect(channelB);
channelB.on('message', msg => {
console.log(msg); // -> 'hello'
});
channelA.send('hello');
channelA.on('message', msg => {
console.log(msg); // -> 'world'
});
channelB.send('world');
channelA.isConnected(channelB); // -> true
channelB.isConnected(channelA); // -> true
创建 JavaScript 类。
namespace Class {
class Base {
toString(): string;
}
class IConstructor extends Base {
constructor(...args: any[]);
static extend(methods: any, statics: any): IConstructor;
static inherits(Class: types.AnyFn): void;
static methods(methods: any): IConstructor;
static statics(statics: any): IConstructor;
[method: string]: any;
}
}
function Class(methods: any, statics?: any): Class.IConstructor;
参数名 | 说明 |
---|---|
methods | 公有方法 |
statics | 静态方法 |
返回值 | 用于创建实例的函数 |
const People = Class({
initialize: function People(name, age) {
this.name = name;
this.age = age;
},
introduce: function() {
return 'I am ' + this.name + ', ' + this.age + ' years old.';
}
});
const Student = People.extend(
{
initialize: function Student(name, age, school) {
this.callSuper(People, 'initialize', arguments);
this.school = school;
},
introduce: function() {
return (
this.callSuper(People, 'introduce') +
'\n I study at ' +
this.school +
'.'
);
}
},
{
is: function(obj) {
return obj instanceof Student;
}
}
);
const a = new Student('allen', 17, 'Hogwarts');
a.introduce(); // -> 'I am allen, 17 years old. \n I study at Hogwarts.'
Student.is(a); // -> true
颜色转换。
namespace Color {
interface IColor {
val: number[];
model: string;
}
}
class Color {
constructor(color: string | Color.IColor);
toRgb(): string;
toHex(): string;
toHsl(): string;
static parse(colorStr: string): Color.IColor;
}
参数名 | 说明 |
---|---|
color | 要转换的颜色 |
获取颜色 rgb 格式。
获取颜色十六进制格式。
获取颜色 hsl 格式。
【静态】将颜色字符串转换为含有值及颜色模型的对象。
参数名 | 说明 |
---|---|
color | 颜色字符串 |
返回值 | 含有值及颜色模型的对象 |
Color.parse('rgb(170, 287, 204, 0.5)'); // -> {val: [170, 187, 204, 0.5], model: 'rgb'}
const color = new Color('#abc');
color.toRgb(); // -> 'rgb(170, 187, 204)'
color.toHsl(); // -> 'hsl(210, 25%, 73%)'
对象委托。
class Delegator {
constructor(host: object, target: object | string);
method(name: string, target?: string): Delegator;
getter(name: string, target?: string): Delegator;
setter(name: string, target?: string): Delegator;
access(name: string, target?: string): Delegator;
}
参数名 | 说明 |
---|---|
host | 宿主对象 |
target | 委托目标 |
允许在宿主对象上访问目标方法。
参数名 | 说明 |
---|---|
name | 宿主方法名 |
target=name | 目标方法名 |
创建 getter。
创建 setter。
创建 accessor,效果等于同时调用 setter 和 getter。
const host = {
target: {
a() {
return 'a';
},
b: 'b',
c: 'c',
d: 'd',
e() {
return 'e';
}
}
};
const delegator = new Delegator(host, 'target');
delegator
.method('a')
.getter('b')
.setter('c')
.access('d');
host.a(); // -> 'a'
host.b; // -> 'b'
host.c = 5;
host.target.c; // -> 5
host.d; // -> 'd'
host.d = 5;
host.d; // -> 5
Flux 调度器。
class Dispatcher {
dispatch(payload: any);
register(cb: types.AnyFn): void;
waitFor(ids: string[]): void;
unregister(id: string): void;
isDispatching(): boolean;
}
const dispatcher = new Dispatcher();
dispatcher.register(function(payload) {
switch (
payload.actionType
// Do something
) {
}
});
dispatcher.dispatch({
actionType: 'action'
});
提供观察者模式的 Event emitter 类。
class Emitter {
on(event: string, listener: types.AnyFn): Emitter;
off(event: string, listener: types.AnyFn): Emitter;
once(event: string, listener: types.AnyFn): Emitter;
emit(event: string, ...args: any[]): Emitter;
removeAllListeners(event?: string): Emitter;
static mixin(obj: any): any;
}
绑定事件。
解绑事件。
绑定只触发一次的事件。
参数名 | 说明 |
---|---|
event | 事件名称 |
listener | 事件监听器 |
触发事件。
参数名 | 说明 |
---|---|
event | 事件名称 |
...args | 传递给监听器的参数 |
解绑所有事件。
参数名 | 说明 |
---|---|
event | 事件名称 |
【静态】 将 Emitter 类的方法绑定到指定对象上去。
参数名 | 说明 |
---|---|
obj | 目标对象 |
const event = new Emitter();
event.on('test', function(name) {
console.log(name);
});
event.emit('test', 'licia'); // Logs out 'licia'.
Emitter.mixin({});
Enum 类实现。
class Enum {
size: number;
constructor(map: string[] | { [member: string]: any });
[key: string]: any;
}
参数名 | 说明 |
---|---|
arr | 字符串数组 |
参数名 | 说明 |
---|---|
obj | 键值对 |
const importance = new Enum([
'NONE',
'TRIVIAL',
'REGULAR',
'IMPORTANT',
'CRITICAL'
]);
const val = 1;
if (val === importance.CRITICAL) {
// Do something.
}
二进制文件存储。
class FileBlobStore extends Emitter {
constructor(path: string, data?: types.PlainObj<Buffer>);
set(key: string, buf: Buffer): void;
set(values: types.PlainObj<Buffer>): void;
get(key: string): Buffer | void;
get(keys: string[]): types.PlainObj<Buffer>;
remove(key: string): void;
remove(keys: string[]): void;
clear(): void;
each(fn: (val: Buffer, key: string) => void): void;
save(): void;
}
API 基本与 Store 模块一致,主要不同点是只接收 Buffer 类型。
保存内容到磁盘。
const store = new FileBlobStore('path/to/file');
store.set('name', Buffer.from('licia'));
process.on('exit', () => store.save());
class FileStore extends Store {
constructor(path: string, data?: any);
}
参数名 | 说明 |
---|---|
path | 存储文件路径 |
data | 默认数据 |
const store = new FileStore('path/to/file');
store.set('name', 'licia');
哈希表实现。
class HashTable {
constructor(size?: number);
set(key: string, val: any): void;
get(key: string): any;
has(key: string): boolean;
delete(key: string): void;
}
参数名 | 说明 |
---|---|
size=32 | 桶数目 |
设置值。
参数名 | 说明 |
---|---|
key | 键名 |
val | 键值 |
获取值。
参数名 | 说明 |
---|---|
key | 键名 |
返回值 | 键值 |
检查是否有指定值。
参数名 | 说明 |
---|---|
key | 键名 |
返回值 | 如果值存在,返回真 |
删除值。
const hashTable = new HashTable(128);
hashTable.set('name', 'redhoodsu');
hashTable.get('name'); // -> 'redhoodsu'
hashTable.has('name'); // -> true
hashTable.delete('name');
hashTable.has('name'); // -> false
堆实现。
class Heap {
size: number;
constructor(cmp?: types.AnyFn);
clear(): void;
add(item: any): number;
poll(): any;
peek(): any;
}
堆大小。
参数名 | 说明 |
---|---|
cmp | 比较器 |
清空堆数据。
往堆里添加元素。
参数名 | 说明 |
---|---|
item | 入堆元素 |
返回值 | 当前大小 |
获取并删除堆的根元素。
与 poll 一样,只是不删除。
const heap = new Heap(function(a, b) {
return b - a;
});
heap.add(2);
heap.add(1);
heap.add(4);
heap.add(5);
heap.poll(); // -> 5
console.log(heap.size); // -> 4
V8 内存快照操作库。
class HeapSnapshot {
nodes: LinkedList;
edges: LinkedList;
constructor(profile: any);
}
参数名 | 说明 |
---|---|
profile | 要解析的内存快照 |
解析后的节点信息。
解析后的边信息。
const fs = require('fs');
const data = fs.readFileSync('path/to/heapsnapshot', 'utf8');
const heapSnapshot = new HeapSnapshot(data);
let totalSize = 0;
heapSnapshot.nodes.forEach(node => (totalSize += node.selfSize));
console.log(totalSize);
简单国际化库。
class I18n {
constructor(locale: string, langs: types.PlainObj<any>);
set(locale: string, lang: types.PlainObj<any>): void;
t(path: string | string[], data?: types.PlainObj<any>): string;
locale(locale: string): void;
}
参数名 | 说明 |
---|---|
locale | 地区代码 |
langs | 语言数据 |
添加语言或者向已有的语言新增键值。
参数名 | 说明 |
---|---|
locale | 地区代码 |
lang | 语言数据 |
设置当前地区。
参数名 | 说明 |
---|---|
locale | 地区代码 |
获取翻译文本。
参数名 | 说明 |
---|---|
path | 要获取文本的键值 |
data | 要传递的数据 |
返回值 | 翻译文本 |
const i18n = new I18n('en', {
en: {
welcome: 'Hello, {{name}}!',
curTime(data) {
return 'Current time is ' + data.time;
}
},
cn: {
welcome: '你好,{{name}}!'
}
});
i18n.set('cn', {
curTime(data) {
return '当前时间是 ' + data.time;
}
});
i18n.t('welcome', { name: 'licia' }); // -> 'Hello, licia!'
i18n.locale('cn');
i18n.t('curTime', { time: '5:47 pm' }); // -> '当前时间是 5:47 pm'
JSON 转换器。
class JsonTransformer {
constructor(data: any);
set(key: string, val: any): JsonTransformer;
get(key?: string): any;
map(from: string, to: string, fn: types.AnyFn): JsonTransformer;
map(from: string, fn: types.AnyFn): JsonTransformer;
filter(from: string, to: string, fn: types.AnyFn): JsonTransformer;
filter(from: string, fn: types.AnyFn): JsonTransformer;
remove(keys: string | string[]): JsonTransformer;
compute(
from: string | string[],
to: string,
fn: types.AnyFn
): JsonTransformer;
compute(from: string, fn: types.AnyFn): JsonTransformer;
toString(): string;
}
参数名 | 说明 |
---|---|
data={} | 目标 JSON 对象 |
设置属性值。
参数名 | 说明 |
---|---|
key | 属性路径 |
val | 值 |
如果属性路径为空,整个对象将被值替换。
获取属性值。
参数名 | 说明 |
---|---|
key | 属性路径 |
返回值 | 指定值或整个对象 |
移除属性值。
参数名 | 说明 |
---|---|
key | 属性路径 |
数组 map 的快捷方式。
参数名 | 说明 |
---|---|
from | 源对象路径 |
to | 目标对象路径 |
fn | 真值检测函数 |
数组 filter 的快捷方式。
从多个属性值计算新值。
参数名 | 说明 |
---|---|
from | 源属性路径 |
to | 目标属性路径 |
fn | 计算函数 |
const data = new JsonTransformer({
books: [
{
title: 'Book 1',
price: 5
},
{
title: 'Book 2',
price: 10
}
],
author: {
lastname: 'Su',
firstname: 'RedHood'
}
});
data.filter('books', function(book) {
return book.price > 5;
});
data.compute('author', function(author) {
return author.firstname + author.lastname;
});
data.set('count', data.get('books').length);
data.get(); // -> {books: [{title: 'Book 2', price: 10}], author: 'RedHoodSu', count: 1}
双向链表实现。
namespace LinkedList {
class Node {
value: any;
prev: Node | null;
next: Node | null;
}
}
class LinkedList {
size: number;
head: LinkedList.Node;
tail: LinkedList.Node;
push(val: any): number;
pop(): any;
unshift(val: any): number;
shift(): any;
find(fn: types.AnyFn): LinkedList.Node | void;
delNode(node: LinkedList.Node): void;
forEach(iterator: types.AnyFn, ctx?: any);
toArr(): any[];
}
链表大小。
链表首结点。
链表尾结点。
向链表尾部添加值。
参数名 | 说明 |
---|---|
val | 要添加的值 |
返回值 | 链表大小 |
获取链表尾部值。
向链表头部添加值。
获取链表头部值。
删除节点。
查找节点。
参数名 | 说明 |
---|---|
fn | 真值检测函数 |
返回值 | 第一个通过的节点 |
遍历链表。
将链表转换成 JavaScript 数组。
const linkedList = new LinkedList();
linkedList.push(5);
linkedList.pop(); // -> 5
LocalStorage 存储。
class LocalStore extends Store {
constructor(name: string, data?: {});
}
继承自 Store 类。
参数名 | 说明 |
---|---|
name | LocalStorage 存储名 |
data | 默认数据 |
const store = new LocalStore('licia');
store.set('name', 'licia');
带日志级别的简单日志库。
class Logger extends Emitter {
name: string;
formatter(type: string, argList: any[]): any[];
constructor(name: string, level?: string | number);
setLevel(level: string | number): Logger;
getLevel(): number;
trace(...args: any[]): Logger;
debug(...args: any[]): Logger;
info(...args: any[]): Logger;
warn(...args: any[]): Logger;
error(...args: any[]): Logger;
static level: Enum;
}
参数名 | 说明 |
---|---|
name | 日志名称 |
level=DEBUG | 日志级别 |
设置日志级别。
参数名 | 说明 |
---|---|
level | 日志级别 |
获取当前日志级别。
打日志方法。
TRACE,DEBUG,INFO,WARN,ERROR 和 SILENT。
const logger = new Logger('licia', Logger.level.ERROR);
logger.trace('test');
// Format output.
logger.formatter = function(type, argList) {
argList.push(new Date().getTime());
return argList;
};
logger.on('all', function(type, argList) {
// It's not affected by log level.
});
logger.on('debug', function(argList) {
// Affected by log level.
});
简单 LRU 缓存。
class Lru {
constructor(max: number);
has(key: string): boolean;
remove(key: string): void;
get(key: string): any;
set(key: string, val: any): void;
clear(): void;
}
参数名 | 说明 |
---|---|
max | 最大缓存数 |
检查是否有缓存。
参数名 | 说明 |
---|---|
key | 缓存键名 |
返回值 | 如果有,返回真 |
删除缓存。
参数名 | 说明 |
---|---|
key | 缓存键名 |
获取缓存。
参数名 | 说明 |
---|---|
key | 缓存键名 |
返回值 | 缓存值 |
设置缓存。
参数名 | 说明 |
---|---|
key | 缓存键名 |
val | 缓存值 |
清除所有缓存。
const cache = new Lru(50);
cache.set('test', 'licia');
cache.get('test'); // -> 'licia'
CSS 媒体查询监听器。
class MediaQuery extends Emitter {
constructor(query: string);
setQuery(query: string): void;
isMatch(): boolean;
}
继承自 Emitter 类。
参数名 | 说明 |
---|---|
query | 媒体查询字符串 |
更新查询字符串。
如果媒体查询匹配,返回真。
当媒体查询匹配时触发。
与 match 事件相反。
const mediaQuery = new MediaQuery('screen and (max-width:1000px)');
mediaQuery.isMatch(); // -> false
mediaQuery.on('match', () => {
// Do something...
});
MutationObserver 安全版本,如果不支持,则什么也不做。
const observer = new MutationObserver(function(mutations) {
// Do something.
});
observer.observe(document.documentElement);
observer.disconnect();
优先队列实现。
class PriorityQueue {
size: number;
constructor(cmp?: types.AnyFn);
clear(): void;
enqueue(item: any): number;
dequeue(): any;
peek(): any;
}
队列大小。
参数名 | 说明 |
---|---|
cmp | 比较器 |
清空队列。
元素入列。
参数名 | 说明 |
---|---|
item | 入列元素 |
返回值 | 当前大小 |
获取并删除队列中拥有最高优先级的元素。
同 dequeue,只是不删除。
const queue = new PriorityQueue(function(a, b) {
if (a.priority > b.priority) return 1;
if (a.priority === b.priority) return -1;
return 0;
});
queue.enqueue({
priority: 1000,
value: 'apple'
});
queue.enqueue({
priority: 500,
value: 'orange'
});
queue.dequeue(); // -> { priority: 1000, value: 'apple' }
轻量 Promise 实现。
function get(url) {
return new Promise(function(resolve, reject) {
const req = new XMLHttpRequest();
req.open('GET', url);
req.onload = function() {
req.status == 200
? resolve(req.response)
: reject(Error(req.statusText));
};
req.onerror = function() {
reject(Error('Network Error'));
};
req.send();
});
}
get('test.json').then(function(result) {
// Do something...
});
类似 es6 的 Map,不支持遍历器。
const PseudoMap: typeof Map;
只支持字符串键名,当 Map 存在时会直接使用 Map。
const map = new PseudoMap();
map.set('1', 1);
map.get('1'); // -> 1
队列数据结构。
class Queue {
size: number;
clear(): void;
enqueue(item: any): number;
dequeue(): any;
peek(): any;
forEach(iterator: types.AnyFn, context?: any): void;
toArr(): any[];
}
队列大小。
清空队列。
元素入列。
参数名 | 说明 |
---|---|
item | 入列元素 |
返回值 | 当前大小 |
元素出列。
获取第一个元素但不移除它。
遍历队列。
参数名 | 说明 |
---|---|
iterator | 调用函数 |
ctx | * |
将队列转换为 JavaScript 数组。
const queue = new Queue();
console.log(queue.size); // -> 0
queue.enqueue(2);
queue.enqueue(3);
queue.dequeue(); // -> 2
console.log(queue.size); // -> 1
queue.peek(); // -> 3
console.log(queue.size); // -> 1
不使用链表的 LRU 实现。
class QuickLru {
constructor(max: number);
has(key: string): boolean;
remove(key: string): void;
get(key: string): any;
set(key: string, val: any): void;
clear(): void;
}
参考 hashlru 算法,空间占用相比使用链表更多。
API 与 Lru 模块保持一致。
const cache = new QuickLru(50);
cache.set('test', 'licia');
cache.get('test'); // -> 'licia'
任务就绪回调管理。
class Readiness {
signal(tasks: string | string[]): void;
isReady(tasks: string | string[]): boolean;
ready(tasks: string | string[], fn?: types.AnyFn): Promise<void>;
}
设置任务为就绪状态。
参数名 | 说明 |
---|---|
tasks | 就绪任务 |
注册任务就绪回调。
参数名 | 说明 |
---|---|
tasks | 要监听的任务 |
fn | 任务就绪时触发的回调函数 |
返回值 | 任务就绪时 resolve 的 Promise |
检查任务是否准备就绪。
参数名 | 说明 |
---|---|
tasks | 要检查的任务 |
返回值 | 任务准备就绪,返回真 |
const readiness = new Readiness();
readiness.ready('serverCreated', function() {
// Do something.
});
readiness.signal('serverCreated');
readiness.isReady('serverCreated'); // -> true
简单类 redux 状态管理。
class ReduceStore {
constructor(reducer: types.AnyFn, initialState: any);
subscribe(listener: types.AnyFn): types.AnyFn;
dispatch(action: any): any;
getState(): any;
}
参数名 | 说明 |
---|---|
reducer | 生成下一个状态的函数 |
initialState | 初始状态 |
订阅状态改变事件。
参数名 | 说明 |
---|---|
listener | 回调函数 |
返回值 | 取消订阅函数 |
发出动作。
参数名 | 说明 |
---|---|
action | 描述改变内容的对象 |
返回值 | 传入对象 |
获取当前状态。
const store = new ReduceStore(function(state, action) {
switch (action.type) {
case 'INCREMENT':
return state + 1;
case 'DECREMENT':
return state - 1;
default:
return state;
}
}, 0);
store.subscribe(function() {
console.log(store.getState());
});
store.dispatch({ type: 'INCREMENT' }); // 1
store.dispatch({ type: 'INCREMENT' }); // 2
store.dispatch({ type: 'DECREMENT' }); // 1
检查元素的大小是否发生变化。
class ResizeSensor extends SingleEmitter {
constructor(el: HTMLElement);
destroy(): void;
}
参数名 | 说明 |
---|---|
element | 要监听大小的元素 |
停止监听大小变化事件。
const target = document.getElementById('test');
const sensor = new ResizeSensor(target);
sensor.addListener(function() {
// Trigger if element's size changed.
});
querySelectorAll 的简单包装类。
class Select {
constructor(selector: string | Element | Document);
find(selector: string): Select;
each(fn: types.AnyFn): Select;
}
参数名 | 说明 |
---|---|
selector | 选择器 |
查找子元素。
参数名 | 说明 |
---|---|
selector | 选择器 |
遍历匹配的元素。
参数名 | 说明 |
---|---|
fn | 调用函数 |
const $test = new Select('#test');
$test.find('.test').each(function(idx, element) {
// Manipulate dom nodes
});
限制资源同时访问次数。
class Semaphore {
constructor(counter?: number);
wait(fn: () => void): void;
signal(): void;
}
参数名 | 说明 |
---|---|
counter=1 | 初始计数 |
等待计数器大于 0 时,执行函数。
参数名 | 说明 |
---|---|
fn | 要执行的函数 |
执行队列中未执行任务。
const sem = new Semaphore(10);
require('http')
.createServer((req, res) => {
sem.wait(function() {
res.end('.');
setTimeout(() => sem.signal(), 500);
});
})
.listen(3000);
SessionStorage 存储。
class SessionStore extends Store {
constructor(name: string, data?: any);
}
继承自 Store 类。
参数名 | 说明 |
---|---|
name | SessionStorage 存储名 |
data | 默认数据 |
const store = new SessionStore('licia');
store.set('name', 'licia');
与 Event emitter 类似,但仅有一种事件类型。
class SingleEmitter {
addListener(listener: types.AnyFn): void;
rmListener(listener: types.AnyFn): void;
emit(...args: any[]): void;
rmAllListeners(): void;
static mixin(obj: any): void;
}
添加监听器。
移除监听器。
参数名 | 说明 |
---|---|
listener | 事件监听器 |
移除所有监听器。
触发监听器。
参数名 | 说明 |
---|---|
...args | 传递给监听器的参数 |
【静态】将 SingleEmitter 类的方法绑定到指定对象上去。
参数名 | 说明 |
---|---|
obj | 目标对象 |
const event = new SingleEmitter();
event.addListener(function(name) {
console.log(name);
});
event.emit('licia'); // Logs out 'licia'.
WebSocket 类的简单包装。
class Socket extends Emitter {
constructor(
url: string,
options?: {
protocols?: string | string[];
reconnect?: boolean;
}
);
send(message: any): void;
close(code?: number, reason?: string): void;
connect(): void;
}
继续自 Emitter 类。
参数名 | 说明 |
---|---|
url | WebSocket 地址 |
options | 连接选项 |
可用选项:
参数名 | 说明 |
---|---|
protocols | 协议 |
reconnect=true | 是否尝试重新连接 |
发送数据。
参数名 | 说明 |
---|---|
message | 要发送的数据 |
关闭 WebSocket 连接。
参数名 | 说明 |
---|---|
code | 状态码 |
reason | 关闭原因 |
连接 WebSocket,初始化时就会被调用。
const ws = new Socket('ws://localhost:8001');
ws.on('open', e => ws.send('Hello'));
栈数据结构。
class Stack {
size: number;
clear(): void;
push(item: any): number;
pop(): any;
peek(): any;
forEach(iterator: types.AnyFn, context?: any): void;
toArr(): any[];
}
栈大小。
清空栈。
元素入栈。
参数名 | 说明 |
---|---|
item | 入栈元素 |
返回值 | 当前大小 |
元素出栈。
获取最后一个元素但不移除它。
遍历栈。
参数名 | 说明 |
---|---|
iterator | 调用函数 |
ctx | 函数上下文 |
将栈转换为 JavaScript 数组。
const stack = new Stack();
stack.push(2); // -> 1
stack.push(3); // -> 2
stack.pop(); // -> 3
简单状态机。
class State extends Emitter {
constructor(initial: string, events: any);
is(state: string): boolean;
[event: string]: any;
}
继承自 Emitter 类。
参数名 | 说明 |
---|---|
initial | 初始状态 |
events | 改变状态的事件 |
检查当前状态是否是指定状态。
参数名 | 说明 |
---|---|
state | 要检查的状态 |
返回值 | 如果是,返回真 |
const state = new State('empty', {
load: { from: 'empty', to: 'pause' },
play: { from: 'pause', to: 'play' },
pause: { from: ['play', 'empty'], to: 'pause' },
unload: { from: ['play', 'pause'], to: 'empty' }
});
state.is('empty'); // -> true
state.load();
state.is('pause'); // -> true
state.on('play', function(src) {
console.log(src); // -> 'eustia'
});
state.on('error', function(err, event) {
// Error handler
});
state.play('eustia');
内存存储。
class Store extends Emitter {
constructor(data?: {});
set(key: string, val: any): void;
set(values: {}): void;
get(key: string): any;
get(keys: string[]): {};
remove(key: string): void;
remove(keys: string[]): void;
clear(): void;
each(fn: (...args: any[]) => void): void;
}
继承自 Emitter 类。
参数名 | 说明 |
---|---|
data | 初始数据 |
设置值。
参数名 | 说明 |
---|---|
key | 键名 |
val | 键值 |
设置多个值。
参数名 | 说明 |
---|---|
values | 包含多个键值对的对象 |
该方法被调用时发触发 change 事件。
获取值。
参数名 | 说明 |
---|---|
key | 键名 |
返回值 | 键值 |
获取多个值。
参数名 | 说明 |
---|---|
keys | 键名列表 |
返回值 | 包含多个键值对的对象 |
移除值。
参数名 | 说明 |
---|---|
key | 键名 |
清空数据。
遍历数据。
参数名 | 说明 |
---|---|
fn | 遍历函数 |
const store = new Store('test');
store.set('user', { name: 'licia' });
store.get('user').name; // -> 'licia'
store.clear();
store.each(function(val, key) {
// Do something.
});
store.on('change', function(key, newVal, oldVal) {
// It triggers whenever set is called.
});
解析、处理和生成 Chrome Trace 格式数据。
namespace Trace {
interface IEvent {
name: string;
cat: string;
ph: string;
ts: number;
pid: number;
tid: number;
args: any;
[key: string]: any;
}
class Process {
constructor(id);
id(): string;
name(): string;
addEvent(IEvent): void;
rmEvent(IEvent): void;
getThread(id: number): Thread;
rmThread(id: number): void;
threads(): Thread[];
toJSON(): IEvent[];
}
class Thread {
constructor(id, pid);
id(): string;
name(): string;
addEvent(IEvent): void;
rmEvent(IEvent): void;
events(): IEvent[];
toJSON(): IEvent[];
}
}
class Trace {
constructor(events: Trace.IEvent[]);
addEvent(event: Trace.IEvent);
rmEvent(event: Trace.IEvent);
getProcess(id: number): Trace.Process;
rmProcess(id: number): void;
processes(): Trace.Process[];
toJSON(): Trace.IEvent[];
}
const fs = require('fs');
const data = fs.readFileSync('path/to/trace', 'utf8');
const trace = new Trace(JSON.parse(data));
trace.rmProcess(627);
fs.writeFileSync(
'path/to/trace',
JSON.stringify(trace.toJSON()),
'utf8',
function() {}
);
创建 chrome trace 格式数据。
class Tracing {
constructor(options?: {
pid?: number;
tid?: number;
processName?: string;
threadName?: string;
});
start(cat?: string): void;
stop(): Trace.IEvent[];
metadata(name: string, args: any): void;
begin(cat: string, name: string, args?: any): void;
end(args?: any): void;
asyncBegin(cat: string, name: string, id?: string, args?: any): string;
asyncEnd(id: string, args?: any): void;
instant(
cat: string,
name: string,
scope?: 'g' | 'p' | 't',
args?: any
): void;
id(): string;
}
参数名 | 说明 |
---|---|
options | 录制选项 |
可用选项:
参数名 | 说明 |
---|---|
pid | 进程 id |
tid | 线程 id |
processName | 进程名称 |
threadName | 线程名称 |
开始录制。
参数名 | 说明 |
---|---|
cat | 开启类别 |
停止录制并获取事件列表。
记录开始事件。
参数名 | 说明 |
---|---|
cat | 事件类别 |
name | 事件名称 |
args | 参数 |
记录结束事件。
记录异步开始事件。
记录异步结束事件。
记录 instant 事件。
获取一个唯一 id。
const fs = require('fs');
const tracing = new Tracing();
tracing.start();
tracing.begin('cat', 'name');
// Do something...
tracing.end();
fs.writeFileSync(
'path/to/trace',
JSON.stringify(tracing.stop()),
'utf8',
function() {}
);
字典树数据结构。
class Trie {
add(word: string): void;
remove(word: string): void;
has(word: string): boolean;
words(prefix: string): string[];
clear(): void;
}
添加单词到字典数。
参数名 | 说明 |
---|---|
word | 要添加的单词 |
从字典树中移除单词。
检查字典树中是否存在单词。
获取所有带指定前缀的单词。
参数名 | 说明 |
---|---|
prefix | 单词前缀 |
返回值 | 所有带指定前缀的单词 |
清除字典树中的所有单词。
const trie = new Trie();
trie.add('carpet');
trie.add('car');
trie.add('cat');
trie.add('cart');
trie.has('cat'); // -> true
trie.remove('carpet');
trie.has('carpet'); // -> false
trie.words('car'); // -> ['car', 'cart']
trie.clear();
JavaScript 补间动画库。
class Tween extends Emitter {
constructor(target: any);
to(props: any, duration?: number, ease?: string | Function): Tween;
progress(): number;
progress(progress: number): Tween;
play(): Tween;
pause(): Tween;
paused(): boolean;
}
继承自 Emitter 类。
参数名 | 说明 |
---|---|
obj | 要补间的对象 |
参数名 | 说明 |
---|---|
destination | 目标属性值 |
duration | 补间时长 |
ease | 缓动函数 |
开始播放。
暂停动画。
检查动画是否暂停。
设置或获取动画进度。
参数名 | 说明 |
---|---|
progress | 介于 0 到 1 之间的数字 |
const pos = { x: 0, y: 0 };
const tween = new Tween(pos);
tween
.on('update', function(target) {
console.log(target.x, target.y);
})
.on('end', function(target) {
console.log(target.x, target.y); // -> 100, 100
});
tween.to({ x: 100, y: 100 }, 1000, 'inElastic').play();
简单 url 操作库。
namespace Url {
interface IUrl {
protocol: string;
auth: string;
hostname: string;
hash: string;
query: any;
port: string;
pathname: string;
slashes: boolean;
}
}
class Url {
protocol: string;
auth: string;
hostname: string;
hash: string;
query: any;
port: string;
pathname: string;
slashes: boolean;
constructor(url?: string);
setQuery(name: string, val: string | number): Url;
setQuery(query: types.PlainObj<string | number>): Url;
rmQuery(name: string | string[]): Url;
toString(): string;
static parse(url: string): Url.IUrl;
static stringify(object: Url.IUrl): string;
}
参数名 | 说明 |
---|---|
url=location | url 地址 |
设置 query 值。
参数名 | 说明 |
---|---|
name | query 名 |
val | query 值 |
返回值 | this |
参数名 | 说明 |
---|---|
query | query 对象 |
返回值 | this |
移除 query 值。
参数名 | 说明 |
---|---|
name | query 名 |
返回值 | this |
【静态】将 url 解析成对象。
参数名 | 说明 |
---|---|
url | url 地址 |
返回值 | url 对象 |
【静态】将 url 对象转换为 url 地址。
参数名 | 说明 |
---|---|
url | url 对象 |
返回值 | url 地址 |
url 对象包含以下属性值:
属性名 | 说明 |
---|---|
protocol | 协议名,(如 http:) |
slashes | 协议名后是否有双斜杠 |
auth | 身份验证(例如 用户名:密码) |
hostname | Host 名,不带端口号 |
port | 端口号 |
pathname | URL 路径 |
query | query 对象 |
hash | URL # 字符后边的部分,# 包含在内 |
const url = new Url('http://example.com:8080?eruda=true');
console.log(url.port); // -> '8080'
url.query.foo = 'bar';
url.rmQuery('eruda');
url.toString(); // -> 'http://example.com:8080/?foo=bar'
对象属性值校验。
class Validator {
constructor(options: types.PlainObj<any>);
validate(object: any): string | boolean;
static plugins: any;
static addPlugin(name: string, plugin: types.AnyFn): void;
}
参数名 | 说明 |
---|---|
options | 校验配置 |
校验对象。
参数名 | 说明 |
---|---|
obj | 目标对象 |
返回值 | 校验结果,true 表示通过 |
【静态】添加插件。
参数名 | 说明 |
---|---|
name | 插件名 |
plugin | 校验函数 |
required,number,boolean,string 和 regexp。
Validator.addPlugin('custom', function(val, key, config) {
if (typeof val === 'string' && val.length === 5) return true;
return key + ' should be a string with length 5';
});
const validator = new Validator({
test: {
required: true,
custom: true
}
});
validator.validate({}); // -> 'test is required'
validator.validate({ test: 1 }); // -> 'test should be a string with length 5';
validator.validate({ test: 'licia' }); // -> true
加权轮询调度算法实现。
class Wrr {
size: number;
set(val: any, weight: number): void;
get(val: any): number | void;
remove(val: any): void;
clear(): void;
next(): any;
}
池大小。
设置值和权重,如果值已存在则更新其权重。
参数名 | 说明 |
---|---|
val | 要设置的值 |
weight | 值的权重 |
获取指定值的权重。
参数名 | 说明 |
---|---|
val | 要获取的值 |
返回值 | 值的权重 |
移除指定值。
参数名 | 说明 |
---|---|
val | 要移除的值 |
从池中获取下一个值。
清除所有值。
const pool = new Wrr();
pool.set('A', 4);
pool.set('B', 8);
pool.set('C', 2);
pool.next();
pool.remove('A');
console.log(pool.size); // -> 2
计算字符串集的缩写集合。
function abbrev(...names: string[]): types.PlainObj<string>;
参数名 | 说明 |
---|---|
names | 字符串集 |
返回值 | 缩写集合 |
abbrev('lina', 'luna');
// -> {li: 'lina', lin: 'lina', lina: 'lina', lu: 'luna', lun: 'luna', luna: 'luna'}
创建一个函数,只有在调用 n 次后才会调用一次。
function after<T extends types.AnyFn>(n: number, fn: T): T;
参数名 | 说明 |
---|---|
n | 调用次数 |
fn | 源函数 |
返回值 | 输出函数 |
const fn = after(5, function() {
// -> Only invoke after fn is called 5 times.
});
执行异步 HTTP 请求。
namespace ajax {
function get(
url: string,
data: string | {},
success: types.AnyFn,
dataType?: string
): XMLHttpRequest;
function get(
url: string,
success: types.AnyFn,
dataType?: string
): XMLHttpRequest;
function post(
url: string,
data: string | {},
success: types.AnyFn,
dataType?: string
): XMLHttpRequest;
function post(
url: string,
success: types.AnyFn,
dataType?: string
): XMLHttpRequest;
}
function ajax(options: {
type?: string;
url: string;
data?: string | {};
dataType?: string;
contentType?: string;
success?: types.AnyFn;
error?: types.AnyFn;
complete?: types.AnyFn;
timeout?: number;
}): XMLHttpRequest;
参数名 | 说明 |
---|---|
options | Ajax 选项 |
可用选项:
参数名 | 说明 |
---|---|
type | 请求类型 |
url | 请求地址 |
data | 请求数据 |
dataType=json | 响应类型(json,xml) |
contentType=application/x-www-form-urlencoded | 请求内容类型 |
success | 成功回调 |
error | 失败回调 |
complete | 结束回调 |
timeout | 请求超时 |
type = GET 的快捷方式。
type = POST 的快捷方式。
参数名 | 说明 |
---|---|
url | 请求地址 |
data | 请求数据 |
success | 成功回调 |
dataType | 响应类型 |
ajax({
url: 'http://example.com',
data: { test: 'true' },
error() {},
success(data) {
// ...
},
dataType: 'json'
});
ajax.get('http://example.com', {}, function(data) {
// ...
});
获取对象的所有键名,包括自身的及继承的。
namespace allKeys {
interface IOptions {
prototype?: boolean;
unenumerable?: boolean;
}
}
function allKeys(
obj: any,
options: { symbol: true } & allKeys.IOptions
): Array<string | Symbol>;
function allKeys(
obj: any,
options?: ({ symbol: false } & allKeys.IOptions) | allKeys.IOptions
): string[];
参数名 | 说明 |
---|---|
obj | 目标对象 |
options | 选项 |
返回值 | 包含所有键名的数组 |
可用选项:
参数名 | 说明 |
---|---|
prototype=true | 包含原型键名 |
unenumerable=false | 包含不可枚举键名 |
symbol=false | 包含 Symbol 键名 |
Object 对象原型上的方法不会被获取到。
const obj = Object.create({ zero: 0 });
obj.one = 1;
allKeys(obj); // -> ['zero', 'one']
控制台颜色。
namespace ansiColor {
type IFn = (str: string) => string;
}
const ansiColor: {
black: ansiColor.IFn;
red: ansiColor.IFn;
green: ansiColor.IFn;
yellow: ansiColor.IFn;
blue: ansiColor.IFn;
magenta: ansiColor.IFn;
cyan: ansiColor.IFn;
white: ansiColor.IFn;
gray: ansiColor.IFn;
grey: ansiColor.IFn;
bgBlack: ansiColor.IFn;
bgRed: ansiColor.IFn;
bgGreen: ansiColor.IFn;
bgYellow: ansiColor.IFn;
bgBlue: ansiColor.IFn;
bgMagenta: ansiColor.IFn;
bgCyan: ansiColor.IFn;
bgWhite: ansiColor.IFn;
blackBright: ansiColor.IFn;
redBright: ansiColor.IFn;
greenBright: ansiColor.IFn;
yellowBright: ansiColor.IFn;
blueBright: ansiColor.IFn;
magentaBright: ansiColor.IFn;
cyanBright: ansiColor.IFn;
whiteBright: ansiColor.IFn;
bgBlackBright: ansiColor.IFn;
bgRedBright: ansiColor.IFn;
bgGreenBright: ansiColor.IFn;
bgYellowBright: ansiColor.IFn;
bgBlueBright: ansiColor.IFn;
bgMagentaBright: ansiColor.IFn;
bgCyanBright: ansiColor.IFn;
bgWhiteBright: ansiColor.IFn;
};
black, red, green, yellow, blue, magenta, cyan, white, gray, grey
bgBlack, bgRed, bgGreen, bgYellow, bgBlue, bgMagenta, bgCyan, bgWhite,
blackBright, redBright, greenBright, yellowBright, blueBright, magentaBright, cyanBright, whiteBright
bgBlackBright, bgRedBright, bgGreenBright, bgYellowBright, bgBlueBright, bgMagentaBright, bgCyanBright, bgWhiteBright
ansiColor.red('Warning');
将字符串列表转换为映射。
function arrToMap<T>(
arr: string[],
val?: T
): { [key: string]: T };
参数名 | 说明 |
---|---|
arr | 字符串列表 |
val=true | 键值 |
返回值 | 映射 |
const needPx = arrToMap([
'column-count',
'columns',
'font-weight',
'line-weight',
'opacity',
'z-index',
'zoom'
]);
const key = 'column-count';
let val = '5';
if (needPx[key]) val += 'px';
console.log(val); // -> '5px'
window.atob,运行在 node 环境时使用 Buffer 进行模拟。
function atob(str: string): string;
atob('SGVsbG8gV29ybGQ='); // -> 'Hello World'
获取数字的平均值。
function average(...numbers: number[]): number;
参数名 | 说明 |
---|---|
numbers | 要计算的数字 |
返回值 | 平均值 |
average(5, 3, 1); // -> 3
base64 编解码。
const base64: {
encode(bytes: number[]): string;
decode(str: string): number[];
};
将字节数组编码为 base64 字符串。
参数名 | 说明 |
---|---|
bytes | 字节数组 |
返回值 | base64 编码的字符串 |
将 base64 字符串解码为字节数组。
参数名 | 说明 |
---|---|
str | base64 编码的字符串 |
返回值 | 字节数组 |
base64.encode([168, 174, 155, 255]); // -> 'qK6b/w=='
base64.decode('qK6b/w=='); // -> [168, 174, 155, 255]
创建一个函数,只能调用少于 n 次。
function before<T extends types.AnyFn>(n: number, fn: T): T;
参数名 | 说明 |
---|---|
n | 调用次数 |
fn | 源函数 |
返回值 | 输出函数 |
超过 n 次后再次调用函数将直接返回最后一次函数的调用结果。
const fn = before(5, function() {});
fn(); // Allow function to be call 4 times at last.
二分查找实现。
function binarySearch(
array: any[],
val: any,
cmp?: types.AnyFn
): number;
参数名 | 说明 |
---|---|
array | 目标数组 |
val | 要查找的值 |
cmp | 比较器 |
返回值 | 第一次出现的位置,如果没有,返回 -1 |
binarySearch([1, 2, 3], 2); // -> 1
binarySearch([1, 2], 3); // -> -1
binarySearch(
[
{
key: 1
},
{
key: 2
}
],
{ key: 1 },
(a, b) => {
if (a.key === b.key) return 0;
return a.key < b.key ? -1 : 1;
}
); // -> 0
创建一个绑定到指定对象的函数。
function bind(
fn: types.AnyFn,
ctx: any,
...args: any[]
): types.AnyFn;
参数名 | 说明 |
---|---|
fn | 源函数 |
ctx | 绑定对象 |
args | 可选参数 |
返回值 | 输出函数 |
const fn = bind(
function(msg) {
console.log(this.name + ':' + msg);
},
{ name: 'eustia' },
'I am a utility library.'
);
fn(); // -> 'eustia: I am a utility library.'
window.btoa,运行在 node 环境时使用 Buffer 进行模拟。
function btoa(str: string): string;
btoa('Hello World'); // -> 'SGVsbG8gV29ybGQ='
冒泡排序实现。
function bubbleSort(arr: any[], cmp?: types.AnyFn): any[];
参数名 | 说明 |
---|---|
arr | 要排序的数组 |
cmp | 比较器 |
返回值 | 有序数组 |
bubbleSort([2, 1]); // -> [1, 2]
将字节数组转换为字符串。
function bytesToStr(bytes: number[], encoding?: string): string;
参数名 | 说明 |
---|---|
bytes | 字节数组 |
encoding=utf8 | 字符串编码 |
返回值 | 目标字符串 |
bytesToStr([108, 105, 99, 105, 97]); // -> 'licia'
将字节数组转换为 32 位字长数组。
function bytesToWords(bytes: number[]): number[];
在使用 CryptoJS 时会派上用处。
参数名 | 说明 |
---|---|
bytes | 字节数组 |
返回值 | 字长数组 |
bytesToWords([0x12, 0x34, 0x56, 0x78]); // -> [0x12345678]
缓存模块加载,提高应用启动速度。
function cacheRequire(options?: {
dir?: string;
requirePath?: boolean;
code?: boolean;
compileCache?: boolean;
}): void;
参数名 | 说明 |
---|---|
options | 缓存选项 |
可用选项:
参数名 | 说明 |
---|---|
dir | 缓存文件夹 |
requirePath=true | Whether require path should be cached |
code=false | Whether js code should be cached |
compileCache=true | Whether compile cache should be used |
cacheRequire({
dir: 'path/to/cache/dir'
});
将返回 Promise 的函数转换为使用回调的函数。
function callbackify(fn: types.AnyFn): types.AnyFn;
参数名 | 说明 |
---|---|
fn | 返回 Promise 的函数 |
返回值 | 使用回调的函数 |
function fn() {
return new Promise(function(resolve, reject) {
// ...
});
}
const cbFn = callbackify(fn);
cbFn(function(err, value) {
// ...
});
将字符串转换为驼峰式。
function camelCase(str: string): string;
参数名 | 说明 |
---|---|
str | 源字符串 |
返回值 | 驼峰式字符串 |
camelCase('foo-bar'); // -> fooBar
camelCase('foo bar'); // -> fooBar
camelCase('foo_bar'); // -> fooBar
camelCase('foo.bar'); // -> fooBar
将字符串的第一个字符转换为大写,其余字符转换为小写。
function capitalize(str: string): string;
参数名 | 说明 |
---|---|
str | 源字符串 |
返回值 | 目标字符串 |
capitalize('rED'); // -> Red
将值转换为属性路径数组。
function castPath(path: string | string[], obj?: any): string[];
参数名 | 说明 |
---|---|
path | 要转换的值 |
obj | 目标对象 |
返回值 | 属性路径数组 |
castPath('a.b.c'); // -> ['a', 'b', 'c']
castPath(['a']); // -> ['a']
castPath('a[0].b'); // -> ['a', '0', 'b']
castPath('a.b.c', { 'a.b.c': true }); // -> ['a.b.c']
字符串居中。
function centerAlign(
str: string | string[],
width?: number
): string;
参数名 | 说明 |
---|---|
str | 源字符串 |
width | 每行宽度 |
返回值 | 居中字符串 |
centerAlign('test', 8); // -> ' test'
centerAlign('test\nlines', 8); // -> ' test\n lines'
centerAlign(['test', 'lines'], 8); // -> ' test\n lines'
在容器内读取 cgroup 信息。
const cgroup: {
cpu: {
stat(): {
usage: number;
};
max(): number;
};
cpuset: {
cpus(): {
effective: number[];
};
};
memory: {
max(): number;
current(): number;
};
version(): number;
};
cgroup.cpu.stat();
根据指定的整数返回 unicode 编码为该整数的字符。
function char(num: number): string;
参数名 | 说明 |
---|---|
num | 要转换的整数 |
返回值 | 对应字符 |
char(65); // -> 'A'
char(97); // -> 'a'
将数组拆分为指定长度的子数组。
function chunk(arr: any[], size?: number): Array<any[]>;
参数名 | 说明 |
---|---|
arr | 源数组 |
size=1 | 子数组的长度 |
返回值 | 目标数组 |
chunk([1, 2, 3, 4], 2); // -> [[1, 2], [3, 4]]
chunk([1, 2, 3, 4], 3); // -> [[1, 2, 3], [4]]
chunk([1, 2, 3, 4]); // -> [[1], [2], [3], [4]]
将数字限定于指定区间。
function clamp(n: number, lower: number, upper: number): number;
function clamp(n: number, upper: number): number;
参数名 | 说明 |
---|---|
n | 要处理的数字 |
lower | 下限 |
upper | 上限 |
返回值 | 限定后的数字 |
clamp(-10, -5, 5); // -> -5
clamp(10, -5, 5); // -> 5
clamp(2, -5, 5); // -> 2
clamp(10, 5); // -> 5
clamp(2, 5); // -> 2
合并 class。
function className(...names: any[]): string;
参数名 | 说明 |
---|---|
names | 要合并的 class |
返回值 | 合并后的 class 字符串 |
className('a', 'b', 'c'); // -> 'a b c'
className('a', false, 'b', 0, 1, 'c'); // -> 'a b 1 c'
className('a', ['b', 'c']); // -> 'a b c'
className('a', { b: false, c: true }); // -> 'a c'
className('a', ['b', 'c', { d: true, e: false }]); // -> 'a b c d';
输出命令行帮助。
namespace cliHelp {
interface IOption {
name: string;
shorthand?: string;
desc: string;
}
interface ICommand {
name: string;
desc: string;
usage: string | string[];
options?: IOption[];
}
interface IData {
name: string;
usage: string | string[];
commands: ICommand[];
}
}
function cliHelp(data: cliHelp.IData | cliHelp.ICommand): string;
参数名 | 说明 |
---|---|
data | 帮助数据 |
返回值 | 命令行帮助 |
const test = {
name: 'test',
desc: 'Generate test files',
usage: ['<module-name> [options]', 'lpad --browser'],
options: [
{
name: 'browser',
shorthand: 'b',
desc: 'True if test should run in a browser'
}
]
};
const data = {
name: 'licia',
usage: '<command> [options]',
commands: [test]
};
cliHelp(data);
cliHelp(test);
对指定对象进行浅复制。
function clone<T>(val: T): T;
任何嵌套的对象或数组只会拷贝其引用。
参数名 | 说明 |
---|---|
val | 要克隆的值 |
返回值 | 克隆值 |
clone({ name: 'eustia' }); // -> {name: 'eustia'}
深复制。
function cloneDeep<T>(val: T): T;
参数名 | 说明 |
---|---|
val | 要克隆的值 |
返回值 | 克隆值 |
const obj = [{ a: 1 }, { a: 2 }];
const obj2 = cloneDeep(obj);
console.log(obj[0] === obj2[1]); // -> false
比较版本号。
function cmpVersion(v1: string, v2: string): number;
参数名 | 说明 |
---|---|
v1 | 版本号 |
v2 | 版本号 |
返回值 | 比较结果 |
cmpVersion('1.1.8', '1.0.4'); // -> 1
cmpVersion('1.0.2', '1.0.2'); // -> 0
cmpVersion('2.0', '2.0.0'); // -> 0
cmpVersion('3.0.1', '3.0.0.2'); // -> 1
cmpVersion('1.1.1', '1.2.3'); // -> -1
创建一个数组,用一个数组的值作为其键名,另一个数组的值作为其值。
function combine(keys: string[], values: any[]): any;
参数名 | 说明 |
---|---|
keys | 键名数组 |
values | 键值数组 |
返回值 | 目标对象 |
combine(['a', 'b', 'c'], [1, 2, 3]); // -> {a: 1, b: 2, c: 3}
返回数组的拷贝并移除其中的虚值。
function compact(arr: any[]): any[];
虚值包括 false,null,0,空字符串,undefined 和 NaN。
参数名 | 说明 |
---|---|
arr | 源数组 |
返回值 | 目标数组 |
compact([0, 1, false, 2, '', 3]); // -> [1, 2, 3]
将多个函数组合成一个函数。
function compose(...fn: types.AnyFn[]): types.AnyFn;
每个函数使用下一个函数的返回值作为参数。
参数名 | 说明 |
---|---|
...fn | 要组合的函数 |
返回值 | 目标函数 |
const welcome = compose(
function(name) {
return 'hi: ' + name;
},
function(name) {
return name.toUpperCase() + '!';
}
);
welcome('licia'); // -> 'hi: LICIA!'
使用 canvas 对图像进行压缩。
function compressImg(
file: File | Blob | string,
cb: types.AnyFn
): void;
function compressImg(
file: File | Blob | string,
options?: {
maxWidth?: number;
maxHeight?: number;
width?: number;
height?: number;
mimeType?: string;
quality?: number;
},
cb?: types.AnyFn
): void;
参数名 | 说明 |
---|---|
file | 图片文件或 url |
options | 选项 |
cb | 回调 |
可用选项:
参数名 | 说明 |
---|---|
maxWidth | 最大宽度 |
maxHeight | 最大高度 |
width | 输出图片宽度 |
height | 输出图片高度 |
mimeType | Mine 类型 |
quality=0.8 | 图片质量,从 0 到 1 |
为了保持图片比例,当宽度设置时高度将被忽略。
如果设置了宽高,最大宽度跟最大高度将被忽略。
const file = new Blob([]);
compressImg(
file,
{
maxWidth: 200
},
function(err, file) {
// ...
}
);
将多个数组合并成一个数组。
function concat(...args: Array<any[]>): any[];
参数名 | 说明 |
---|---|
...arr | 要合并的数组 |
返回值 | 合并后的数组 |
concat([1, 2], [3], [4, 5]); // -> [1, 2, 3, 4, 5]
检查数组中是否有指定值。
function contain(arr: any[] | {} | string, val: any): boolean;
参数名 | 说明 |
---|---|
target | 目标对象 |
val | 要检查的值 |
返回值 | 如果有,返回真 |
contain([1, 2, 3], 1); // -> true
contain({ a: 1, b: 2 }, 1); // -> true
contain('abc', 'a'); // -> true
在容器内读取容器信息。
const container: {
cpuNum(): number;
cpuUsage(period?: number): Promise<number>;
cpuLoad(period?: number): Promise<number>;
memUsage(): number;
memLoad(): number;
};
container.cpuNum();
对数字进行进制转换。
function convertBase(
num: number | string,
from: number,
to: number
): string;
参数名 | 说明 |
---|---|
num | 要转换的数字 |
from | 源进制 |
to | 目标进制 |
返回值 | 转换后的数字 |
convertBase('10', 2, 10); // -> '2'
convertBase('ff', 16, 2); // -> '11111111'
二进制数据格式转换。
namespace convertBin {
function blobToArrBuffer(blob: any): Promise<ArrayBuffer>;
}
function convertBin(bin: any, type: string): any;
参数名 | 说明 |
---|---|
bin | 源二进制数据 |
type | 二进制类型 |
返回值 | 目标二进制数据 |
base64, ArrayBuffer, Array, Uint8Array, Blob(browser), Buffer(node)
因为将 Blob 转换为其它格式是个异步过程,所以你不能直接对它进行转换。
将 Blob 类型转换为 ArrayBuffer 类型。
参数名 | 说明 |
---|---|
blob | Blob 数据 |
返回值 | ArrayBuffer promise |
convertBin('qK6b/w==', 'Uint8Array'); // -> [168, 174, 155, 255]
convertBin.blobToArrBuffer(new Blob([])).then(arrBuffer => {
// Do something...
});
浏览器 cookie 操作库。
namespace cookie {
interface IOptions {
path?: string;
expires?: number;
domain?: string;
secure?: boolean;
}
interface ICookie {
get(key: string, options?: cookie.IOptions): string;
set(key: string, val: string, options?: cookie.IOptions): ICookie;
remove(key: string, options?: cookie.IOptions): ICookie;
}
}
const cookie: cookie.ICookie;
获取 cookie 值。
参数名 | 说明 |
---|---|
key | Cookie 键名 |
返回值 | 对应的 cookie 值 |
设置 cookie 值。
参数名 | 说明 |
---|---|
key | cookie 键名 |
val | cookie 值 |
options | cookie 选项 |
返回值 | cookie 模块 |
移除 cookie 值。
参数名 | 说明 |
---|---|
key | Cookie 键名 |
options | Cookie 选项 |
返回值 | cookie 模块 |
cookie.set('a', '1', { path: '/' });
cookie.get('a'); // -> '1'
cookie.remove('a');
使用 document.execCommand 将文本拷贝到剪贴板。
function copy(text: string, cb?: types.AnyFn): void;
参数名 | 说明 |
---|---|
text | 要拷贝的文本 |
cb | 可选回调 |
copy('text', function(err) {
// Handle errors.
});
CRC1 算法实现。
function crc1(
input: string | number[],
previous?: number
): number;
参数名 | 说明 |
---|---|
input | 信息码 |
previous | 用于累积计算的 CRC1 校验码 |
返回值 | CRC1 校验码 |
crc1('1234567890').toString(16); // -> 'd'
CRC16 算法实现。
function crc16(
input: string | number[],
previous?: number
): number;
参数名 | 说明 |
---|---|
input | 信息码 |
previous | 用于累积计算的 CRC16 校验码 |
返回值 | CRC16 校验码 |
crc16('1234567890').toString(16); // -> 'c57a'
CRC32 算法实现。
function crc32(
input: string | number[],
previous?: number
): number;
参数名 | 说明 |
---|---|
input | 信息码 |
previous | 用于累积计算的 CRC32 校验码 |
返回值 | CRC32 校验码 |
crc32('1234567890').toString(16); // -> '261daee5'
CRC8 算法实现。
function crc8(
input: string | number[],
previous?: number
): number;
参数名 | 说明 |
---|---|
input | 信息码 |
previous | 用于累积计算的 CRC8 校验码 |
返回值 | CRC8 校验码 |
crc8('1234567890').toString(16); // -> '52'
创建对象并指定它的原型。
function create(proto?: object): any;
参数名 | 说明 |
---|---|
proto | 新对象原型 |
返回值 | 目标对象 |
const obj = create({ a: 1 });
console.log(obj.a); // -> 1
用于创建 extend,extendOwn 和 defaults 等模块。
function createAssigner(
keysFn: types.AnyFn,
defaults: boolean
): types.AnyFn;
参数名 | 说明 |
---|---|
keysFn | 获取对象键名的函数 |
defaults | 设置为真时不对值进行覆盖 |
返回值 | 目标函数 |
CreateObjectURL 的包裹函数。
function createUrl(
data: any,
options?: { type?: string }
): string;
参数名 | 说明 |
---|---|
data | 数据 |
options | 当数据不是 File 或者 Blob 对象时使用 |
返回值 | Blob 地址 |
createUrl('test', { type: 'text/plain' }); // -> Blob url
createUrl(['test', 'test']);
createUrl(new Blob([]));
createUrl(new File(['test'], 'test.txt'));
CSS 解析器。
const css: {
parse(css: string): object;
stringify(stylesheet: object, options?: { indent?: string }): string;
};
注释会被移除掉。
将 CSS 字符串转换为 js 对象。
参数名 | 说明 |
---|---|
css | CSS 字符串 |
返回值 | js 对象 |
将 js 对象序列化成 CSS 字符串。
参数名 | 说明 |
---|---|
stylesheet | 要序列化的对象 |
options | 序列化选项 |
返回值 | CSS 字符串 |
选项:
参数名 | 说明 |
---|---|
indent=' ' | 缩进 |
const stylesheet = css.parse('.name { background: #000; color: red; }');
// {type: 'stylesheet', rules: [{type: 'rule', selector: '.name', declarations: [...]}]}
css.stringify(stylesheet);
计算与比较 CSS 选择器/样式的优先级。
namespace cssPriority {
function compare(p1: number[], p2: number[]): number;
}
function cssPriority(
selector: string,
options?: {
important?: boolean;
inlineStyle?: boolean;
position?: number;
}
): number[];
参数名 | 说明 |
---|---|
selector | CSS 选择器 |
options | 样式额外信息 |
返回值 | 优先级数组 |
优先级数组包括六个数字值。
比较优先级。
参数名 | 说明 |
---|---|
p1 | 优先级数组 |
p2 | 优先级数组 |
返回值 | 比较结果 |
cssPriority('a.button > i.icon:before', {
important: true,
inlineStyle: false,
position: 100
}); // -> [1, 0, 0, 2, 3, 100]
检查浏览器是否支持某项 CSS 特性。
function cssSupports(name: string, val?: string): boolean;
参数名 | 说明 |
---|---|
name | Css 属性名 |
val | Css 属性值 |
返回值 | 如果支持,返回真 |
cssSupports('display', 'flex'); // -> true
cssSupports('display', 'invalid'); // -> false
cssSupports('text-decoration-line', 'underline'); // -> true
cssSupports('grid'); // -> true
cssSupports('invalid'); // -> false
函数柯里化。
function curry(fn: types.AnyFn): types.AnyFn;
参数名 | 说明 |
---|---|
fn | 源函数 |
返回值 | 目标函数 |
const add = curry(function(a, b) {
return a + b;
});
const add1 = add(1);
add1(2); // -> 3
解析序列化 Data URL。
const dataUrl: {
parse(
dataUrl: string
): { data: string; mime: string; charset: string; base64: boolean } | null;
stringify(
data: any,
mime: string,
options?: { base64?: boolean; charset?: string }
): string;
};
解析 Data URL。
参数名 | 说明 |
---|---|
dataUrl | Data URL 字符串 |
返回值 | 解析后的对象 |
将数据转化为 Data URL。
参数名 | 说明 |
---|---|
data | 要转化的数据 |
mime | mime 类型 |
options | Stringify options |
返回值 | Data url string |
选项名 | 说明 |
---|---|
base64=true | 是否是 base64 编码 |
charset | 字符集 |
dataUrl.parse('data:,Hello%2C%20World%21'); // -> {data: 'Hello, World!', mime: 'text/plain', charset: '', base64: false}
dataUrl.stringify('Hello, World!', 'text/plain'); // -> 'data:,Hello%2C%20World%21'
简单日期格式化。
function dateFormat(
date: Date,
mask: string,
utc?: boolean,
gmt?: boolean
): string;
function dateFormat(
mask: string,
utc?: boolean,
gmt?: boolean
): string;
参数名 | 说明 |
---|---|
date=new Date | 要格式化的日期对象 |
mask | 日期掩码 |
utc=false | 是否是 UTC |
gmt=false | 是否是 GMT |
返回值 | 格式化日期 |
掩码 | 说明 |
---|---|
d | 月份天数,不补零 |
dd | 月份天数,不足两位补零 |
ddd | 星期几,简称 |
dddd | 星期几,全称 |
m | 月份,数字,不补零 |
mm | 月份,数字,不足两位补零 |
mmm | 月份,简称 |
mmmm | 月份,全称 |
yy | 年份,只显示后两位数字,不足两位补零 |
yyyy | 年份,显示四位数字 |
h | 小时,不补零 (12 小时制) |
hh | 小时,不足两位补零(12 小时制) |
H | 小时,不补零(24 小时制) |
HH | 小时,不足两位补零(24 小时制) |
M | 分钟,不补零 |
MM | 分钟,不足两位补零 |
s | 秒数,不补零 |
ss | 秒数,不足两位补零 |
l L | 毫秒,l 显示 3 位, L 显示 2 位 |
t | 小写显示上午下午,a 或 p |
tt | 小写显示上午下午,am 或 pm |
T | 大写显示上午下午,A 或 P |
TT | 大写显示上午下午,AM 或 PM |
Z | 美国时区缩写,比如 EST 或 MDT |
o | GMT/UTC 时区时差,比如 -0500 或 +0230 |
S | 月份天数序数后缀 (st,nd,rd,或 th) |
UTC: | 是否是 UTC,必须写在最前面 |
dateFormat('isoDate'); // -> 2016-11-19
dateFormat('yyyy-mm-dd HH:MM:ss'); // -> 2016-11-19 19:00:04
dateFormat(new Date(), 'yyyy-mm-dd'); // -> 2016-11-19
返回函数的防反跳版本。
function debounce<T extends types.AnyFn>(fn: T, wait: number): T;
参数名 | 说明 |
---|---|
fn | 源函数 |
wait | 延迟毫秒数 |
返回值 | 目标函数 |
const calLayout = debounce(function() {}, 300);
// $(window).resize(calLayout);
简单的 JavaScript 输出 debug 日志函数。
function debug(name: string): any;
参数名 | 说明 |
---|---|
name | 名称 |
返回值 | 打印格式化日志的函数 |
const d = debug('test');
d('doing lots of uninteresting work');
d.enabled = false;
转换拉丁语-1补充字母和拉丁语扩展字母-A为基本拉丁字母,并且去除组合变音标记。
function deburr(str: string): string;
参数名 | 说明 |
---|---|
str | 要处理的字符串 |
返回值 | 目标字符串 |
deburr('déjà vu'); // -> 'deja vu'
类似 decodeURIComponent 函数,只是输入不合法时不抛出错误并尽可能地对其进行解码。
function decodeUriComponent(str: string): string;
参数名 | 说明 |
---|---|
str | 要解码的字符串 |
返回值 | 解码后的字符串 |
decodeUriComponent('%%25%'); // -> '%%%'
decodeUriComponent('%E0%A4%A'); // -> '\xE0\xA4%A'
填充对象的默认值。
function defaults(obj: any, ...src: any[]): any;
参数名 | 说明 |
---|---|
obj | 目标对象 |
...src | 提供默认值对象 |
返回值 | 目标对象 |
defaults({ name: 'RedHood' }, { name: 'Unknown', age: 24 }); // -> {name: 'RedHood', age: 24}
定义一个模块,需要跟 use 模块配合使用。
function define(
name: string,
requires: string[],
method: types.AnyFn
): void;
function define(name: string, method: types.AnyFn): void;
参数名 | 说明 |
---|---|
name | 模块名 |
requires | 依赖 |
method | 模块主体函数 |
模块主体函数只有被 use 模块使用时才会被执行。
define('A', function() {
return 'A';
});
define('B', ['A'], function(A) {
return 'B' + A;
});
Object.defineProperty(defineProperties) 的快捷方式。
function defineProp<T>(
obj: T,
prop: string,
descriptor: PropertyDescriptor
): T;
function defineProp<T>(
obj: T,
descriptor: PropertyDescriptorMap
): T;
参数名 | 说明 |
---|---|
obj | 要定义的对象 |
prop | 属性路径 |
descriptor | 属性描述 |
返回值 | 传入对象 |
参数名 | 说明 |
---|---|
obj | 要定义的对象 |
prop | 属性描述 |
返回值 | 传入对象 |
const obj = { b: { c: 3 }, d: 4, e: 5 };
defineProp(obj, 'a', {
get: function() {
return this.e * 2;
}
});
// obj.a is equal to 10
defineProp(obj, 'b.c', {
set: function(val) {
// this is pointed to obj.b
this.e = val;
}.bind(obj)
});
obj.b.c = 2;
// obj.a is equal to 4
const obj2 = { a: 1, b: 2, c: 3 };
defineProp(obj2, {
a: {
get: function() {
return this.c;
}
},
b: {
set: function(val) {
this.c = val / 2;
}
}
});
// obj2.a is equal to 3
obj2.b = 4;
// obj2.a is equal to 2
返回第一个不是未定义的参数。
function defined(...args: any[]): any;
参数名 | 说明 |
---|---|
...args | 参数列表 |
返回值 | 第一个定义了的参数 |
defined(false, 2, void 0, 100); // -> false
删除 node.js require 缓存。
function delRequireCache(id: string): void;
参数名 | 说明 |
---|---|
id | 模块名或路径 |
const licia = require('licia');
licia.a = 5;
delRequireCache('licia');
require('licia').a; // -> undefined
在指定时长后执行函数。
function delay(
fn: types.AnyFn,
wait: number,
...args: any[]
): void;
参数名 | 说明 |
---|---|
fn | 源函数 |
wait | 延迟的毫秒数 |
...args | 绑定参数 |
delay(
function(text) {
console.log(text);
},
1000,
'later'
);
// -> Logs 'later' after one second
事件委托。
const delegate: {
add(el: Element, type: string, selector: string, cb: types.AnyFn): void;
remove(el: Element, type: string, selector: string, cb: types.AnyFn): void;
};
添加事件委托。
参数名 | 说明 |
---|---|
el | 父元素 |
type | 事件类型 |
selector | 匹配选择器 |
cb | 事件回调 |
移除事件委托。
const container = document.getElementById('container');
function clickHandler() {
// Do something...
}
delegate.add(container, 'click', '.children', clickHandler);
delegate.remove(container, 'click', '.children', clickHandler);
Node.js util.deprecate 方法,支持浏览器。
function deprecate(fn: types.AnyFn, msg: string): types.AnyFn;
参数名 | 说明 |
---|---|
fn | 即将废弃的方法 |
msg | 调用警告 |
返回值 | 废弃方法,调用时会打印警告 |
const fn = () => {};
const obsoleteFn = deprecate(fn, 'obsoleteFn is deprecated.');
obsoleteFn();
使用 ua 检测浏览器信息。
function detectBrowser(
ua?: string
): {
name: string;
version: number;
};
参数名 | 说明 |
---|---|
ua=navigator.userAgent | 浏览器用户代理 |
返回值 | 包含名称和版本的对象 |
支持浏览器:ie,chrome,edge,firefox,opera,safari,ios(mobile safari),android(android browser)
const browser = detectBrowser();
if (browser.name === 'ie' && browser.version < 9) {
// Do something about old IE...
}
检测是否有 mocha 测试框架在运行。
function detectMocha(): boolean;
detectMocha(); // -> True if mocha is running.
使用 ua 检测操作系统。
function detectOs(ua?: string): string;
参数名 | 说明 |
---|---|
ua=navigator.userAgent | 浏览器用户代理 |
返回值 | 操作系统名称 |
支持操作系统: windows, os x, linux, ios, android, windows phone
if (detectOs() === 'ios') {
// Do something about ios...
}
创建一个数组,该数组的元素不存在于给定的其它数组中。
function difference(arr: any[], ...args: any[]): any[];
参数名 | 说明 |
---|---|
arr | 源数组 |
...args | 要排除的元素 |
返回值 | 目标数组 |
difference([3, 2, 1], [4, 2]); // -> [3, 1]
将字符串转换为点式。
function dotCase(str: string): string;
参数名 | 说明 |
---|---|
str | 源字符串 |
返回值 | 点式字符串 |
dotCase('fooBar'); // -> foo.bar
dotCase('foo bar'); // -> foo.bar
在浏览器端触发文件下载。
function download(
data: Blob | File | string | any[],
name: string,
type?: string
): void;
参数名 | 说明 |
---|---|
data | 下载的数据 |
name | 文件名 |
type=text/plain | 数据类型 |
download('test', 'test.txt');
简单时间格式化。
function durationFormat(duration: number, mask?: string): string;
参数名 | 说明 |
---|---|
duration | 要格式化的时间,单位为毫秒 |
mask='hh:mm:ss' | 时间掩码 |
返回值 | 格式化时间 |
掩码 | 说明 |
---|---|
d | 天数 |
h | 小时数 |
m | 分钟数 |
s | 秒数 |
l | 毫秒数 |
durationFormat(12345678); // -> '03:25:45'
durationFormat(12345678, 'h:m:s:l'); // -> '3:25:45:678'
遍历集合中的所有元素,用每个元素当做参数调用迭代器。
function each<T>(
list: types.List<T>,
iterator: types.ListIterator<T, void>,
ctx?: any
): types.List<T>;
function each<T>(
object: types.Dictionary<T>,
iterator: types.ObjectIterator<T, void>,
ctx?: any
): types.Collection<T>;
参数名 | 说明 |
---|---|
obj | 目标集合 |
iterator | 迭代器 |
ctx | 函数上下文 |
each({ a: 1, b: 2 }, function(val, key) {});
缓动函数,参考 http://jqueryui.com/ 。
const easing: {
linear(percent: number): number;
inQuad(percent: number): number;
outQuad(percent: number): number;
inOutQuad(percent: number): number;
outInQuad(percent: number): number;
inCubic(percent: number): number;
outCubic(percent: number): number;
inQuart(percent: number): number;
outQuart(percent: number): number;
inQuint(percent: number): number;
outQuint(percent: number): number;
inExpo(percent: number): number;
outExpo(percent: number): number;
inSine(percent: number): number;
outSine(percent: number): number;
inCirc(percent: number): number;
outCirc(percent: number): number;
inElastic(percent: number, elasticity?: number): number;
outElastic(percent: number, elasticity?: number): number;
inBack(percent: number): number;
outBack(percent: number): number;
inOutBack(percent: number): number;
outInBack(percent: number): number;
inBounce(percent: number): number;
outBounce(percent: number): number;
};
参数名 | 说明 |
---|---|
percent | 位于 0 到 1 之前的数字 |
返回值 | 计算结果 |
easing.linear(0.5); // -> 0.5
easing.inElastic(0.5, 500); // -> 0.03125
在桌面端浏览器模拟 touch 事件。
function emulateTouch(el: Element): void;
参数名 | 说明 |
---|---|
el | 目标元素 |
const el = document.querySelector('#test');
emulateTouch(el);
el.addEventListener('touchstart', () => {}, false);
检查字符串是否以指定字符串结尾。
function endWith(str: string, suffix: string): boolean;
参数名 | 说明 |
---|---|
str | 目标字符串 |
suffix | 字符串后缀 |
返回值 | 如果是后缀,返回真 |
endWith('ab', 'b'); // -> true
转义 HTML 字符串,替换 &,<,>,",`,和 ' 字符。
function escape(str: string): string;
参数名 | 说明 |
---|---|
str | 源字符串 |
返回值 | 目标字符串 |
escape('You & Me'); // -> 'You & Me'
转义字符串为合法的 JavaScript 字符串字面量。
function escapeJsStr(str: string): string;
http://www.ecma-international.org/ecma-262/5.1/#sec-7.8.4
参数名 | 说明 |
---|---|
str | 源字符串 |
返回值 | 目标字符串 |
escapeJsStr('"\n'); // -> '\\"\\\\n'
转义特殊字符用于 RegExp 构造函数。
function escapeRegExp(str: string): string;
参数名 | 说明 |
---|---|
str | 源字符串 |
返回值 | 目标字符串 |
escapeRegExp('[licia]'); // -> '\\[licia\\]'
加载 css 到页面中。
function evalCss(css: string): HTMLStyleElement;
参数名 | 说明 |
---|---|
css | css 代码 |
返回值 | style 节点 |
evalCss('body{background:#08c}');
在指定的上下文执行 js 代码。
function evalJs(js: string, ctx?: any): void;
参数名 | 说明 |
---|---|
js | JavaScript 代码 |
ctx=global | 上下文 |
evalJs('5+2'); // -> 7
evalJs('this.a', { a: 2 }); // -> 2
检查是否集合中的所有元素都能通过真值检测。
function every<T>(
object: types.List<T>,
iterator?: types.ListIterator<T, boolean>,
context?: any
): boolean;
function every<T>(
object: types.Dictionary<T>,
iterator?: types.ObjectIterator<T, boolean>,
context?: any
): boolean;
参数名 | 说明 |
---|---|
object | 目标集合 |
iterator | 真值检测函数 |
context | 函数上下文 |
返回值 | 如果都能通过,返回真 |
every([2, 4], function(val) {
return val % 2 === 0;
}); // -> true
复制多个对象中的所有属性到目标对象上。
function extend(destination: any, ...sources: any[]): any;
参数名 | 说明 |
---|---|
destination | 目标对象 |
...sources | 源对象 |
返回值 | 目标对象 |
extend({ name: 'RedHood' }, { age: 24 }); // -> {name: 'RedHood', age: 24}
类似 extend,但会递归进行扩展。
function extendDeep(destination: any, ...sources: any[]): any;
参数名 | 说明 |
---|---|
destination | 目标对象 |
...sources | 源对象 |
返回值 | 目标对象 |
extendDeep(
{
name: 'RedHood',
family: {
mother: 'Jane',
father: 'Jack'
}
},
{
family: {
brother: 'Bruce'
}
}
);
// -> {name: 'RedHood', family: {mother: 'Jane', father: 'Jack', brother: 'Bruce'}}
类似 extend,但只复制自己的属性,不包括原型链上的属性。
function extendOwn(destination: any, ...sources: any[]): any;
参数名 | 说明 |
---|---|
obj | 目标对象 |
...sources | 源对象 |
返回值 | 目标对象 |
extendOwn({ name: 'RedHood' }, { age: 24 }); // -> {name: 'RedHood', age: 24}
从源码中提取块注释。
function extractBlockCmts(str: string): string[];
参数名 | 说明 |
---|---|
str | 源码 |
返回值 | 块注释 |
extractBlockCmts('\/*licia*\/'); // -> ['licia']
从文本中提取 url。
function extractUrls(str: string): string[];
参数名 | 说明 |
---|---|
str | 文本 |
返回值 | url 列表 |
const str =
'[Official site: http://eustia.liriliri.io](http://eustia.liriliri.io)';
extractUrls(str); // -> ['http://eustia.liriliri.io']
将 XMLHttpRequest 转换为 promise 的形式。
namespace fetch {
interface IResult {
ok: boolean;
status: number;
statusText: string;
url: string;
clone(): IResult;
text(): Promise<string>;
json(): Promise<any>;
xml(): Promise<Document | null>;
blob(): Promise<Blob>;
headers: {
keys(): string[];
entries(): Array<string[]>;
get(name: string): string;
has(name: string): boolean;
};
}
}
function fetch(
url: string,
options?: {
method?: string;
timeout?: number;
headers?: types.PlainObj<string>;
body?: any;
}
): Promise<fetch.IResult>;
注意:这并不是 fetch 的 pollyfill。
参数名 | 说明 |
---|---|
url | 请求地址 |
options | 请求选项 |
返回值 | 请求 promise |
fetch('test.json', {
method: 'GET',
timeout: 3000,
headers: {},
body: ''
})
.then(function(res) {
return res.json();
})
.then(function(data) {
console.log(data);
});
计算斐波那契数列中某位数字。
function fibonacci(n: number): number;
参数名 | 说明 |
---|---|
n | 序号 n |
返回值 | 斐波那契数列 n 位的数字 |
fibonacci(1); // -> 1
fibonacci(3); // -> 2
将字节数转换为易于阅读的形式。
function fileSize(bytes: number): string;
参数名 | 说明 |
---|---|
bytes | 文件字节大小 |
返回值 | 易于阅读的文件大小 |
fileSize(5); // -> '5'
fileSize(1500); // -> '1.46K'
fileSize(1500000); // -> '1.43M'
fileSize(1500000000); // -> '1.4G'
fileSize(1500000000000); // -> '1.36T'
使用幻数检测文件类型。
function fileType(
input: Buffer | ArrayBuffer | Uint8Array
):
| {
ext: string;
mime: string;
}
| undefined;
参数名 | 说明 |
---|---|
input | 文件输入 |
返回值 | 包括扩展名和 mime 类型的对象 |
jpg, png, gif, webp, bmp, gz, zip, rar, pdf, exe
const fs = require('fs');
const file = fs.readFileSync('path/to/file');
console.log(fileType(file)); // -> { ext: 'jpg', mime: 'image/jpeg' }
将文件路径转换为文件协议 URL。
function fileUrl(path: string): string;
参数名 | 说明 |
---|---|
path | 文件路径 |
返回值 | 文件协议 URL |
fileUrl('c:\\foo\\bar'); // -> 'file:///c:/foo/bar'
在数组指定位置填充指定值。
function fill(
list: any[],
val: any,
start?: number,
end?: number
): any[];
参数名 | 说明 |
---|---|
list | 源数组 |
val | 填充数组的值 |
start=0 | 起始位置 |
end=arr.length | 结束位置,不包括 |
返回值 | 目标数组 |
fill([1, 2, 3], '*'); // -> ['*', '*', '*']
fill([1, 2, 3], '*', 1, 2); // -> [1, '*', 3]
遍历集合中的每个元素,返回所有通过真值检测的元素组成的数组。
function filter<T>(
list: types.List<T>,
iterator: types.ListIterator<T, boolean>,
context?: any
): T[];
function filter<T>(
object: types.Dictionary<T>,
iterator: types.ObjectIterator<T, boolean>,
context?: any
): T[];
参数名 | 说明 |
---|---|
obj | 要遍历的集合 |
predicate | 真值检测函数 |
ctx | 函数上下文 |
返回值 | 包含所有通过真值检测元素的数组 |
filter([1, 2, 3, 4, 5], function(val) {
return val % 2 === 0