Я впервые разработал публичный код. Целью этого кода является то, что классические функции противодействия отказу и дросселированию закодированы на чистом javascript с расширенными параметрами. «jQuery и т. д., не имеет зависимостей».
Я старался сделать сценарий как можно короче. Пожалуйста, проанализируйте и оцените мой код следующим образом?
- Есть ли ошибки в коде? (Правильно ли работает?)
- Правильна ли поддержка нескольких устройств, для которой был написан код?
(function (global, factory) { typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() : typeof define === 'function' && define.amd ? define(factory) : (global = global || self, global.pass = factory()); }(this, (function() { - Комментарии и т. Д. Соответствуют ли стандарты общественному проекту?
- Насколько успешна общая степень сжатия?
- Общая оценка.
Код:
/**!
*** Pass.js
*** @version 1.0.1
**/
(function (global, factory)
{
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
typeof define === 'function' && define.amd ? define(factory) :
(global = global || self, global.pass = factory());
}(this, (function ()
{
'use strict';
var pass = {}; // Object for public APIs
/**
*** Method debounce, pass.debounce()
*** @public
*** @param {Function} callback The callback to run
*** @param {number} wait The waiting time in (ms), [optional], default: 200
*** @param {Object} options The settings object, structure is: { leading: true, trailing: true }
*** leading: {boolean} Trigger at the leading edge, [optional], default: true
*** trailing: {boolean} Trigger on the last trailing edge, [optional], default: true
*** Note: If both are set to false, the last edge is triggered by default.
*** @return {Function} Returns null if not apply callback
**/
pass.debounce = function(callback, wait, options)
{
var context, args, result, call;
var timeout = null;
wait || (wait = 200);
options || (options = {});
function later()
{
timeout = null;
(options.leading === false || options.trailing !== false) && (result = callback.apply(context, args));
!timeout && (context = args = null);
}
return function()
{
args = arguments;
context = this;
call = options.leading !== false && !timeout;
clearTimeout(timeout);
timeout = setTimeout(later, wait);
call && (result = callback.apply(context, args));
return result;
}
};
/**
*** Method throttle, pass.throttle()
*** @public
*** @param {Function} callback The callback to run
*** @param {number} wait The waiting time in ms, [optional], default: 200
*** @param {Object} options The settings object, structure is: { leading: true, trailing: true }
*** leading: {boolean} Trigger at the leading edge, [optional], default: true
*** trailing: {boolean} Trigger on the trailing edge, [optional], default: true
*** Note: If both are set to false, the last edge is triggered by default.
*** @return {Function} Returns null if not apply callback
**/
pass.throttle = function(callback, wait, options)
{
var context, args, result;
var timeout = null;
var previous = 0;
wait || (wait = 200);
options || (options = {});
function later()
{
previous = options.leading === false ? 0 : Date.now();
timeout = null;
result = callback.apply(context, args);
!timeout && (context = args = null);
}
return function()
{
var now = Date.now();
args = arguments;
context = this;
!previous && options.leading === false && (previous = now);
var remaining = wait - (now - previous);
if(remaining <= 0 || remaining > wait)
{
if(timeout)
{
clearTimeout(timeout);
timeout = null;
}
previous = now;
result = callback.apply(context, args);
!timeout && (context = args = null);
}
else if(!timeout && options.trailing !== false)
{
timeout = setTimeout(later, remaining);
}
return result;
};
};
// return public APIs
return pass;
})));
Уменьшено:
!function(n,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(n=n||self).pass=e()}(this,function(){"use strict";var n={debounce:function(n,e,t){var l,u,i,o=null;function a(){o=null,!1!==t.leading&&!1===t.trailing||n.apply(l,u),o||(l=u=null)}return e=e||200,t=t||{},function(){u=arguments,l=this,i=!1!==t.leading&&!o,clearTimeout(o),o=setTimeout(a,e),i&&n.apply(l,u)}},throttle:function(t,l,u){var i,o,a,r=null,f=0;function c(){f=!1===u.leading?0:Date.now(),r=null,a=t.apply(i,o),r||(i=o=null)}return l=l||200,u=u||{},function(){var n=Date.now();o=arguments,i=this,f||!1!==u.leading||(f=n);var e=l-(n-f);return e<=0||l<e?(r&&(clearTimeout(r),r=null),f=n,a=t.apply(i,o),r||(i=o=null)):r||!1===u.trailing||(r=setTimeout(c,e)),a}}};return n});
Пример:
! function(n, e) {
"object" == typeof exports && "undefined" != typeof module ? module.exports = e() : "function" == typeof define && define.amd ? define(e) : (n = n || self).pass = e()
}(this, function() {
"use strict";
var n = {
debounce: function(n, e, t) {
var l, u, i, o = null;
function a() {
o = null, !1 !== t.leading && !1 === t.trailing || n.apply(l, u), o || (l = u = null)
}
return e = e || 200, t = t || {},
function() {
u = arguments, l = this, i = !1 !== t.leading && !o, clearTimeout(o), o = setTimeout(a, e), i && n.apply(l, u)
}
},
throttle: function(t, l, u) {
var i, o, a, r = null,
f = 0;
function c() {
f = !1 === u.leading ? 0 : Date.now(), r = null, a = t.apply(i, o), r || (i = o = null)
}
return l = l || 200, u = u || {},
function() {
var n = Date.now();
o = arguments, i = this, f || !1 !== u.leading || (f = n);
var e = l - (n - f);
return e <= 0 || l < e ? (r && (clearTimeout(r), r = null), f = n, a = t.apply(i, o), r || (i = o = null)) : r || !1 === u.trailing || (r = setTimeout(c, e)), a
}
}
};
return n
});
document.addEventListener(
"mousemove",
pass.debounce(
function() {
document.body.appendChild(document.createTextNode(" Mouse Event (Leading false, trailing true) "));
},
1000, {
leading: false,
trailing: true
}
)
);<h3>Debounce MouseEvent for 1sec. (trailing)</h3>