Last active
December 20, 2022 13:48
-
-
Save paulknulst/5779facd18d7c849d24bde46e307f98c to your computer and use it in GitHub Desktop.
14 Important JavaScript Functions Every Web Developer Should Know - https://medium.com/javascript-in-plain-english/14-important-javascript-functions-every-web-developer-should-know-e34169ae91c8
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// 1. Max Number | |
const maxN = (arr, n = 1) => [...arr].sort((a, b) => b - a).slice(0, n); | |
maxN([1, 2, 3, 4]); // [4] | |
maxN([2, 4, 6, 4, 3], 2); // [6, 4] | |
// 2. Ternary Operator | |
function temparature(temp) { | |
return temp > 39 || temp < 35.5 | |
? 'Visit Doctor!' | |
: temp < 37.5 && temp > 36.5 | |
? 'Go Out and Play!!' | |
: temp <= 39 && temp >= 35.5 | |
? 'Take Some Rest!' | |
: ''; | |
} | |
console.log(temparature(38)); // Take Some Rest! | |
console.log(temparature(36)); // Take Some Rest! | |
console.log(temparature(39.1)); // Visit Doctor! | |
console.log(temparature(35.1)); // Visit Doctor! | |
console.log(temparature(37)); // Go Out and Play | |
// 3. Remove duplicates from an array | |
function removeDuplicates(array) { | |
return [...new Set(array)]; | |
} | |
const uniqueStr = removeDuplicates(['Paul', 'John', 'Harald', 'Paul', 'John']); | |
const uniqueNr = removeDuplicates([1, 1, 2, 2, 3, 3, 4, 5, 6, 7, 7, 7, 9]); | |
console.log(uniqueStr); // [ 'Paul', 'John', 'Harald' ] | |
console.log(uniqueNr); // [1, 2, 3, 4, 5, 6, 7, 9] | |
// 4. Find a specific object in an array | |
const employess = [ | |
{ name: 'Paul', job_title: 'Software Engineer' }, | |
{ name: 'Peter', job_title: 'Web Developer' }, | |
{ name: 'Harald', job_title: 'Screen Designer' }, | |
]; | |
let sen = employess.find((data) => data.job_title === 'Software Engineer'); | |
console.log(sen); // { name: 'Paul', job_title: 'Software Engineer' } | |
// 5. Decapitalize | |
const decapitalize = ([first, ...rest]) => first.toLowerCase() + rest.join(''); | |
decapitalize('CamelCase'); // camelCase | |
decapitalize('Super'); // super | |
// 6. Reverse a String | |
const reverse = (input) => { | |
return input.split('').reverse().join(''); | |
}; | |
console.log(reverse('Paul Knulst')); // tslunK luaP | |
console.log(reverse('Twitter is awesome')); // emosewa si rettiwT | |
// 7. Calculate the Day of the Year | |
const dayOfYear = (date) => | |
Math.floor( | |
(date - new Date(date.getFullYear(), 0, 0)) / 1000 / 60 / 60 / 24 | |
); | |
dayOfYear(new Date()); // 350 | |
// 8. Convert an array to an HTML list element | |
const arrayToHtmlList = (arr, listID) => | |
((el) => ( | |
(el = document.querySelector('#' + listID)), | |
(el.innerHTML += arr.map((item) => `<li>${item}</li>`).join('')) | |
))(); | |
arrayToHtmlList(['item 1', 'item 2'], 'myListID'); | |
// 9. Shorten the console log | |
const log = console.log.bind(document); | |
const error = console.error.bind(document); | |
log('does it work?'); | |
log('yes'); | |
error('something bad happened'); | |
// 10. Get a sample size from an input arrayconst sampleSize = ([...arr], n = 1) => { | |
let m = arr.length; | |
while (m) { | |
const i = Math.floor(Math.random() * m--); | |
[arr[m], arr[i]] = [arr[i], arr[m]]; | |
} | |
return arr.slice(0, n); | |
}; | |
sampleSize([6, 7, 9, 2, 1], 2); // [9, 1] | |
sampleSize([5, 7, 2, 3, 4, 1, 8, 9], 4); // [7, 8, 9, 5] | |
sampleSize([5, 4, 6], 4); // [6, 5, 4] | |
// 11. Destructuring in JavaScript | |
const arr = ['Paul', 'Knulst', 'Software Engineer', 'Challenger']; | |
const [firstName, surname, ...rest] = arr; | |
console.log(firstName); // Paul | |
console.log(surname); // Knulst | |
console.log(rest); // ["Software Engineer", "Challenger"] | |
// …Actually, we can use it with any iterable, not only arrays: | |
let [a, b, c] = 'abc'; // a = "a", b = "b", c = "c" | |
let [one, two, three] = new Set([1, 2, 3]); // one = 1, two = 2, three = 3 | |
// 12. Deep flatten an array | |
const deepFlatten = (arr) => | |
[].concat(...arr.map((v) => (Array.isArray(v) ? deepFlatten(v) : v))); | |
deepFlatten([1, [2], [[3], 4], 5]); // [1,2,3,4,5] | |
// 13. Find multiple indexes within an array | |
const indexOfAll = (arr, val) => | |
arr.reduce((acc, el, i) => (el === val ? [...acc, i] : acc), []); | |
indexOfAll([1, 2, 3, 1, 2, 3], 1); // [0,3] | |
indexOfAll([1, 2, 3], 4); // [] | |
// 14. Check if the object is a specific type | |
const is = (type, val) => ![, null].includes(val) && val.constructor === type; | |
is(Array, [1]); // true | |
is(Array, 'hello'); // false | |
is(Map, new Map()); // true | |
is(Map, [2]); // false | |
is(RegExp, /./g); // true | |
is(Set, new Set()); // true |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
This Gist contains every example mentioned in this article: https://medium.com/javascript-in-plain-english/14-important-javascript-functions-every-web-developer-should-know-e34169ae91c8