npm 包 @deadcanaries/granax 使用教程

前言

当前端项目开始累积一定规模后，部分代码可能会重复使用，例如登录权限验证等。此时，很多人会考虑将这些代码封装为一种插件或库，方便在不同项目中复用。而 npm 的出现，更是方便了人们分享或使用这些开源的插件或库。本文将介绍一款 NPM 包——@deadcanaries/granax，该包提供了一些常用的工具函数，使我们的开发过程更加简单。

@deadcanaries/granax 简介

@deadcanaries/granax 是一款基于 Typescript 的工具库，功能包括但不限于：类型判断、数组/对象操作、异步函数等。

安装

使用 npm 安装即可：

npm install @deadcanaries/granax

使用示例

在你的项目中引入 @deadcanaries/granax:

import * as _ from "@deadcanaries/granax";

然后就可以使用该包中提供的函数了，接下来我们来看看一些常用的方法示例。

类型判断

isString: 判断是否为字符串类型

_.isString("hello"); // true

isNumber: 判断是否为数字类型

_.isNumber(123); // true

isArray: 判断是否为数组类型

_.isArray(["apple", "banana", "orange"]); // true

isFunction: 判断是否为函数类型

_.isFunction(() => {}); // true

isObject: 判断是否为对象类型

_.isObject({ name: "john", age: 18 }); // true

数组/对象操作

get: 获取对象指定值

const obj = { name: "john", age: 18, gender: "male" };
_.get(obj, "name"); // "john"
_.get(obj, "school", "none"); // "none"

set: 设置对象指定值

const obj = { name: "tom", age: 21 };
_.set(obj, "name", "jerry"); // { name: "jerry", age: 21 }
_.set(obj, "gender", "male"); // { name: "tom", age: 21, gender: "male" }

chunk: 将数组按指定长度划分为子数组

const arr = ["a", "b", "c", "d", "e", "f"];
_.chunk(arr, 2); // [["a", "b"], ["c", "d"], ["e", "f"]]
_.chunk(arr, 3); // [["a", "b", "c"], ["d", "e", "f"]]

异步函数

sleep: 等待指定时间再执行后续代码

console.log("start");
await _.sleep(2000); // 暂停2秒
console.log("end");

实际使用场景可能是等待异步请求返回后，再进行后续操作。

async function fetchData() {
  const data = await fetch("url...");
  await _.sleep(2000); // 暂停2秒再进行下一步
  return data;
}

总结

本文介绍了 @deadcanaries/granax 的使用方法，该包提供了一些实用的工具函数，可以提高我们在开发过程中的效率。在我们的实际开发中，应该尽可能使用现成的库和工具，在不断地学习和使用中，提升自己的开发能力。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/190725