简介
Skyjs 是一款前端 JavaScript 工具库，提供了许多实用的工具函数和类，让编写 JavaScript 应用更加快捷和便捷。Skyjs 可以用于浏览器和 Node.js 环境，支持 ES6。
该库包含了通用的工具函数、DOM 相关的工具、事件模块、动画模块等等。其中，最为常用的是工具函数模块或者工具类，例如简化异步流程的Deferred类。
安装
Skyjs 可以通过 npm 安装，也可以下载压缩包直接使用。
使用 npm 安装：
npm install skyjs --save
然后在项目中引入：
import sky from 'skyjs'
工具函数
Skyjs 提供了许多实用的工具函数，部分常用的函数如下：
sky.extend(target, obj1, obj2...)
将多个对象合并到第一个对象中，返回合并后的对象。
const a = { foo: 'bar' };
const b = { name: 'skyjs' };
sky.extend(a, b);
console.log(a);
// { foo: 'bar', name: 'skyjs' }sky.each(obj, callback)
遍历对象或者数组，对每一项执行回调函数。
const arr = [1, 2, 3];
sky.each(arr, function (index, item) {
console.log(index, item);
});
// 0 1
// 1 2
// 2 3sky.isArray(obj)
判断对象是否为数组。
sky.isArray([1, 2]); // true
sky.isArray({}); // falsesky.isObject(obj)
判断对象是否为普通对象。
sky.isObject({}); // true
sky.isObject([]); // false更多工具函数，可以查看 官方文档。
DOM 工具
Skyjs 还提供了许多 DOM 相关的工具函数，如下：
sky.$(selector, [context])
根据选择器获取元素，如果指定了上下文，就在上下文中查找。
sky.$('.btn'); // 获取 class 为 btn 的元素
sky.$('#myDiv', document); // 在 document 中获取 id 为 myDiv 的元素sky.addClass(el, className)
给元素添加 class。
const el = document.querySelector('.btn');
sky.addClass(el, 'red');sky.removeClass(el, className)
从元素中移除 class。
const el = document.querySelector('.btn');
sky.removeClass(el, 'red');sky.hasClass(el, className)
判断元素是否有某个 class。
const el = document.querySelector('.btn');
sky.hasClass(el, 'red'); // true更多 DOM 工具函数，可以查看 官方文档。
事件模块
Skyjs 提供了一个简单的事件发布和订阅模块，可以向应用程序中添加事件支持，让应用程序更加灵活和易于扩展。
sky.events 属性
sky.events 用于存储事件订阅和发布的相关信息。
-- -------------------- ---- ------- ---------- - - -- ------- ---------- --- -- ----------- ---------------------- --- --- -- ------ ---------------------- --- --- -- ------ ------------------------- --- --- -- ---- --------------- ----- --- --
sky.events.addListener
添加事件订阅，可以添加多个订阅者。
sky.events.addListener('clickBtn', function (e) {
console.log('clickBtn', e);
});
sky.events.addListener('clickBtn', function (e) {
console.log('clickBtn2', e);
});sky.events.removeListener
移除事件订阅，可以移除指定的订阅者，也可以一次移除所有订阅者。
const fn = function (e) {
console.log('clickBtn', e);
};
sky.events.addListener('clickBtn', fn);
sky.events.removeListener('clickBtn', fn);
sky.events.removeListener('clickBtn');sky.events.emit
发布事件。
sky.events.emit('clickBtn', { message: 'hello' });Deferred 类
Skyjs 还提供了一个简化异步流程的Deferred类，可以通过该类来控制异步任务的执行顺序。
Deferred.promise 属性
promise属性，用于获取执行异步任务的结果。
-- -------------------- ---- -------
----- - - --- ---------------
----- ------- - ----------
-------------
-------- ------ -
------------------- ------
--
-------- ----- -
------------------- -----
-
--Deferred.resolve 方法
resolve 方法，用于将异步任务的结果传递给promise。必须在异步任务完成后调用，来通知deferred对象异步任务已经完成。
-- -------------------- ---- -------
----- - - --- ---------------
----- ------- - ----------
-------------
-------- ------ -
------------------- ------
--
-------- ----- -
------------------- -----
-
--
-------------------Deferred.reject 方法
reject 方法，用于将异步任务的异常传递给promise。
-- -------------------- ---- -------
----- - - --- ---------------
----- ------- - ----------
-------------
-------- ------ -
------------------- ------
--
-------- ----- -
------------------- -----
-
--
------------------更多使用方法，可以查看 官方文档。
结束语
Skyjs 是一个非常实用的 JavaScript 工具库，在实际开发过程中可以极大提高我们的开发效率。本文介绍了 Skyjs 的基本使用方法和常见功能，希望读者可以通过本文更好的掌握 Skyjs，并在实际项目中使用它。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60056bd381e8991b448e5751