121 lines
49 KiB
HTML
121 lines
49 KiB
HTML
<!DOCTYPE html><html lang="en"><head><link rel="stylesheet" href="./mini.css"><title>Date - 30 seconds of code</title><meta charset="utf-8"><meta name="description" content="Curated collection of useful Javascript snippets that you can understand in 30 seconds or less."><meta name="keywords" content="javascript, snippets, code, programming"><meta name="author" content="Angelos Chalaris (chalarangelo@gmail.com)"><meta name="viewport" content="width=device-width,initial-scale=1"><meta property="og:title" content="30 seconds of code"><meta property="og:description" content="Curated collection of useful Javascript snippets that you can understand in 30 seconds or less."/><meta property="og:type" content="website"/><meta property="og:image" content="favicon.png"><link rel="icon" type="image/png" href="favicon.png"><script>const search = (node) => {
|
|
let matchingTags = [];
|
|
Array.from(node.parentElement.parentElement.getElementsByTagName('a')).forEach(x => {
|
|
let data = [x.textContent.toLowerCase(), ...x.getAttribute('tags').split(',')].map(v => !!(v.indexOf(node.value.toLowerCase()) + 1));
|
|
if(data.includes(true)){
|
|
x.style.display = '';
|
|
matchingTags.push(x.getAttribute('tags').split(',')[0]);
|
|
}
|
|
else x.style.display = 'none';
|
|
});
|
|
Array.from(node.parentElement.parentElement.getElementsByTagName('h3')).forEach(x => {
|
|
x.style.display = matchingTags.includes(x.textContent.toLowerCase()) ? '' : 'none';
|
|
})
|
|
}
|
|
function scrollToTop(){
|
|
const c = document.querySelector('main').scrollTop;
|
|
if (c > 0) {
|
|
window.requestAnimationFrame(scrollToTop);
|
|
document.querySelector('main').scrollTo(0, c - c / 4);
|
|
}
|
|
};
|
|
function scrollTo(element, to, id, duration) {
|
|
if (duration <= 0) return;
|
|
var difference = to - element.scrollTop;
|
|
var perTick = difference / duration * 40;
|
|
|
|
setTimeout(function() {
|
|
element.scrollTop = element.scrollTop + perTick;
|
|
if (element.scrollTop === to) {
|
|
window.location.href = "#"+id;
|
|
return;
|
|
}
|
|
scrollTo(element, to, id, duration - 40);
|
|
}, 40);
|
|
};
|
|
function loader() {
|
|
registerClickListener();
|
|
window.setTimeout(function(){
|
|
document.getElementById('disclaimer').style.display = 'none';
|
|
}, 30000);
|
|
document.querySelector('nav').scrollTop = Array.from(document.querySelectorAll('h3')).filter(v => v.innerHTML === 'Date')[0].offsetTop - 60;
|
|
}
|
|
function registerClickListener() {
|
|
document.addEventListener('click', function (event) {
|
|
if( document.getElementById('doc-drawer-checkbox').checked ) {
|
|
if(!document.querySelector('nav').contains(event.target) && !event.target.classList.contains('drawer-toggle') && !event.target.classList.contains('drawer')) {
|
|
document.getElementById('doc-drawer-checkbox').checked = false;
|
|
}
|
|
}
|
|
if ( event.target.classList.contains('collapse') ) {
|
|
event.target.classList = event.target.classList.contains('toggled') ? 'collapse' : 'collapse toggled';
|
|
}
|
|
else if (event.target.classList.contains('clipboard-copy')) {
|
|
const text = event.target.parentElement.parentElement.querySelector(':not(pre) + pre').textContent;
|
|
const textArea = document.createElement("textarea");
|
|
textArea.value = text.trim();
|
|
document.body.appendChild(textArea);
|
|
textArea.select();
|
|
document.execCommand("Copy");
|
|
document.body.removeChild(textArea);
|
|
let tst = document.createElement('div');
|
|
tst.classList = 'toast';
|
|
tst.innerHTML = 'Snippet copied to clipboard!';
|
|
document.body.appendChild(tst);
|
|
setTimeout(function() {
|
|
tst.style.opacity = 0;
|
|
setTimeout(function() {
|
|
document.body.removeChild(tst);
|
|
},300);
|
|
},1700);
|
|
}
|
|
else if (event.target.classList.contains('scroll-to-top')){
|
|
scrollToTop();
|
|
}
|
|
else if (event.target.classList.contains('sublink-1')){
|
|
if(event.target.getAttribute("href").includes('./')) return;
|
|
event.preventDefault();
|
|
scrollTo(document.querySelector('main'), document.getElementById(event.target.href.split('#')[1]).parentElement.offsetTop - 60, event.target.href.split('#')[1], 400);
|
|
document.getElementById('doc-drawer-checkbox').checked = false;
|
|
}
|
|
}, false);
|
|
}</script></head><body onload="loader()"><a href="https://github.com/Chalarangelo/30-seconds-of-code" class="github-corner" aria-label="View source on Github"><svg width="56" height="56" viewBox="0 0 250 250" style="fill:#151513;color:#fff;position:absolute;top:0;border:0;right:0;z-index:1000" aria-hidden="true"><path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path><path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" style="transform-origin:130px 106px" class="octo-arm"></path><path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"></path></svg></a><style>.github-corner:hover .octo-arm{animation:octocat-wave 560ms ease-in-out}@keyframes octocat-wave{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)}}@media (max-width:500px){.github-corner:hover .octo-arm{animation:none}.github-corner .octo-arm{animation:octocat-wave 560ms ease-in-out}}</style><header style="height:3.5rem;box-sizing:border-box;overflow:hidden"><h1 class="logo"><img src="favicon.png" style="height:3.5rem" alt="logo"/><span id="title"> 30 seconds of code</span> <small>Curated collection of useful JavaScript snippets that you can understand in 30 seconds or less.</small></h1><label for="doc-drawer-checkbox" class="button drawer-toggle" id="menu-toggle"></label></header><div class="row" style="height:calc(100vh - 3.5rem);overflow:hidden"><input id="doc-drawer-checkbox" class="drawer" value="on" type="checkbox"><nav class="col-md-4 col-lg-3" style="border-top:0"><div class="input-group vertical"><input class="search" type="text" id="searchInput" onkeyup="search(this)" placeholder="Search..."></div><h3>Adapter</h3><a class="sublink-1" tags="adapter,function" href="./adapter.html#ary">ary</a> <a class="sublink-1" tags="adapter,function" href="./adapter.html#call">call</a> <a class="sublink-1" tags="adapter,function,array" href="./adapter.html#collectinto">collectInto</a> <a class="sublink-1" tags="adapter,function" href="./adapter.html#flip">flip</a> <a class="sublink-1" tags="adapter,function" href="./adapter.html#over">over</a> <a class="sublink-1" tags="adapter,function" href="./adapter.html#overargs">overArgs</a> <a class="sublink-1" tags="adapter,function,promise" href="./adapter.html#pipeasyncfunctions">pipeAsyncFunctions</a> <a class="sublink-1" tags="adapter,function" href="./adapter.html#pipefunctions">pipeFunctions</a> <a class="sublink-1" tags="adapter,function,promise" href="./adapter.html#promisify">promisify</a> <a class="sublink-1" tags="adapter,function" href="./adapter.html#rearg">rearg</a> <a class="sublink-1" tags="adapter" href="./adapter.html#spreadover">spreadOver</a> <a class="sublink-1" tags="adapter,function" href="./adapter.html#unary">unary</a><h3>Array</h3><a class="sublink-1" tags="array,function" href="./array.html#all">all</a> <a class="sublink-1" tags="array,function" href="./array.html#any">any</a> <a class="sublink-1" tags="array" href="./array.html#bifurcate">bifurcate</a> <a class="sublink-1" tags="array,function" href="./array.html#bifurcateby">bifurcateBy</a> <a class="sublink-1" tags="array" href="./array.html#chunk">chunk</a> <a class="sublink-1" tags="array" href="./array.html#compact">compact</a> <a class="sublink-1" tags="array,object" href="./array.html#countby">countBy</a> <a class="sublink-1" tags="array" href="./array.html#countoccurrences">countOccurrences</a> <a class="sublink-1" tags="array,recursion" href="./array.html#deepflatten">deepFlatten</a> <a class="sublink-1" tags="array,math" href="./array.html#difference">difference</a> <a class="sublink-1" tags="array,function" href="./array.html#differenceby">differenceBy</a> <a class="sublink-1" tags="array,function" href="./array.html#differencewith">differenceWith</a> <a class="sublink-1" tags="array" href="./array.html#drop">drop</a> <a class="sublink-1" tags="array" href="./array.html#dropright">dropRight</a> <a class="sublink-1" tags="array,function" href="./array.html#droprightwhile">dropRightWhile</a> <a class="sublink-1" tags="array,function" href="./array.html#dropwhile">dropWhile</a> <a class="sublink-1" tags="array" href="./array.html#everynth">everyNth</a> <a class="sublink-1" tags="array" href="./array.html#filternonunique">filterNonUnique</a> <a class="sublink-1" tags="array" href="./array.html#findlast">findLast</a> <a class="sublink-1" tags="array,function" href="./array.html#findlastindex">findLastIndex</a> <a class="sublink-1" tags="array" href="./array.html#flatten">flatten</a> <a class="sublink-1" tags="array,function" href="./array.html#foreachright">forEachRight</a> <a class="sublink-1" tags="array,object" href="./array.html#groupby">groupBy</a> <a class="sublink-1" tags="array" href="./array.html#head">head</a> <a class="sublink-1" tags="array" href="./array.html#indexofall">indexOfAll</a> <a class="sublink-1" tags="array" href="./array.html#initial">initial</a> <a class="sublink-1" tags="array" href="./array.html#initialize2darray">initialize2DArray</a> <a class="sublink-1" tags="array,math" href="./array.html#initializearraywithrange">initializeArrayWithRange</a> <a class="sublink-1" tags="array,math" href="./array.html#initializearraywithrangeright">initializeArrayWithRangeRight</a> <a class="sublink-1" tags="array,math" href="./array.html#initializearraywithvalues">initializeArrayWithValues</a> <a class="sublink-1" tags="array,math" href="./array.html#intersection">intersection</a> <a class="sublink-1" tags="array,function" href="./array.html#intersectionby">intersectionBy</a> <a class="sublink-1" tags="array,function" href="./array.html#intersectionwith">intersectionWith</a> <a class="sublink-1" tags="array" href="./array.html#issorted">isSorted</a> <a class="sublink-1" tags="array" href="./array.html#join">join</a> <a class="sublink-1" tags="array" href="./array.html#last">last</a> <a class="sublink-1" tags="array,string,utility" href="./array.html#longestitem">longestItem</a> <a class="sublink-1" tags="array,object,advanced" href="./array.html#mapobject">mapObject</a> <a class="sublink-1" tags="array,math" href="./array.html#maxn">maxN</a> <a class="sublink-1" tags="array,math" href="./array.html#minn">minN</a> <a class="sublink-1" tags="array,function" href="./array.html#none">none</a> <a class="sublink-1" tags="array" href="./array.html#nthelement">nthElement</a> <a class="sublink-1" tags="array,object,function" href="./array.html#partition">partition</a> <a class="sublink-1" tags="array,recursion" href="./array.html#permutations">permutations</a> <a class="sublink-1" tags="array" href="./array.html#pull">pull</a> <a class="sublink-1" tags="array" href="./array.html#pullatindex">pullAtIndex</a> <a class="sublink-1" tags="array" href="./array.html#pullatvalue">pullAtValue</a> <a class="sublink-1" tags="array,function,advanced" href="./array.html#pullby">pullBy</a> <a class="sublink-1" tags="array" href="./array.html#reducedfilter">reducedFilter</a> <a class="sublink-1" tags="array,function" href="./array.html#reducesuccessive">reduceSuccessive</a> <a class="sublink-1" tags="array,function" href="./array.html#reducewhich">reduceWhich</a> <a class="sublink-1" tags="array" href="./array.html#remove">remove</a> <a class="sublink-1" tags="array,random" href="./array.html#sample">sample</a> <a class="sublink-1" tags="array,random" href="./array.html#samplesize">sampleSize</a> <a class="sublink-1" tags="array,random" href="./array.html#shuffle">shuffle</a> <a class="sublink-1" tags="array,math" href="./array.html#similarity">similarity</a> <a class="sublink-1" tags="array,math" href="./array.html#sortedindex">sortedIndex</a> <a class="sublink-1" tags="array,math,function" href="./array.html#sortedindexby">sortedIndexBy</a> <a class="sublink-1" tags="array,math" href="./array.html#sortedlastindex">sortedLastIndex</a> <a class="sublink-1" tags="array,math,function" href="./array.html#sortedlastindexby">sortedLastIndexBy</a> <a class="sublink-1" tags="array,sort,advanced" href="./array.html#stablesort">stableSort</a> <a class="sublink-1" tags="array,math" href="./array.html#symmetricdifference">symmetricDifference</a> <a class="sublink-1" tags="array,function" href="./array.html#symmetricdifferenceby">symmetricDifferenceBy</a> <a class="sublink-1" tags="array,function" href="./array.html#symmetricdifferencewith">symmetricDifferenceWith</a> <a class="sublink-1" tags="array" href="./array.html#tail">tail</a> <a class="sublink-1" tags="array" href="./array.html#take">take</a> <a class="sublink-1" tags="array" href="./array.html#takeright">takeRight</a> <a class="sublink-1" tags="array,function" href="./array.html#takerightwhile">takeRightWhile</a> <a class="sublink-1" tags="array,function" href="./array.html#takewhile">takeWhile</a> <a class="sublink-1" tags="array,math" href="./array.html#union">union</a> <a class="sublink-1" tags="array,function" href="./array.html#unionby">unionBy</a> <a class="sublink-1" tags="array,function" href="./array.html#unionwith">unionWith</a> <a class="sublink-1" tags="array" href="./array.html#uniqueelements">uniqueElements</a> <a class="sublink-1" tags="array" href="./array.html#unzip">unzip</a> <a class="sublink-1" tags="array,function,advanced" href="./array.html#unzipwith">unzipWith</a> <a class="sublink-1" tags="array" href="./array.html#without">without</a> <a class="sublink-1" tags="array,math" href="./array.html#xprod">xProd</a> <a class="sublink-1" tags="array" href="./array.html#zip">zip</a> <a class="sublink-1" tags="array,object" href="./array.html#zipobject">zipObject</a> <a class="sublink-1" tags="array,function,advanced" href="./array.html#zipwith">zipWith</a><h3>Browser</h3><a class="sublink-1" tags="browser,array" href="./browser.html#arraytohtmllist">arrayToHtmlList</a> <a class="sublink-1" tags="browser" href="./browser.html#bottomvisible">bottomVisible</a> <a class="sublink-1" tags="browser,string,advanced" href="./browser.html#copytoclipboard">copyToClipboard</a> <a class="sublink-1" tags="browser,utility" href="./browser.html#createelement">createElement</a> <a class="sublink-1" tags="browser,event,advanced" href="./browser.html#createeventhub">createEventHub</a> <a class="sublink-1" tags="browser,url" href="./browser.html#currenturl">currentURL</a> <a class="sublink-1" tags="browser" href="./browser.html#detectdevicetype">detectDeviceType</a> <a class="sublink-1" tags="browser" href="./browser.html#elementisvisibleinviewport">elementIsVisibleInViewport</a> <a class="sublink-1" tags="browser" href="./browser.html#getscrollposition">getScrollPosition</a> <a class="sublink-1" tags="browser,css" href="./browser.html#getstyle">getStyle</a> <a class="sublink-1" tags="browser,css" href="./browser.html#hasclass">hasClass</a> <a class="sublink-1" tags="browser,utility,advanced,promise" href="./browser.html#hashbrowser">hashBrowser</a> <a class="sublink-1" tags="browser,css" href="./browser.html#hide">hide</a> <a class="sublink-1" tags="browser,url" href="./browser.html#httpsredirect">httpsRedirect</a> <a class="sublink-1" tags="browser,event,advanced" href="./browser.html#observemutations">observeMutations</a> <a class="sublink-1" tags="browser,event" href="./browser.html#off">off</a> <a class="sublink-1" tags="browser,event" href="./browser.html#on">on</a> <a class="sublink-1" tags="browser,event,advanced" href="./browser.html#onuserinputchange">onUserInputChange</a> <a class="sublink-1" tags="browser,utility" href="./browser.html#prefix">prefix</a> <a class="sublink-1" tags="browser,utility" href="./browser.html#recordanimationframes">recordAnimationFrames</a> <a class="sublink-1" tags="browser,url" href="./browser.html#redirect">redirect</a> <a class="sublink-1" tags="browser,function,advanced,promise,url" href="./browser.html#runasync">runAsync</a> <a class="sublink-1" tags="browser" href="./browser.html#scrolltotop">scrollToTop</a> <a class="sublink-1" tags="browser" href="./browser.html#setstyle">setStyle</a> <a class="sublink-1" tags="browser,css" href="./browser.html#show">show</a> <a class="sublink-1" tags="browser,css" href="./browser.html#smoothscroll">smoothScroll</a> <a class="sublink-1" tags="browser" href="./browser.html#toggleclass">toggleClass</a> <a class="sublink-1" tags="browser,utility,random" href="./browser.html#uuidgeneratorbrowser">UUIDGeneratorBrowser</a><h3>Date</h3><a class="sublink-1" tags="date,math,string,utility" href="#formatduration">formatDuration</a> <a class="sublink-1" tags="date" href="#getcolontimefromdate">getColonTimeFromDate</a> <a class="sublink-1" tags="date" href="#getdaysdiffbetweendates">getDaysDiffBetweenDates</a> <a class="sublink-1" tags="date" href="#getmeridiemsuffixofinteger">getMeridiemSuffixOfInteger</a> <a class="sublink-1" tags="date" href="#tomorrow">tomorrow</a><h3>Function</h3><a class="sublink-1" tags="function" href="./function.html#attempt">attempt</a> <a class="sublink-1" tags="function,object" href="./function.html#bind">bind</a> <a class="sublink-1" tags="function,object" href="./function.html#bindkey">bindKey</a> <a class="sublink-1" tags="function" href="./function.html#chainasync">chainAsync</a> <a class="sublink-1" tags="function" href="./function.html#compose">compose</a> <a class="sublink-1" tags="function" href="./function.html#composeright">composeRight</a> <a class="sublink-1" tags="function" href="./function.html#converge">converge</a> <a class="sublink-1" tags="function,recursion" href="./function.html#curry">curry</a> <a class="sublink-1" tags="function" href="./function.html#debounce">debounce</a> <a class="sublink-1" tags="function" href="./function.html#defer">defer</a> <a class="sublink-1" tags="function" href="./function.html#delay">delay</a> <a class="sublink-1" tags="function,utility" href="./function.html#functionname">functionName</a> <a class="sublink-1" tags="function" href="./function.html#memoize">memoize</a> <a class="sublink-1" tags="function" href="./function.html#negate">negate</a> <a class="sublink-1" tags="function" href="./function.html#once">once</a> <a class="sublink-1" tags="function" href="./function.html#partial">partial</a> <a class="sublink-1" tags="function" href="./function.html#partialright">partialRight</a> <a class="sublink-1" tags="function,promise" href="./function.html#runpromisesinseries">runPromisesInSeries</a> <a class="sublink-1" tags="function,promise" href="./function.html#sleep">sleep</a> <a class="sublink-1" tags="function" href="./function.html#throttle">throttle</a> <a class="sublink-1" tags="function" href="./function.html#times">times</a> <a class="sublink-1" tags="function" href="./function.html#uncurry">uncurry</a> <a class="sublink-1" tags="function,array" href="./function.html#unfold">unfold</a><h3>Math</h3><a class="sublink-1" tags="math" href="./math.html#approximatelyequal">approximatelyEqual</a> <a class="sublink-1" tags="math,array" href="./math.html#average">average</a> <a class="sublink-1" tags="math,array,function" href="./math.html#averageby">averageBy</a> <a class="sublink-1" tags="math" href="./math.html#binomialcoefficient">binomialCoefficient</a> <a class="sublink-1" tags="math" href="./math.html#clampnumber">clampNumber</a> <a class="sublink-1" tags="math" href="./math.html#degreestorads">degreesToRads</a> <a class="sublink-1" tags="math,array" href="./math.html#digitize">digitize</a> <a class="sublink-1" tags="math" href="./math.html#distance">distance</a> <a class="sublink-1" tags="math,array,advanced" href="./math.html#elo">elo</a> <a class="sublink-1" tags="math,recursion" href="./math.html#factorial">factorial</a> <a class="sublink-1" tags="math,array" href="./math.html#fibonacci">fibonacci</a> <a class="sublink-1" tags="math,recursion" href="./math.html#gcd">gcd</a> <a class="sublink-1" tags="math" href="./math.html#geometricprogression">geometricProgression</a> <a class="sublink-1" tags="math" href="./math.html#hammingdistance">hammingDistance</a> <a class="sublink-1" tags="math" href="./math.html#inrange">inRange</a> <a class="sublink-1" tags="math" href="./math.html#isdivisible">isDivisible</a> <a class="sublink-1" tags="math" href="./math.html#iseven">isEven</a> <a class="sublink-1" tags="math" href="./math.html#isprime">isPrime</a> <a class="sublink-1" tags="math,recursion" href="./math.html#lcm">lcm</a> <a class="sublink-1" tags="math,utility" href="./math.html#luhncheck">luhnCheck</a> <a class="sublink-1" tags="math,array,function" href="./math.html#maxby">maxBy</a> <a class="sublink-1" tags="math,array" href="./math.html#median">median</a> <a class="sublink-1" tags="math,array,function" href="./math.html#minby">minBy</a> <a class="sublink-1" tags="math" href="./math.html#percentile">percentile</a> <a class="sublink-1" tags="math" href="./math.html#powerset">powerset</a> <a class="sublink-1" tags="math,array" href="./math.html#primes">primes</a> <a class="sublink-1" tags="math" href="./math.html#radstodegrees">radsToDegrees</a> <a class="sublink-1" tags="math,utility,random" href="./math.html#randomintarrayinrange">randomIntArrayInRange</a> <a class="sublink-1" tags="math,utility,random" href="./math.html#randomintegerinrange">randomIntegerInRange</a> <a class="sublink-1" tags="math,utility,random" href="./math.html#randomnumberinrange">randomNumberInRange</a> <a class="sublink-1" tags="math" href="./math.html#round">round</a> <a class="sublink-1" tags="math,utility" href="./math.html#sdbm">sdbm</a> <a class="sublink-1" tags="math,array" href="./math.html#standarddeviation">standardDeviation</a> <a class="sublink-1" tags="math,array" href="./math.html#sum">sum</a> <a class="sublink-1" tags="math,array,function" href="./math.html#sumby">sumBy</a> <a class="sublink-1" tags="math" href="./math.html#sumpower">sumPower</a> <a class="sublink-1" tags="math" href="./math.html#tosafeinteger">toSafeInteger</a><h3>Node</h3><a class="sublink-1" tags="node,string,utility" href="./node.html#atob">atob</a> <a class="sublink-1" tags="node,string,utility" href="./node.html#btoa">btoa</a> <a class="sublink-1" tags="node,utility,string" href="./node.html#colorize">colorize</a> <a class="sublink-1" tags="node" href="./node.html#hasflags">hasFlags</a> <a class="sublink-1" tags="node,utility,promise" href="./node.html#hashnode">hashNode</a> <a class="sublink-1" tags="node" href="./node.html#istravisci">isTravisCI</a> <a class="sublink-1" tags="node,json" href="./node.html#jsontofile">JSONToFile</a> <a class="sublink-1" tags="node,array,string" href="./node.html#readfilelines">readFileLines</a> <a class="sublink-1" tags="node,string" href="./node.html#untildify">untildify</a> <a class="sublink-1" tags="node,utility,random" href="./node.html#uuidgeneratornode">UUIDGeneratorNode</a><h3>Object</h3><a class="sublink-1" tags="object,function" href="./object.html#bindall">bindAll</a> <a class="sublink-1" tags="object,recursion" href="./object.html#deepclone">deepClone</a> <a class="sublink-1" tags="object" href="./object.html#defaults">defaults</a> <a class="sublink-1" tags="object,array,type,advanced" href="./object.html#equals">equals</a> <a class="sublink-1" tags="object,function" href="./object.html#findkey">findKey</a> <a class="sublink-1" tags="object,function" href="./object.html#findlastkey">findLastKey</a> <a class="sublink-1" tags="object,recursion" href="./object.html#flattenobject">flattenObject</a> <a class="sublink-1" tags="object" href="./object.html#forown">forOwn</a> <a class="sublink-1" tags="object" href="./object.html#forownright">forOwnRight</a> <a class="sublink-1" tags="object,function" href="./object.html#functions">functions</a> <a class="sublink-1" tags="object" href="./object.html#get">get</a> <a class="sublink-1" tags="object,function" href="./object.html#invertkeyvalues">invertKeyValues</a> <a class="sublink-1" tags="object" href="./object.html#lowercasekeys">lowercaseKeys</a> <a class="sublink-1" tags="object,function" href="./object.html#mapkeys">mapKeys</a> <a class="sublink-1" tags="object,function" href="./object.html#mapvalues">mapValues</a> <a class="sublink-1" tags="object,type" href="./object.html#matches">matches</a> <a class="sublink-1" tags="object,type,function" href="./object.html#matcheswith">matchesWith</a> <a class="sublink-1" tags="object,array" href="./object.html#merge">merge</a> <a class="sublink-1" tags="object" href="./object.html#nest">nest</a> <a class="sublink-1" tags="object,array" href="./object.html#objectfrompairs">objectFromPairs</a> <a class="sublink-1" tags="object,array" href="./object.html#objecttopairs">objectToPairs</a> <a class="sublink-1" tags="object,array" href="./object.html#omit">omit</a> <a class="sublink-1" tags="object,array,function" href="./object.html#omitby">omitBy</a> <a class="sublink-1" tags="object,array" href="./object.html#orderby">orderBy</a> <a class="sublink-1" tags="object,array" href="./object.html#pick">pick</a> <a class="sublink-1" tags="object,array,function" href="./object.html#pickby">pickBy</a> <a class="sublink-1" tags="object" href="./object.html#shallowclone">shallowClone</a> <a class="sublink-1" tags="object,array,string" href="./object.html#size">size</a> <a class="sublink-1" tags="object,array" href="./object.html#transform">transform</a> <a class="sublink-1" tags="object,logic,array" href="./object.html#truthcheckcollection">truthCheckCollection</a> <a class="sublink-1" tags="object,advanced" href="./object.html#unflattenobject">unflattenObject</a><h3>String</h3><a class="sublink-1" tags="string" href="./string.html#bytesize">byteSize</a> <a class="sublink-1" tags="string,array" href="./string.html#capitalize">capitalize</a> <a class="sublink-1" tags="string,regexp" href="./string.html#capitalizeeveryword">capitalizeEveryWord</a> <a class="sublink-1" tags="string,array" href="./string.html#decapitalize">decapitalize</a> <a class="sublink-1" tags="string,browser,regexp" href="./string.html#escapehtml">escapeHTML</a> <a class="sublink-1" tags="string,regexp" href="./string.html#escaperegexp">escapeRegExp</a> <a class="sublink-1" tags="string" href="./string.html#fromcamelcase">fromCamelCase</a> <a class="sublink-1" tags="string,utility,browser,url" href="./string.html#isabsoluteurl">isAbsoluteURL</a> <a class="sublink-1" tags="string,regexp" href="./string.html#isanagram">isAnagram</a> <a class="sublink-1" tags="string,utility" href="./string.html#islowercase">isLowerCase</a> <a class="sublink-1" tags="string,utility" href="./string.html#isuppercase">isUpperCase</a> <a class="sublink-1" tags="string,utility,regexp" href="./string.html#mask">mask</a> <a class="sublink-1" tags="string" href="./string.html#pad">pad</a> <a class="sublink-1" tags="string" href="./string.html#palindrome">palindrome</a> <a class="sublink-1" tags="string" href="./string.html#pluralize">pluralize</a> <a class="sublink-1" tags="string,regexp" href="./string.html#removenonascii">removeNonASCII</a> <a class="sublink-1" tags="string,array" href="./string.html#reversestring">reverseString</a> <a class="sublink-1" tags="string" href="./string.html#sortcharactersinstring">sortCharactersInString</a> <a class="sublink-1" tags="string" href="./string.html#splitlines">splitLines</a> <a class="sublink-1" tags="string,recursion" href="./string.html#stringpermutations">stringPermutations</a> <a class="sublink-1" tags="string,utility,regexp" href="./string.html#striphtmltags">stripHTMLTags</a> <a class="sublink-1" tags="string,regexp" href="./string.html#tocamelcase">toCamelCase</a> <a class="sublink-1" tags="string,regexp" href="./string.html#tokebabcase">toKebabCase</a> <a class="sublink-1" tags="string,regexp" href="./string.html#tosnakecase">toSnakeCase</a> <a class="sublink-1" tags="string" href="./string.html#truncatestring">truncateString</a> <a class="sublink-1" tags="string,browser" href="./string.html#unescapehtml">unescapeHTML</a> <a class="sublink-1" tags="string,utility,regexp" href="./string.html#urljoin">URLJoin</a> <a class="sublink-1" tags="string,regexp" href="./string.html#words">words</a><h3>Type</h3><a class="sublink-1" tags="type" href="./type.html#gettype">getType</a> <a class="sublink-1" tags="type,array,regexp" href="./type.html#is">is</a> <a class="sublink-1" tags="type,array" href="./type.html#isarraylike">isArrayLike</a> <a class="sublink-1" tags="type" href="./type.html#isboolean">isBoolean</a> <a class="sublink-1" tags="type,array,object,string" href="./type.html#isempty">isEmpty</a> <a class="sublink-1" tags="type,function" href="./type.html#isfunction">isFunction</a> <a class="sublink-1" tags="type" href="./type.html#isnil">isNil</a> <a class="sublink-1" tags="type" href="./type.html#isnull">isNull</a> <a class="sublink-1" tags="type,math" href="./type.html#isnumber">isNumber</a> <a class="sublink-1" tags="type,object" href="./type.html#isobject">isObject</a> <a class="sublink-1" tags="type,object" href="./type.html#isobjectlike">isObjectLike</a> <a class="sublink-1" tags="type,object" href="./type.html#isplainobject">isPlainObject</a> <a class="sublink-1" tags="type,function,array,string" href="./type.html#isprimitive">isPrimitive</a> <a class="sublink-1" tags="type,function,promise" href="./type.html#ispromiselike">isPromiseLike</a> <a class="sublink-1" tags="type,string" href="./type.html#isstring">isString</a> <a class="sublink-1" tags="type" href="./type.html#issymbol">isSymbol</a> <a class="sublink-1" tags="type" href="./type.html#isundefined">isUndefined</a> <a class="sublink-1" tags="type,json" href="./type.html#isvalidjson">isValidJSON</a><h3>Utility</h3><a class="sublink-1" tags="utility,array,type" href="./utility.html#castarray">castArray</a> <a class="sublink-1" tags="utility,regexp" href="./utility.html#cloneregexp">cloneRegExp</a> <a class="sublink-1" tags="utility" href="./utility.html#coalesce">coalesce</a> <a class="sublink-1" tags="utility" href="./utility.html#coalescefactory">coalesceFactory</a> <a class="sublink-1" tags="utility,string" href="./utility.html#extendhex">extendHex</a> <a class="sublink-1" tags="utility,browser,string,url" href="./utility.html#geturlparameters">getURLParameters</a> <a class="sublink-1" tags="utility,string,math,advanced" href="./utility.html#hextorgb">hexToRGB</a> <a class="sublink-1" tags="utility,url,browser" href="./utility.html#httpget">httpGet</a> <a class="sublink-1" tags="utility,url,browser" href="./utility.html#httppost">httpPost</a> <a class="sublink-1" tags="utility,browser" href="./utility.html#isbrowser">isBrowser</a> <a class="sublink-1" tags="utility,function" href="./utility.html#mostperformant">mostPerformant</a> <a class="sublink-1" tags="utility,function" href="./utility.html#ntharg">nthArg</a> <a class="sublink-1" tags="utility,string" href="./utility.html#parsecookie">parseCookie</a> <a class="sublink-1" tags="utility,string,math" href="./utility.html#prettybytes">prettyBytes</a> <a class="sublink-1" tags="utility,random" href="./utility.html#randomhexcolorcode">randomHexColorCode</a> <a class="sublink-1" tags="utility" href="./utility.html#rgbtohex">RGBToHex</a> <a class="sublink-1" tags="utility,string" href="./utility.html#serializecookie">serializeCookie</a> <a class="sublink-1" tags="utility" href="./utility.html#timetaken">timeTaken</a> <a class="sublink-1" tags="utility" href="./utility.html#tocurrency">toCurrency</a> <a class="sublink-1" tags="utility,math" href="./utility.html#todecimalmark">toDecimalMark</a> <a class="sublink-1" tags="utility,math" href="./utility.html#toordinalsuffix">toOrdinalSuffix</a> <a class="sublink-1" tags="utility,math" href="./utility.html#validatenumber">validateNumber</a> <a class="sublink-1" tags="utility,regexp" href="./utility.html#yesno">yesNo</a></nav><main class="col-sm-12 col-md-8 col-lg-9" style="height:100%;overflow-y:auto;background:#eceef2;padding:0"><a id="top"> </a><h2 style="text-align:center">Date</h2><div class="card fluid"><h3 id="formatduration" class="section double-padded">formatDuration</h3><div class="section double-padded"><p>Returns the human readable format of the given number of milliseconds.</p><p>Divide <code>ms</code> with the appropriate values to obtain the appropriate values for <code>day</code>, <code>hour</code>, <code>minute</code>, <code>second</code> and <code>millisecond</code>. Use <code>Object.entries()</code> with <code>Array.filter()</code> to keep only non-zero values. Use <code>Array.map()</code> to create the string for each value, pluralizing appropriately. Use <code>String.join(', ')</code> to combine the values into a string.</p><pre class="language-js"><span class="token keyword">const</span> <span class="token function-variable function">formatDuration</span> <span class="token operator">=</span> ms <span class="token operator">=></span> <span class="token punctuation">{</span>
|
|
<span class="token keyword">if</span> <span class="token punctuation">(</span>ms <span class="token operator"><</span> <span class="token number">0</span><span class="token punctuation">)</span> ms <span class="token operator">= -</span>ms<span class="token punctuation">;</span>
|
|
<span class="token keyword">const</span> time <span class="token operator">=</span> <span class="token punctuation">{</span>
|
|
day<span class="token punctuation">:</span> Math<span class="token punctuation">.</span><span class="token function">floor</span><span class="token punctuation">(</span>ms <span class="token operator">/</span> <span class="token number">86400000</span><span class="token punctuation">),</span>
|
|
hour<span class="token punctuation">:</span> Math<span class="token punctuation">.</span><span class="token function">floor</span><span class="token punctuation">(</span>ms <span class="token operator">/</span> <span class="token number">3600000</span><span class="token punctuation">)</span> <span class="token operator">%</span> <span class="token number">24</span><span class="token punctuation">,</span>
|
|
minute<span class="token punctuation">:</span> Math<span class="token punctuation">.</span><span class="token function">floor</span><span class="token punctuation">(</span>ms <span class="token operator">/</span> <span class="token number">60000</span><span class="token punctuation">)</span> <span class="token operator">%</span> <span class="token number">60</span><span class="token punctuation">,</span>
|
|
second<span class="token punctuation">:</span> Math<span class="token punctuation">.</span><span class="token function">floor</span><span class="token punctuation">(</span>ms <span class="token operator">/</span> <span class="token number">1000</span><span class="token punctuation">)</span> <span class="token operator">%</span> <span class="token number">60</span><span class="token punctuation">,</span>
|
|
millisecond<span class="token punctuation">:</span> Math<span class="token punctuation">.</span><span class="token function">floor</span><span class="token punctuation">(</span>ms<span class="token punctuation">)</span> <span class="token operator">%</span> <span class="token number">1000</span>
|
|
<span class="token punctuation">};</span>
|
|
<span class="token keyword">return</span> Object<span class="token punctuation">.</span><span class="token function">entries</span><span class="token punctuation">(</span>time<span class="token punctuation">)
|
|
.</span><span class="token function">filter</span><span class="token punctuation">(</span>val <span class="token operator">=></span> val<span class="token punctuation">[</span><span class="token number">1</span><span class="token punctuation">]</span> <span class="token operator">!==</span> <span class="token number">0</span><span class="token punctuation">)
|
|
.</span><span class="token function">map</span><span class="token punctuation">(</span>val <span class="token operator">=></span> val<span class="token punctuation">[</span><span class="token number">1</span><span class="token punctuation">]</span> <span class="token operator">+</span> <span class="token string">' '</span> <span class="token operator">+</span> <span class="token punctuation">(</span>val<span class="token punctuation">[</span><span class="token number">1</span><span class="token punctuation">]</span> <span class="token operator">!==</span> <span class="token number">1</span> <span class="token operator">?</span> val<span class="token punctuation">[</span><span class="token number">0</span><span class="token punctuation">]</span> <span class="token operator">+</span> <span class="token string">'s'</span> <span class="token punctuation">:</span> val<span class="token punctuation">[</span><span class="token number">0</span><span class="token punctuation">]))
|
|
.</span><span class="token function">join</span><span class="token punctuation">(</span><span class="token string">', '</span><span class="token punctuation">);
|
|
};</span>
|
|
</pre><label class="collapse">Show examples</label><pre class="language-js"><span class="token function">formatDuration</span><span class="token punctuation">(</span><span class="token number">1001</span><span class="token punctuation">);</span> <span class="token comment">// '1 second, 1 millisecond'</span>
|
|
<span class="token function">formatDuration</span><span class="token punctuation">(</span><span class="token number">34325055574</span><span class="token punctuation">);</span> <span class="token comment">// '397 days, 6 hours, 44 minutes, 15 seconds, 574 milliseconds'</span>
|
|
</pre><button class="primary clipboard-copy">📋 Copy to clipboard</button></div></div><div class="card fluid"><h3 id="getcolontimefromdate" class="section double-padded">getColonTimeFromDate</h3><div class="section double-padded"><p>Returns a string of the form <code>HH:MM:SS</code> from a <code>Date</code> object.</p><p>Use <code>Date.toString()</code> and <code>String.slice()</code> to get the <code>HH:MM:SS</code> part of a given <code>Date</code> object.</p><pre class="language-js"><span class="token keyword">const</span> <span class="token function-variable function">getColonTimeFromDate</span> <span class="token operator">=</span> date <span class="token operator">=></span> date<span class="token punctuation">.</span><span class="token function">toTimeString</span><span class="token punctuation">().</span><span class="token function">slice</span><span class="token punctuation">(</span><span class="token number">0</span><span class="token punctuation">,</span> <span class="token number">8</span><span class="token punctuation">);</span>
|
|
</pre><label class="collapse">Show examples</label><pre class="language-js"><span class="token function">getColonTimeFromDate</span><span class="token punctuation">(</span><span class="token keyword">new</span> <span class="token class-name">Date</span><span class="token punctuation">());</span> <span class="token comment">// "08:38:00"</span>
|
|
</pre><button class="primary clipboard-copy">📋 Copy to clipboard</button></div></div><div class="card fluid"><h3 id="getdaysdiffbetweendates" class="section double-padded">getDaysDiffBetweenDates</h3><div class="section double-padded"><p>Returns the difference (in days) between two dates.</p><p>Calculate the difference (in days) between two <code>Date</code> objects.</p><pre class="language-js"><span class="token keyword">const</span> <span class="token function-variable function">getDaysDiffBetweenDates</span> <span class="token operator">=</span> <span class="token punctuation">(</span>dateInitial<span class="token punctuation">,</span> dateFinal<span class="token punctuation">)</span> <span class="token operator">=></span>
|
|
<span class="token punctuation">(</span>dateFinal <span class="token operator">-</span> dateInitial<span class="token punctuation">)</span> <span class="token operator">/</span> <span class="token punctuation">(</span><span class="token number">1000</span> <span class="token operator">*</span> <span class="token number">3600</span> <span class="token operator">*</span> <span class="token number">24</span><span class="token punctuation">);</span>
|
|
</pre><label class="collapse">Show examples</label><pre class="language-js"><span class="token function">getDaysDiffBetweenDates</span><span class="token punctuation">(</span><span class="token keyword">new</span> <span class="token class-name">Date</span><span class="token punctuation">(</span><span class="token string">'2017-12-13'</span><span class="token punctuation">),</span> <span class="token keyword">new</span> <span class="token class-name">Date</span><span class="token punctuation">(</span><span class="token string">'2017-12-22'</span><span class="token punctuation">));</span> <span class="token comment">// 9</span>
|
|
</pre><button class="primary clipboard-copy">📋 Copy to clipboard</button></div></div><div class="card fluid"><h3 id="getmeridiemsuffixofinteger" class="section double-padded">getMeridiemSuffixOfInteger</h3><div class="section double-padded"><p>Converts an integer to a suffixed string, adding <code>am</code> or <code>pm</code> based on its value.</p><p>Use the modulo operator (<code>%</code>) and conditional checks to transform an integer to a stringified 12-hour format with meridiem suffix.</p><pre class="language-js"><span class="token keyword">const</span> <span class="token function-variable function">getMeridiemSuffixOfInteger</span> <span class="token operator">=</span> num <span class="token operator">=></span>
|
|
num <span class="token operator">===</span> <span class="token number">0</span> <span class="token operator">||</span> num <span class="token operator">===</span> <span class="token number">24</span>
|
|
<span class="token operator">?</span> <span class="token number">12</span> <span class="token operator">+</span> <span class="token string">'am'</span>
|
|
<span class="token punctuation">:</span> num <span class="token operator">===</span> <span class="token number">12</span> <span class="token operator">?</span> <span class="token number">12</span> <span class="token operator">+</span> <span class="token string">'pm'</span> <span class="token punctuation">:</span> num <span class="token operator"><</span> <span class="token number">12</span> <span class="token operator">?</span> num <span class="token operator">%</span> <span class="token number">12</span> <span class="token operator">+</span> <span class="token string">'am'</span> <span class="token punctuation">:</span> num <span class="token operator">%</span> <span class="token number">12</span> <span class="token operator">+</span> <span class="token string">'pm'</span><span class="token punctuation">;</span>
|
|
</pre><label class="collapse">Show examples</label><pre class="language-js"><span class="token function">getMeridiemSuffixOfInteger</span><span class="token punctuation">(</span><span class="token number">0</span><span class="token punctuation">);</span> <span class="token comment">// "12am"</span>
|
|
<span class="token function">getMeridiemSuffixOfInteger</span><span class="token punctuation">(</span><span class="token number">11</span><span class="token punctuation">);</span> <span class="token comment">// "11am"</span>
|
|
<span class="token function">getMeridiemSuffixOfInteger</span><span class="token punctuation">(</span><span class="token number">13</span><span class="token punctuation">);</span> <span class="token comment">// "1pm"</span>
|
|
<span class="token function">getMeridiemSuffixOfInteger</span><span class="token punctuation">(</span><span class="token number">25</span><span class="token punctuation">);</span> <span class="token comment">// "1pm"</span>
|
|
</pre><button class="primary clipboard-copy">📋 Copy to clipboard</button></div></div><div class="card fluid"><h3 id="tomorrow" class="section double-padded">tomorrow</h3><div class="section double-padded"><p>Results in a string representation of tomorrow's date. Use <code>new Date()</code> to get today's date, adding one day using <code>Date.getDate()</code> and <code>Date.setDate()</code>, and converting the Date object to a string.</p><pre class="language-js"><span class="token keyword">const</span> <span class="token function-variable function">tomorrow</span> <span class="token operator">=</span> <span class="token punctuation">(</span>long <span class="token operator">=</span> <span class="token boolean">false</span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span>
|
|
<span class="token keyword">let</span> t <span class="token operator">=</span> <span class="token keyword">new</span> <span class="token class-name">Date</span><span class="token punctuation">();</span>
|
|
t<span class="token punctuation">.</span><span class="token function">setDate</span><span class="token punctuation">(</span>t<span class="token punctuation">.</span><span class="token function">getDate</span><span class="token punctuation">()</span> <span class="token operator">+</span> <span class="token number">1</span><span class="token punctuation">);</span>
|
|
<span class="token keyword">const</span> ret <span class="token operator">=</span> <span class="token template-string"><span class="token string">`</span><span class="token interpolation"><span class="token interpolation-punctuation punctuation">${</span>t<span class="token punctuation">.</span><span class="token function">getFullYear</span><span class="token punctuation">()</span><span class="token interpolation-punctuation punctuation">}</span></span><span class="token string">-</span><span class="token interpolation"><span class="token interpolation-punctuation punctuation">${</span><span class="token function">String</span><span class="token punctuation">(</span>t<span class="token punctuation">.</span><span class="token function">getMonth</span><span class="token punctuation">()</span> <span class="token operator">+</span> <span class="token number">1</span><span class="token punctuation">).</span><span class="token function">padStart</span><span class="token punctuation">(</span><span class="token number">2</span><span class="token punctuation">,</span> <span class="token string">'0'</span><span class="token punctuation">)</span><span class="token interpolation-punctuation punctuation">}</span></span><span class="token string">-</span><span class="token interpolation"><span class="token interpolation-punctuation punctuation">${</span><span class="token function">String</span><span class="token punctuation">(</span>
|
|
t<span class="token punctuation">.</span><span class="token function">getDate</span><span class="token punctuation">()
|
|
).</span><span class="token function">padStart</span><span class="token punctuation">(</span><span class="token number">2</span><span class="token punctuation">,</span> <span class="token string">'0'</span><span class="token punctuation">)</span><span class="token interpolation-punctuation punctuation">}</span></span><span class="token string">`</span></span><span class="token punctuation">;</span>
|
|
<span class="token keyword">return</span> <span class="token operator">!</span>long <span class="token operator">?</span> ret <span class="token punctuation">:</span> <span class="token template-string"><span class="token string">`</span><span class="token interpolation"><span class="token interpolation-punctuation punctuation">${</span>ret<span class="token interpolation-punctuation punctuation">}</span></span><span class="token string">T00:00:00`</span></span><span class="token punctuation">;
|
|
};</span>
|
|
</pre><label class="collapse">Show examples</label><pre class="language-js"><span class="token function">tomorrow</span><span class="token punctuation">();</span> <span class="token comment">// 2017-12-27 (if current date is 2017-12-26)</span>
|
|
<span class="token function">tomorrow</span><span class="token punctuation">(</span><span class="token boolean">true</span><span class="token punctuation">);</span> <span class="token comment">// 2017-12-27T00:00:00 (if current date is 2017-12-26)</span>
|
|
</pre><button class="primary clipboard-copy">📋 Copy to clipboard</button></div></div><button class="scroll-to-top">↑</button><footer><p style="display:inline-block"><strong>30 seconds of code</strong> is licensed under the <a href="https://github.com/Chalarangelo/30-seconds-of-code/blob/master/LICENSE">CC0-1.0</a> license.<br/>Icons made by <a href="https://www.flaticon.com/authors/smashicons">Smashicons</a> from <a href="https://www.flaticon.com/">www.flaticon.com</a> is licensed by <a href="http://creativecommons.org/licenses/by/3.0/">CC 3.0 BY</a>.<br/>Ribbon made by <a href="https://github.com/tholman/github-corners">Tim Holman</a> is licensed by <a href="https://opensource.org/licenses/MIT">The MIT License</a><br/>Built with the <a href="https://minicss.org">mini.css framework</a>.</p></footer></main></div></body></html> |