Skip to content

Instantly share code, notes, and snippets.

@HatScripts HatScripts/array.js
Last active Jul 17, 2019

Embed
What would you like to do?
JavaScript helper snippets
// Find first value matching a condition
arr.find(e => someCondition(e))
// e.g.
[12, 5, 8, 130, 44].find(i => i > 100) // 130
[7, 3, 9, 5, 6, 1].find(i => i % 2 == 0) // 6
// Remove FIRST occurrence of value from array
let index = arr.indexOf(value)
if (index > -1) {
arr.splice(index, 1)
}
// Remove ALL occurrences of value from array
arr = arr.filter(item => item !== value)
// Custom sort
arr.sort((a, b) => {
return parseFloat(a.price) - parseFloat(b.price)
})
function setCookie(name, value, days) {
let expires = ''
if (days) {
let date = new Date()
date.setDate(date.getDate() + days)
expires = '; expires=' + date.toUTCString()
}
document.cookie = encodeURIComponent(name) + '=' + (encodeURIComponent(value || '')) + expires + '; path=/'
}
function getCookie(name) {
let nameEq = encodeURIComponent(name) + '='
let cookies = document.cookie.split(';')
let match = cookies.find(cookie => cookie.trimLeft().startsWith(nameEq))
return match ? decodeURIComponent(match.substring(nameEq.length)) : undefined
}
function removeCookie(name) {
setCookie(name, '', -1)
}
document.documentElement
document.body
document.head || document.querySelector('head')
elem.dataset.someDataAttr
elem.id
elem.classList.add('some-class')
elem.classList.remove('some-class')
elem.classList.contains('some-class')
elem.classList.toggle('some-class')
// Value of <input> or <textarea>
textArea.value
// Plain-text content
elem.textContent
// Hide element
elem.style.display = 'none'
// Delete element
elem.parentNode.removeChild(elem)
// or (slower)
elem.outerHTML = ''
// Append child
parent.appendChild(elem)
// Prepend child
parent.insertBefore(elem, parent.childNodes[0])
// Wrap element
let wrap = document.createElement('div')
elem.parentNode.replaceChild(wrap, elem)
wrap.appendChild(elem)
// Insert before
other.parentNode.insertBefore(elem, other)
// Insert after
other.parentNode.insertBefore(elem, other.nextSibling)
// Replace tag
var d = document.createElement('div')
d.innerHTML = elem.innerHTML
elem.parentNode.replaceChild(d, elem)
// For each
Array.from(document.querySelectorAll('selector')).forEach((element, index) => {
console.log(index, element)
})
// Format a number
const num = 1e6
num.toLocaleString() // Dependant on the user's OS
num.toLocaleString('en') // '1,000,000'
num.toLocaleString('de') // '1.000.000'
num.toLocaleString('fr') // '1 000 000'
num.toLocaleString('ar-EG') // '١٬٠٠٠٬٠٠٠'
// More options: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/toLocaleString#Syntax
// Format a date
const date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0))
date.toLocaleString() // Dependant on the user's default locale and time zone
date.toLocaleString('default', {timeZone: 'UTC'}) // Dependant on the browser's default locale
date.toLocaleString('en-US', {timeZone: 'UTC'}) // '12/20/2012, 3:00:00 AM'
date.toLocaleString('en-GB', {timeZone: 'UTC'}) // '20/12/2012, 03:00:00'
date.toLocaleString('ja-JP', {timeZone: 'UTC'}) // '2012/12/20 3:00:00'
date.toLocaleString('ko-KR', {timeZone: 'UTC'}) // '2012. 12. 20. 오전 3:00:00'
// More options: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleString#Syntax
date.toISOString() // '2012-12-20T03:00:00.000Z'
// Defining a regex pattern
let r = /\b1([a-z])\b/gi
// or
let r = new RegExp('\\b1([a-z])\\b', 'gi')
'1a 1b'.match(r) // ['1a 1b', 'a', 'b']
r.test('1m') // true
'...ok...'.replace(/\.+$/, '') // '...ok'
'...ok...'.replace(/^\.+/, '') // 'ok...'
'...ok...'.replace(/^\.+|\.+$/, '') // 'ok'
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.