andre/30-seconds-of-code
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'master' into patch-1

Browse Source
This commit is contained in:
Angelos Chalaris
2017-12-12 16:05:55 +02:00
committed by GitHub
parent b70be97350 8791caa2d4
commit 161ae75868
42 changed files with 225 additions and 148 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
CONTRIBUTING.md
View File

@ -1,13 +1,13 @@
## Contributing ## Contributing
You can cntribute to **30 seconds of code** by sending pull requests for snippets that you find useful, reporting issues with current snippets or suggesting changes and/or additions. You can contribute to **30 seconds of code** by sending pull requests for snippets that you find useful, reporting issues with current snippets or suggesting changes and/or additions.
### Guidelines for new snippets ### Guidelines for new snippets
- Snippets must be short. Usually anything above 10 lines would be considered too long, but you can still submit it as it might be possible to shorten it or it might still prove useful regardless of its length. - Snippets must be short. Usually anything above 10 lines would be considered too long, but you can still submit it as it might be possible to shorten it or it might still prove useful regardless of its length.
- Snippets must be explain to a certain extent in the description above them. Make sure to include what functions you are using and why. - Snippets must be explained to a certain extent in the description above them. Make sure to include what functions you are using and why.
- Snippets must solve real-world problems and should be abstract enough to use in different scenarios. This is highly subjective, so send them in anyways. - Snippets must solve real-world problems and should be abstract enough to use in different scenarios. This is highly subjective, so send them in anyways.
- Snippets *should* be written in ES6 if possible. - Snippets *should* be written in ES6 if possible.
- Snippet files must follow the anchor name conventions of (GitHub Flavored Markdown)[https://github.github.com/gfm/], so that the `builder.js` can build the links for the list. - Snippet files must follow the anchor name conventions of [GitHub Flavored Markdown](https://github.github.com/gfm/), so that the `builder.js` can build the links for the list.
- Use the [template](snippet-template.md) to format your snippets. - Use the [template](snippet-template.md) to format your snippets.
- If possible, provide test cases in your Pull Request (link or comment), so that it's easier to verify that each snippet is working. - If possible, provide test cases in your Pull Request (link or comment), so that it's easier to verify that each snippet is working.

212
README.md
View File

@ -8,11 +8,9 @@
## Contents ## Contents
* [RGB to hexadecimal](#rgb-to-hexadecimal)
* [URL parameters](#url-parameters)
* [UUID generator](#uuid-generator)
* [Anagrams of string (with duplicates)](#anagrams-of-string-with-duplicates) * [Anagrams of string (with duplicates)](#anagrams-of-string-with-duplicates)
* [Average of array of numbers](#average-of-array-of-numbers) * [Average of array of numbers](#average-of-array-of-numbers)
* [Capitalize first letter of every word](#capitalize-first-letter-of-every-word)
* [Capitalize first letter](#capitalize-first-letter) * [Capitalize first letter](#capitalize-first-letter)
* [Count occurrences of a value in array](#count-occurrences-of-a-value-in-array) * [Count occurrences of a value in array](#count-occurrences-of-a-value-in-array)
* [Current URL](#current-url) * [Current URL](#current-url)
@ -23,7 +21,9 @@
* [Even or odd number](#even-or-odd-number) * [Even or odd number](#even-or-odd-number)
* [Factorial](#factorial) * [Factorial](#factorial)
* [Fibonacci array generator](#fibonacci-array-generator) * [Fibonacci array generator](#fibonacci-array-generator)
* [Filter out non uniqe values in an array](#filter-out-non-uniqe-values-in-an-array)
* [Flatten array](#flatten-array) * [Flatten array](#flatten-array)
* [Get scroll position](#get-scroll-position)
* [Greatest common divisor (GCD)](#greatest-common-divisor-gcd) * [Greatest common divisor (GCD)](#greatest-common-divisor-gcd)
* [Head of list](#head-of-list) * [Head of list](#head-of-list)
* [Initial of list](#initial-of-list) * [Initial of list](#initial-of-list)
@ -36,6 +36,8 @@
* [Random number in range](#random-number-in-range) * [Random number in range](#random-number-in-range)
* [Randomize order of array](#randomize-order-of-array) * [Randomize order of array](#randomize-order-of-array)
* [Redirect to url](#redirect-to-url) * [Redirect to url](#redirect-to-url)
* [Reverse a string](#reverse-a-string)
* [RGB to hexadecimal](#rgb-to-hexadecimal)
* [Scroll to top](#scroll-to-top) * [Scroll to top](#scroll-to-top)
* [Similarity between arrays](#similarity-between-arrays) * [Similarity between arrays](#similarity-between-arrays)
* [Sort characters in string (alphabetical)](#sort-characters-in-string-alphabetical) * [Sort characters in string (alphabetical)](#sort-characters-in-string-alphabetical)
@ -43,40 +45,10 @@
* [Swap values of two variables](#swap-values-of-two-variables) * [Swap values of two variables](#swap-values-of-two-variables)
* [Tail of list](#tail-of-list) * [Tail of list](#tail-of-list)
* [Unique values of array](#unique-values-of-array) * [Unique values of array](#unique-values-of-array)
* [URL parameters](#url-parameters)
* [UUID generator](#uuid-generator)
* [Validate number](#validate-number) * [Validate number](#validate-number)
### RGB to hexadecimal
Convert each value to a hexadecimal string, using `toString(16)`, then `padStart(2,'0')` to get a 2-digit hexadecimal value.
Combine values using `join('')`.
```js
var rgbToHex = (r, g, b) =>
[r,g,b].map( v => v.toString(16).padStart(2,'0')).join('');
```
### URL parameters
Use `match()` with an appropriate regular expression to get all key-value pairs, `map()` them appropriately.
Combine all key-value pairs into a single object using `Object.assign()` and the spread operator (`...`).
Pass `location.search` as the argument to apply to the current `url`.
```js
var getUrlParameters = url =>
Object.assign(...url.match(/([^?=&]+)(=([^&]*))?/g).map(m => {[f,v] = m.split('='); return {[f]:v}}));
```
### UUID generator
Use `crypto` API to generate a UUID, compliant with [RFC4122](https://www.ietf.org/rfc/rfc4122.txt) version 4.
```js
var uuid = _ =>
( [1e7]+-1e3+-4e3+-8e3+-1e11 ).replace( /[018]/g, c =>
(c ^ crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> c / 4).toString(16)
)
```
### Anagrams of string (with duplicates) ### Anagrams of string (with duplicates)
Use recursion. Use recursion.
@ -85,7 +57,7 @@ Use `map()` to combine the letter with each partial anagram, then `reduce()` to
Base cases are for string `length` equal to `2` or `1`. Base cases are for string `length` equal to `2` or `1`.
```js ```js
var anagrams = s => { const anagrams = s => {
if(s.length <= 2) return s.length === 2 ? [s, s[1] + s[0]] : [s]; if(s.length <= 2) return s.length === 2 ? [s, s[1] + s[0]] : [s];
return s.split('').reduce( (a,l,i) => { return s.split('').reduce( (a,l,i) => {
anagrams(s.slice(0,i) + s.slice(i+1)).map( v => a.push(l+v) ); anagrams(s.slice(0,i) + s.slice(i+1)).map( v => a.push(l+v) );
@ -99,24 +71,34 @@ var anagrams = s => {
Use `reduce()` to add each value to an accumulator, initialized with a value of `0`, divide by the `length` of the array. Use `reduce()` to add each value to an accumulator, initialized with a value of `0`, divide by the `length` of the array.
```js ```js
var average = arr => const average = arr =>
arr.reduce( (acc , val) => acc + val, 0) / arr.length; arr.reduce( (acc , val) => acc + val, 0) / arr.length;
``` ```
### Capitalize first letter of every word
Use `replace()` to match the first character of each word and `toUpperCase()` to capitalize it.
```js
const capitalizeEveryWord = str => str.replace(/\b[a-z]/g, char => char.toUpperCase());
```
### Capitalize first letter ### Capitalize first letter
Use `toUpperCase()` to capitalize first letter, `slice(1)` to get the rest of the string. Use `slice(0,1)` and `toUpperCase()` to capitalize first letter, `slice(1)` to get the rest of the string.
Omit the `lowerRest` parameter to keep the rest of the string intact, or set it to `true` to convert to lower case.
```js ```js
var capitalize = str => str[0].toUpperCase() + str.slice(1); const capitalize = (str, lowerRest = false) =>
str.slice(0, 1).toUpperCase() + (lowerRest? str.slice(1).toLowerCase() : str.slice(1));
``` ```
### Count occurrences of a value in array ### Count occurrences of a value in array
Use `filter()` to create an array containing only the items with the specified value, count them using `length`. Use `reduce()` to increment a counter each time you encounter the specific value inside the array.
```js ```js
var countOccurrences = (arr, value) => arr.filter(v => v === value).length; const countOccurrences = (arr, value) => arr.reduce((a, v) => v===value ? a + 1 : a + 0, 0);
``` ```
### Current URL ### Current URL
@ -124,7 +106,7 @@ var countOccurrences = (arr, value) => arr.filter(v => v === value).length;
Use `window.location.href` to get current URL. Use `window.location.href` to get current URL.
```js ```js
var currentUrl = _ => window.location.href; const currentUrl = _ => window.location.href;
``` ```
### Curry ### Curry
@ -134,27 +116,25 @@ If the number of provided arguments (`args`) is sufficient, call the passed func
Otherwise return a curried function `f` that expects the rest of the arguments. Otherwise return a curried function `f` that expects the rest of the arguments.
```js ```js
var curry = f => const curry = f =>
(...args) => (...args) =>
args.length >= f.length ? f(...args) : (...otherArgs) => curry(f)(...args, ...otherArgs) args.length >= f.length ? f(...args) : (...otherArgs) => curry(f)(...args, ...otherArgs)
``` ```
### Difference between arrays ### Difference between arrays
Use `filter()` to remove values that are part of `values`, determined using `indexOf()`. Use `filter()` to remove values that are part of `values`, determined using `includes()`.
```js ```js
var difference = (arr, values) => const difference = (arr, values) => arr.filter(v => !values.includes(v));
arr.filter(v => values.indexOf(v) === -1);
``` ```
### Distance between two points ### Distance between two points
Use `Math.pow()` and `Math.sqrt()` to calculate the Euclidean distance between two points. Use `Math.hypot()` to calculate the Euclidean distance between two points.
```js ```js
var distance = x0, y0, x1, y1 => const distance = (x0, y0, x1, y1) => Math.hypot(x1 - x0, y1 - y0);
Math.sqrt(Math.pow(x1-x0, 2) + Math.pow(y1 - y0, 2))
``` ```
### Escape regular expression ### Escape regular expression
@ -162,7 +142,7 @@ var distance = x0, y0, x1, y1 =>
Use `replace()` to escape special characters. Use `replace()` to escape special characters.
```js ```js
var escapeRegExp = s => const escapeRegExp = s =>
s.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'); s.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
} }
``` ```
@ -173,16 +153,17 @@ Use `Math.abs()` to extend logic to negative numbers, check using the modulo (`%
Return `true` if the number is even, `false` if the number is odd. Return `true` if the number is even, `false` if the number is odd.
```js ```js
var isEven = num => Math.abs(num) % 2 === 0; const isEven = num => Math.abs(num) % 2 === 0;
``` ```
### Factorial ### Factorial
Create an array of length `n+1`, use `reduce()` to get the product of every value in the given range, utilizing the index of each element. Use recursion.
If `n` is less than or equal to `1`, return `1`.
Otherwise, return the product of `n` and the factorial of `n - 1`.
```js ```js
var factorial = n => const factorial = n => n <= 1 ? 1 : n * factorial(n - 1)
Array.apply(null, [1].concat(Array(n))).reduce( (a, _, i) => a * i || 1 , 1);
``` ```
### Fibonacci array generator ### Fibonacci array generator
@ -191,7 +172,7 @@ Create an empty array of the specific length, initializing the first two values
Use `reduce()` to add values into the array, using the sum of the last two values, except for the first two. Use `reduce()` to add values into the array, using the sum of the last two values, except for the first two.
```js ```js
var fibonacci = n => const fibonacci = n =>
Array.apply(null, [0,1].concat(Array(n-2))).reduce( Array.apply(null, [0,1].concat(Array(n-2))).reduce(
(acc, val, i) => { (acc, val, i) => {
acc.push( i>1 ? acc[i-1]+acc[i-2] : val); acc.push( i>1 ? acc[i-1]+acc[i-2] : val);
@ -199,16 +180,37 @@ var fibonacci = n =>
},[]); },[]);
``` ```
### Filter out non-unique values in an array
Use `Array.filter()` for an array containing only the unique values.
```js
const unique = arr => arr.filter(i => arr.indexOf(i) === arr.lastIndexOf(i));
// unique([1,2,2,3,4,4,5]) -> [1,3,5]
```
### Flatten array ### Flatten array
Use recursion. Use recursion.
Use `reduce()` to get all elements that are not arrays, flatten each element that is an array. Use `reduce()` to get all elements that are not arrays, flatten each element that is an array.
```js ```js
var flatten = arr => const flatten = arr =>
arr.reduce( (a, v) => a.concat( Array.isArray(v) ? flatten(v) : v ), []); arr.reduce( (a, v) => a.concat( Array.isArray(v) ? flatten(v) : v ), []);
``` ```
## Get scroll position
Use `pageXOffset` and `pageYOffset` if they are defined, otherwise `scrollLeft` and `scrollTop`.
You can omit `el` to use a default value of `window`.
```js
const getScrollPos = (el = window) =>
( {x: (el.pageXOffset !== undefined) ? el.pageXOffset : el.scrollLeft,
y: (el.pageYOffset !== undefined) ? el.pageYOffset : el.scrollTop} );
// getScrollPos() -> {x: 0, y: 200}
```
### Greatest common divisor (GCD) ### Greatest common divisor (GCD)
Use recursion. Use recursion.
@ -216,7 +218,7 @@ Base case is when `y` equals `0`. In this case, return `x`.
Otherwise, return the GCD of `y` and the remainder of the division `x/y`. Otherwise, return the GCD of `y` and the remainder of the division `x/y`.
```js ```js
var gcd = (x , y) => !y ? x : gcd(y, x % y); const gcd = (x , y) => !y ? x : gcd(y, x % y);
``` ```
### Head of list ### Head of list
@ -224,7 +226,7 @@ var gcd = (x , y) => !y ? x : gcd(y, x % y);
Return `arr[0]`. Return `arr[0]`.
```js ```js
var head = arr => arr[0]; const head = arr => arr[0];
``` ```
### Initial of list ### Initial of list
@ -232,7 +234,7 @@ var head = arr => arr[0];
Return `arr.slice(0,-1)`. Return `arr.slice(0,-1)`.
```js ```js
var initial = arr => arr.slice(0,-1); const initial = arr => arr.slice(0,-1);
``` ```
### Initialize array with range ### Initialize array with range
@ -241,7 +243,7 @@ Use `Array(end-start)` to create an array of the desired length, `map()` to fill
You can omit `start` to use a default value of `0`. You can omit `start` to use a default value of `0`.
```js ```js
var initializeArrayRange = (end, start = 0) => const initializeArrayRange = (end, start = 0) =>
Array.apply(null, Array(end-start)).map( (v,i) => i + start ); Array.apply(null, Array(end-start)).map( (v,i) => i + start );
``` ```
@ -251,7 +253,7 @@ Use `Array(n)` to create an array of the desired length, `fill(v)` to fill it wi
You can omit `v` to use a default value of `0`. You can omit `v` to use a default value of `0`.
```js ```js
var initializeArray = (n, v = 0) => const initializeArray = (n, v = 0) =>
Array(n).fill(v); Array(n).fill(v);
``` ```
@ -260,7 +262,7 @@ var initializeArray = (n, v = 0) =>
Return `arr.slice(-1)[0]`. Return `arr.slice(-1)[0]`.
```js ```js
var initial = arr => arr.slice(-1)[0]; const last = arr => arr.slice(-1)[0];
``` ```
### Measure time taken by function ### Measure time taken by function
@ -269,7 +271,7 @@ Use `performance.now()` to get start and end time for the function, `console.log
First argument is the function name, subsequent arguments are passed to the function. First argument is the function name, subsequent arguments are passed to the function.
```js ```js
var timeTaken = (f,...args) => { const timeTaken = (f,...args) => {
var t0 = performance.now(), r = f(...args); var t0 = performance.now(), r = f(...args);
console.log(performance.now() - t0); console.log(performance.now() - t0);
return r; return r;
@ -278,11 +280,10 @@ var timeTaken = (f,...args) => {
### Object from key-value pairs ### Object from key-value pairs
Use `map()` to create objects for each key-value pair, combine with `Object.assign()`. Use `Array.reduce()` to create and combine key-value pairs.
```js ```js
var objectFromPairs = arr => const objectFromPairs = arr => arr => arr.reduce((a,b) => { a[b[0]] = b[1]; return a;}, {});
Object.assign(...arr.map( v => ({ [v[0]] : v[1] })));
``` ```
### Powerset ### Powerset
@ -290,7 +291,7 @@ var objectFromPairs = arr =>
Use `reduce()` combined with `map()` to iterate over elements and combine into an array containing all combinations. Use `reduce()` combined with `map()` to iterate over elements and combine into an array containing all combinations.
```js ```js
var powerset = arr => const powerset = arr =>
arr.reduce( (a,v) => a.concat(a.map( r => [v].concat(r) )), [[]]); arr.reduce( (a,v) => a.concat(a.map( r => [v].concat(r) )), [[]]);
``` ```
@ -299,7 +300,7 @@ var powerset = arr =>
Use `Math.random()` to generate a random value, map it to the desired range using multiplication. Use `Math.random()` to generate a random value, map it to the desired range using multiplication.
```js ```js
var randomInRange = (min, max) => Math.random() * (max - min) + min; const randomInRange = (min, max) => Math.random() * (max - min) + min;
``` ```
### Randomize order of array ### Randomize order of array
@ -307,7 +308,7 @@ var randomInRange = (min, max) => Math.random() * (max - min) + min;
Use `sort()` to reorder elements, utilizing `Math.random()` to randomize the sorting. Use `sort()` to reorder elements, utilizing `Math.random()` to randomize the sorting.
```js ```js
var randomizeOrder = arr => arr.sort( (a,b) => Math.random() >= 0.5 ? -1 : 1) const randomizeOrder = arr => arr.sort( (a,b) => Math.random() >= 0.5 ? -1 : 1)
``` ```
### Redirect to URL ### Redirect to URL
@ -316,18 +317,37 @@ Use `window.location.href` or `window.location.replace()` to redirect to `url`.
Pass a second argument to simulate a link click (`true` - default) or an HTTP redirect (`false`). Pass a second argument to simulate a link click (`true` - default) or an HTTP redirect (`false`).
```js ```js
var redirect = (url, asLink = true) => const redirect = (url, asLink = true) =>
asLink ? window.location.href = url : window.location.replace(url); asLink ? window.location.href = url : window.location.replace(url);
``` ```
### Reverse a string
Use array destructuring and `Array.reverse()` to reverse the order of the characters in the string.
Combine characters to get a string using `join('')`.
```js
const reverseString = str => [...str].reverse().join('');
```
### RGB to hexadecimal
Convert each value to a hexadecimal string, using `toString(16)`, then `padStart(2,'0')` to get a 2-digit hexadecimal value.
Combine values using `join('')`.
```js
const rgbToHex = (r, g, b) =>
[r,g,b].map( v => v.toString(16).padStart(2,'0')).join('');
```
### Scroll to top ### Scroll to top
Get distance from top using `document.documentElement.scrollTop` or `document.body.scrollTop`. Get distance from top using `document.documentElement.scrollTop` or `document.body.scrollTop`.
Scroll by a fraction of the distance from top. Use `window.requestFrame()` to animate the scrolling. Scroll by a fraction of the distance from top. Use `window.requestAnimationFrame()` to animate the scrolling.
```js ```js
var scrollToTop = _ => { const scrollToTop = _ => {
var c = document.documentElement.scrollTop || document.body.scrollTop; const c = document.documentElement.scrollTop || document.body.scrollTop;
if(c > 0) { if(c > 0) {
window.requestAnimationFrame(scrollToTop); window.requestAnimationFrame(scrollToTop);
window.scrollTo(0, c - c/8); window.scrollTo(0, c - c/8);
@ -337,11 +357,10 @@ var scrollToTop = _ => {
### Similarity between arrays ### Similarity between arrays
Use `filter()` to remove values that are not part of `values`, determined using `indexOf()`. Use `filter()` to remove values that are not part of `values`, determined using `includes()`.
```js ```js
var difference = (arr, values) => const difference = (arr, values) => arr.filter(v => values.includes(v));
arr.filter(v => values.indexOf(v) !== -1);
``` ```
### Sort characters in string (alphabetical) ### Sort characters in string (alphabetical)
@ -349,7 +368,7 @@ var difference = (arr, values) =>
Split the string using `split('')`, `sort()` utilizing `localeCompare()`, recombine using `join('')`. Split the string using `split('')`, `sort()` utilizing `localeCompare()`, recombine using `join('')`.
```js ```js
var sortCharactersInString = str => const sortCharactersInString = str =>
str.split('').sort( (a,b) => a.localeCompare(b) ).join(''); str.split('').sort( (a,b) => a.localeCompare(b) ).join('');
``` ```
@ -358,7 +377,7 @@ var sortCharactersInString = str =>
Use `reduce()` to add each value to an accumulator, initialized with a value of `0`. Use `reduce()` to add each value to an accumulator, initialized with a value of `0`.
```js ```js
var sum = arr => const sum = arr =>
arr.reduce( (acc , val) => acc + val, 0); arr.reduce( (acc , val) => acc + val, 0);
``` ```
@ -375,21 +394,38 @@ Use array destructuring to swap values between two variables.
Return `arr.slice(1)`. Return `arr.slice(1)`.
```js ```js
var tail = arr => arr.slice(1); const tail = arr => arr.slice(1);
``` ```
### Unique values of array ### Unique values of array
Use `reduce()` to accumulate all unique values in an array. Use ES6 `Set` and the `...rest` operator to discard all duplicated values.
Check if each value has already been added, using `indexOf()` on the accumulator array.
```js ```js
var uniqueValues = arr => const unique = arr => [...new Set(arr)];
arr.reduce( (acc, val) => { // unique([1,2,2,3,4,4,5]) -> [1,2,3,4,5]
if(acc.indexOf(val) === -1) ```
acc.push(val);
return acc; ### URL parameters
}, []);
Use `match()` with an appropriate regular expression to get all key-value pairs, `map()` them appropriately.
Combine all key-value pairs into a single object using `Object.assign()` and the spread operator (`...`).
Pass `location.search` as the argument to apply to the current `url`.
```js
const getUrlParameters = url =>
Object.assign(...url.match(/([^?=&]+)(=([^&]*))?/g).map(m => {[f,v] = m.split('='); return {[f]:v}}));
```
### UUID generator
Use `crypto` API to generate a UUID, compliant with [RFC4122](https://www.ietf.org/rfc/rfc4122.txt) version 4.
```js
const uuid = _ =>
( [1e7]+-1e3+-4e3+-8e3+-1e11 ).replace( /[018]/g, c =>
(c ^ crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> c / 4).toString(16)
)
``` ```
### Validate number ### Validate number
@ -398,7 +434,7 @@ Use `!isNaN` in combination with `parseFloat()` to check if the argument is a nu
Use `isFinite()` to check if the number is finite. Use `isFinite()` to check if the number is finite.
```js ```js
var validateNumber = n => !isNaN(parseFloat(n)) && isFinite(n); const validateNumber = n => !isNaN(parseFloat(n)) && isFinite(n);
``` ```
## Credits ## Credits

14
scripts/builder.js
View File

@ -7,7 +7,19 @@ var staticPartsPath = './static-parts';
var snippets = {}, startPart = '', endPart = '', output = ''; var snippets = {}, startPart = '', endPart = '', output = '';
try { try {
for(var snippet of fs.readdirSync(snippetsPath)){ var snippetFilenames = fs.readdirSync(snippetsPath);
snippetFilenames.sort((a, b) => {
a = a.toLowerCase();
b = b.toLowerCase();
if (a < b) {
return -1;
}
if (a > b) {
return 1;
}
return 0;
});
for(var snippet of snippetFilenames){
snippets[snippet] = fs.readFileSync(path.join(snippetsPath,snippet),'utf8'); snippets[snippet] = fs.readFileSync(path.join(snippetsPath,snippet),'utf8');
} }
} }

2
snippets/RGB-to-hexadecimal.md
View File

@ -4,6 +4,6 @@ Convert each value to a hexadecimal string, using `toString(16)`, then `padStart
Combine values using `join('')`. Combine values using `join('')`.
```js ```js
var rgbToHex = (r, g, b) => const rgbToHex = (r, g, b) =>
[r,g,b].map( v => v.toString(16).padStart(2,'0')).join(''); [r,g,b].map( v => v.toString(16).padStart(2,'0')).join('');
``` ```

2
snippets/URL-parameters.md
View File

@ -5,6 +5,6 @@ Combine all key-value pairs into a single object using `Object.assign()` and the
Pass `location.search` as the argument to apply to the current `url`. Pass `location.search` as the argument to apply to the current `url`.
```js ```js
var getUrlParameters = url => const getUrlParameters = url =>
Object.assign(...url.match(/([^?=&]+)(=([^&]*))?/g).map(m => {[f,v] = m.split('='); return {[f]:v}})); Object.assign(...url.match(/([^?=&]+)(=([^&]*))?/g).map(m => {[f,v] = m.split('='); return {[f]:v}}));
``` ```

2
snippets/UUID-generator.md
View File

@ -3,7 +3,7 @@
Use `crypto` API to generate a UUID, compliant with [RFC4122](https://www.ietf.org/rfc/rfc4122.txt) version 4. Use `crypto` API to generate a UUID, compliant with [RFC4122](https://www.ietf.org/rfc/rfc4122.txt) version 4.
```js ```js
var uuid = _ => const uuid = _ =>
( [1e7]+-1e3+-4e3+-8e3+-1e11 ).replace( /[018]/g, c => ( [1e7]+-1e3+-4e3+-8e3+-1e11 ).replace( /[018]/g, c =>
(c ^ crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> c / 4).toString(16) (c ^ crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> c / 4).toString(16)
) )

2
snippets/anagrams-of-string-(with-duplicates).md
View File

@ -6,7 +6,7 @@ Use `map()` to combine the letter with each partial anagram, then `reduce()` to
Base cases are for string `length` equal to `2` or `1`. Base cases are for string `length` equal to `2` or `1`.
```js ```js
var anagrams = s => { const anagrams = s => {
if(s.length <= 2) return s.length === 2 ? [s, s[1] + s[0]] : [s]; if(s.length <= 2) return s.length === 2 ? [s, s[1] + s[0]] : [s];
return s.split('').reduce( (a,l,i) => { return s.split('').reduce( (a,l,i) => {
anagrams(s.slice(0,i) + s.slice(i+1)).map( v => a.push(l+v) ); anagrams(s.slice(0,i) + s.slice(i+1)).map( v => a.push(l+v) );

2
snippets/average-of-array-of-numbers.md
View File

@ -3,6 +3,6 @@
Use `reduce()` to add each value to an accumulator, initialized with a value of `0`, divide by the `length` of the array. Use `reduce()` to add each value to an accumulator, initialized with a value of `0`, divide by the `length` of the array.
```js ```js
var average = arr => const average = arr =>
arr.reduce( (acc , val) => acc + val, 0) / arr.length; arr.reduce( (acc , val) => acc + val, 0) / arr.length;
``` ```

7
snippets/capitalize-first-letter-of-every-word.md Normal file
View File

@ -0,0 +1,7 @@
### Capitalize first letter of every word
Use `replace()` to match the first character of each word and `toUpperCase()` to capitalize it.
```js
const capitalizeEveryWord = str => str.replace(/\b[a-z]/g, char => char.toUpperCase());
```

6
snippets/capitalize-first-letter.md
View File

@ -1,7 +1,9 @@
### Capitalize first letter ### Capitalize first letter
Use `toUpperCase()` to capitalize first letter, `slice(1)` to get the rest of the string. Use `slice(0,1)` and `toUpperCase()` to capitalize first letter, `slice(1)` to get the rest of the string.
Omit the `lowerRest` parameter to keep the rest of the string intact, or set it to `true` to convert to lower case.
```js ```js
var capitalize = str => str[0].toUpperCase() + str.slice(1); const capitalize = (str, lowerRest = false) =>
str.slice(0, 1).toUpperCase() + (lowerRest? str.slice(1).toLowerCase() : str.slice(1));
``` ```

4
snippets/count-occurrences-of-a-value-in-array.md
View File

@ -1,7 +1,7 @@
### Count occurrences of a value in array ### Count occurrences of a value in array
Use `filter()` to create an array containing only the items with the specified value, count them using `length`. Use `reduce()` to increment a counter each time you encounter the specific value inside the array.
```js ```js
var countOccurrences = (arr, value) => arr.filter(v => v === value).length; const countOccurrences = (arr, value) => arr.reduce((a, v) => v===value ? a + 1 : a + 0, 0);
``` ```

2
snippets/current-URL.md
View File

@ -3,5 +3,5 @@
Use `window.location.href` to get current URL. Use `window.location.href` to get current URL.
```js ```js
var currentUrl = _ => window.location.href; const currentUrl = _ => window.location.href;
``` ```

2
snippets/curry.md
View File

@ -5,7 +5,7 @@ If the number of provided arguments (`args`) is sufficient, call the passed func
Otherwise return a curried function `f` that expects the rest of the arguments. Otherwise return a curried function `f` that expects the rest of the arguments.
```js ```js
var curry = f => const curry = f =>
(...args) => (...args) =>
args.length >= f.length ? f(...args) : (...otherArgs) => curry(f)(...args, ...otherArgs) args.length >= f.length ? f(...args) : (...otherArgs) => curry(f)(...args, ...otherArgs)
``` ```

5
snippets/difference-between-arrays.md
View File

@ -1,8 +1,7 @@
### Difference between arrays ### Difference between arrays
Use `filter()` to remove values that are part of `values`, determined using `indexOf()`. Use `filter()` to remove values that are part of `values`, determined using `includes()`.
```js ```js
var difference = (arr, values) => const difference = (arr, values) => arr.filter(v => !values.includes(v));
arr.filter(v => values.indexOf(v) === -1);
``` ```

5
snippets/distance-between-two-points.md
View File

@ -1,8 +1,7 @@
### Distance between two points ### Distance between two points
Use `Math.pow()` and `Math.sqrt()` to calculate the Euclidean distance between two points. Use `Math.hypot()` to calculate the Euclidean distance between two points.
```js ```js
var distance = x0, y0, x1, y1 => const distance = (x0, y0, x1, y1) => Math.hypot(x1 - x0, y1 - y0);
Math.sqrt(Math.pow(x1-x0, 2) + Math.pow(y1 - y0, 2))
``` ```

2
snippets/escape-regular-expression.md
View File

@ -3,7 +3,7 @@
Use `replace()` to escape special characters. Use `replace()` to escape special characters.
```js ```js
var escapeRegExp = s => const escapeRegExp = s =>
s.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'); s.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
} }
``` ```

2
snippets/even-or-odd-number.md
View File

@ -4,5 +4,5 @@ Use `Math.abs()` to extend logic to negative numbers, check using the modulo (`%
Return `true` if the number is even, `false` if the number is odd. Return `true` if the number is even, `false` if the number is odd.
```js ```js
var isEven = num => Math.abs(num) % 2 === 0; const isEven = num => Math.abs(num) % 2 === 0;
``` ```

7
snippets/factorial.md
View File

@ -1,8 +1,9 @@
### Factorial ### Factorial
Create an array of length `n+1`, use `reduce()` to get the product of every value in the given range, utilizing the index of each element. Use recursion.
If `n` is less than or equal to `1`, return `1`.
Otherwise, return the product of `n` and the factorial of `n - 1`.
```js ```js
var factorial = n => const factorial = n => n <= 1 ? 1 : n * factorial(n - 1)
Array.apply(null, [1].concat(Array(n))).reduce( (a, _, i) => a * i || 1 , 1);
``` ```

2
snippets/fibonacci-array-generator.md
View File

@ -4,7 +4,7 @@ Create an empty array of the specific length, initializing the first two values
Use `reduce()` to add values into the array, using the sum of the last two values, except for the first two. Use `reduce()` to add values into the array, using the sum of the last two values, except for the first two.
```js ```js
var fibonacci = n => const fibonacci = n =>
Array.apply(null, [0,1].concat(Array(n-2))).reduce( Array.apply(null, [0,1].concat(Array(n-2))).reduce(
(acc, val, i) => { (acc, val, i) => {
acc.push( i>1 ? acc[i-1]+acc[i-2] : val); acc.push( i>1 ? acc[i-1]+acc[i-2] : val);

8
snippets/filter-out-non-uniqe-values-in-an-array.md Normal file
View File

@ -0,0 +1,8 @@
### Filter out non-unique values in an array
Use `Array.filter()` for an array containing only the unique values.
```js
const unique = arr => arr.filter(i => arr.indexOf(i) === arr.lastIndexOf(i));
// unique([1,2,2,3,4,4,5]) -> [1,3,5]
```

2
snippets/flatten-array.md
View File

@ -4,6 +4,6 @@ Use recursion.
Use `reduce()` to get all elements that are not arrays, flatten each element that is an array. Use `reduce()` to get all elements that are not arrays, flatten each element that is an array.
```js ```js
var flatten = arr => const flatten = arr =>
arr.reduce( (a, v) => a.concat( Array.isArray(v) ? flatten(v) : v ), []); arr.reduce( (a, v) => a.concat( Array.isArray(v) ? flatten(v) : v ), []);
``` ```

11
snippets/get-scroll-position.md Normal file
View File

@ -0,0 +1,11 @@
## Get scroll position
Use `pageXOffset` and `pageYOffset` if they are defined, otherwise `scrollLeft` and `scrollTop`.
You can omit `el` to use a default value of `window`.
```js
const getScrollPos = (el = window) =>
( {x: (el.pageXOffset !== undefined) ? el.pageXOffset : el.scrollLeft,
y: (el.pageYOffset !== undefined) ? el.pageYOffset : el.scrollTop} );
// getScrollPos() -> {x: 0, y: 200}
```

2
snippets/greatest-common-divisor-(GCD).md
View File

@ -5,5 +5,5 @@ Base case is when `y` equals `0`. In this case, return `x`.
Otherwise, return the GCD of `y` and the remainder of the division `x/y`. Otherwise, return the GCD of `y` and the remainder of the division `x/y`.
```js ```js
var gcd = (x , y) => !y ? x : gcd(y, x % y); const gcd = (x , y) => !y ? x : gcd(y, x % y);
``` ```

2
snippets/head-of-list.md
View File

@ -3,5 +3,5 @@
Return `arr[0]`. Return `arr[0]`.
```js ```js
var head = arr => arr[0]; const head = arr => arr[0];
``` ```

2
snippets/initial-of-list.md
View File

@ -3,5 +3,5 @@
Return `arr.slice(0,-1)`. Return `arr.slice(0,-1)`.
```js ```js
var initial = arr => arr.slice(0,-1); const initial = arr => arr.slice(0,-1);
``` ```

2
snippets/initialize-array-with-range.md
View File

@ -4,6 +4,6 @@ Use `Array(end-start)` to create an array of the desired length, `map()` to fill
You can omit `start` to use a default value of `0`. You can omit `start` to use a default value of `0`.
```js ```js
var initializeArrayRange = (end, start = 0) => const initializeArrayRange = (end, start = 0) =>
Array.apply(null, Array(end-start)).map( (v,i) => i + start ); Array.apply(null, Array(end-start)).map( (v,i) => i + start );
``` ```

2
snippets/initialize-array-with-values.md
View File

@ -4,6 +4,6 @@ Use `Array(n)` to create an array of the desired length, `fill(v)` to fill it wi
You can omit `v` to use a default value of `0`. You can omit `v` to use a default value of `0`.
```js ```js
var initializeArray = (n, v = 0) => const initializeArray = (n, v = 0) =>
Array(n).fill(v); Array(n).fill(v);
``` ```

2
snippets/last-of-list.md
View File

@ -3,5 +3,5 @@
Return `arr.slice(-1)[0]`. Return `arr.slice(-1)[0]`.
```js ```js
var initial = arr => arr.slice(-1)[0]; const last = arr => arr.slice(-1)[0];
``` ```

2
snippets/measure-time-taken-by-function.md
View File

@ -4,7 +4,7 @@ Use `performance.now()` to get start and end time for the function, `console.log
First argument is the function name, subsequent arguments are passed to the function. First argument is the function name, subsequent arguments are passed to the function.
```js ```js
var timeTaken = (f,...args) => { const timeTaken = (f,...args) => {
var t0 = performance.now(), r = f(...args); var t0 = performance.now(), r = f(...args);
console.log(performance.now() - t0); console.log(performance.now() - t0);
return r; return r;

2
snippets/object-from-key-value-pairs.md
View File

@ -3,5 +3,5 @@
Use `Array.reduce()` to create and combine key-value pairs. Use `Array.reduce()` to create and combine key-value pairs.
```js ```js
const objectFromPairs = arr => arr => arr.reduce((a,b) => { a[b[0]] = b[1]; return a;}, {}) const objectFromPairs = arr => arr => arr.reduce((a,b) => { a[b[0]] = b[1]; return a;}, {});
``` ```

2
snippets/powerset.md
View File

@ -3,6 +3,6 @@
Use `reduce()` combined with `map()` to iterate over elements and combine into an array containing all combinations. Use `reduce()` combined with `map()` to iterate over elements and combine into an array containing all combinations.
```js ```js
var powerset = arr => const powerset = arr =>
arr.reduce( (a,v) => a.concat(a.map( r => [v].concat(r) )), [[]]); arr.reduce( (a,v) => a.concat(a.map( r => [v].concat(r) )), [[]]);
``` ```

2
snippets/random-number-in-range.md
View File

@ -3,5 +3,5 @@
Use `Math.random()` to generate a random value, map it to the desired range using multiplication. Use `Math.random()` to generate a random value, map it to the desired range using multiplication.
```js ```js
var randomInRange = (min, max) => Math.random() * (max - min) + min; const randomInRange = (min, max) => Math.random() * (max - min) + min;
``` ```

2
snippets/randomize-order-of-array.md
View File

@ -3,5 +3,5 @@
Use `sort()` to reorder elements, utilizing `Math.random()` to randomize the sorting. Use `sort()` to reorder elements, utilizing `Math.random()` to randomize the sorting.
```js ```js
var randomizeOrder = arr => arr.sort( (a,b) => Math.random() >= 0.5 ? -1 : 1) const randomizeOrder = arr => arr.sort( (a,b) => Math.random() >= 0.5 ? -1 : 1)
``` ```

2
snippets/redirect-to-url.md
View File

@ -4,6 +4,6 @@ Use `window.location.href` or `window.location.replace()` to redirect to `url`.
Pass a second argument to simulate a link click (`true` - default) or an HTTP redirect (`false`). Pass a second argument to simulate a link click (`true` - default) or an HTTP redirect (`false`).
```js ```js
var redirect = (url, asLink = true) => const redirect = (url, asLink = true) =>
asLink ? window.location.href = url : window.location.replace(url); asLink ? window.location.href = url : window.location.replace(url);
``` ```

8
snippets/reverse-a-string.md Normal file
View File

@ -0,0 +1,8 @@
### Reverse a string
Use array destructuring and `Array.reverse()` to reverse the order of the characters in the string.
Combine characters to get a string using `join('')`.
```js
const reverseString = str => [...str].reverse().join('');
```

6
snippets/scroll-to-top.md
View File

@ -1,11 +1,11 @@
### Scroll to top ### Scroll to top
Get distance from top using `document.documentElement.scrollTop` or `document.body.scrollTop`. Get distance from top using `document.documentElement.scrollTop` or `document.body.scrollTop`.
Scroll by a fraction of the distance from top. Use `window.requestFrame()` to animate the scrolling. Scroll by a fraction of the distance from top. Use `window.requestAnimationFrame()` to animate the scrolling.
```js ```js
var scrollToTop = _ => { const scrollToTop = _ => {
var c = document.documentElement.scrollTop || document.body.scrollTop; const c = document.documentElement.scrollTop || document.body.scrollTop;
if(c > 0) { if(c > 0) {
window.requestAnimationFrame(scrollToTop); window.requestAnimationFrame(scrollToTop);
window.scrollTo(0, c - c/8); window.scrollTo(0, c - c/8);

5
snippets/similarity-between-arrays.md
View File

@ -1,8 +1,7 @@
### Similarity between arrays ### Similarity between arrays
Use `filter()` to remove values that are not part of `values`, determined using `indexOf()`. Use `filter()` to remove values that are not part of `values`, determined using `includes()`.
```js ```js
var difference = (arr, values) => const difference = (arr, values) => arr.filter(v => values.includes(v));
arr.filter(v => values.indexOf(v) !== -1);
``` ```

2
snippets/sort-characters-in-string-(alphabetical).md
View File

@ -3,6 +3,6 @@
Split the string using `split('')`, `sort()` utilizing `localeCompare()`, recombine using `join('')`. Split the string using `split('')`, `sort()` utilizing `localeCompare()`, recombine using `join('')`.
```js ```js
var sortCharactersInString = str => const sortCharactersInString = str =>
str.split('').sort( (a,b) => a.localeCompare(b) ).join(''); str.split('').sort( (a,b) => a.localeCompare(b) ).join('');
``` ```

2
snippets/sum-of-array-of-numbers.md
View File

@ -3,6 +3,6 @@
Use `reduce()` to add each value to an accumulator, initialized with a value of `0`. Use `reduce()` to add each value to an accumulator, initialized with a value of `0`.
```js ```js
var sum = arr => const sum = arr =>
arr.reduce( (acc , val) => acc + val, 0); arr.reduce( (acc , val) => acc + val, 0);
``` ```

2
snippets/tail-of-list.md
View File

@ -3,5 +3,5 @@
Return `arr.slice(1)`. Return `arr.slice(1)`.
```js ```js
var tail = arr => arr.slice(1); const tail = arr => arr.slice(1);
``` ```

11
snippets/unique-values-of-array.md
View File

@ -1,13 +1,8 @@
### Unique values of array ### Unique values of array
Use `reduce()` to accumulate all unique values in an array. Use ES6 `Set` and the `...rest` operator to discard all duplicated values.
Check if each value has already been added, using `indexOf()` on the accumulator array.
```js ```js
var uniqueValues = arr => const unique = arr => [...new Set(arr)];
arr.reduce( (acc, val) => { // unique([1,2,2,3,4,4,5]) -> [1,2,3,4,5]
if(acc.indexOf(val) === -1)
acc.push(val);
return acc;
}, []);
``` ```

2
snippets/validate-number.md
View File

@ -4,5 +4,5 @@ Use `!isNaN` in combination with `parseFloat()` to check if the argument is a nu
Use `isFinite()` to check if the number is finite. Use `isFinite()` to check if the number is finite.
```js ```js
var validateNumber = n => !isNaN(parseFloat(n)) && isFinite(n); const validateNumber = n => !isNaN(parseFloat(n)) && isFinite(n);
``` ```