Math with Infinity
Infinity is just a number, dude. Most calculations JavaScript lets us do with Infinity will still return Infinity. Some no longer return numbers.
Read full articleGetting properties from objects that match a condition
JavaScriptAll snippets in this category →
Posted on July 11, 2020Need to get an attribute of all objects in an array that match a condition? Chain Array.prototype.filter() and Array.prototype.map() to first filter the list to all the elements you want and then get the values you’re looking for.
// this array contains objects that have a `name` and `type`
const food = [
{
name: "Apple",
type: "fruit"
}, {
name: "Banana",
type: "fruit"
}, {
name: "Cucumber",
type: "vegetable"
}
]
// we can first get all objects that have their `type` set to "fruit"
const fruit = food.filter(element => element.type === "fruit")
// ⇒ [
// {
// name: "Apple",
// type: "fruit"
// }, {
// name: "Banana",
// type: "fruit"
// }
// ]
// we can then use `.map()` to extract their names
const fruitNames = fruit.map(element => element.name)
// ⇒ ["Apple", "Banana"]
// we can do both steps at once by chaining `.filter()` and `.map()`
const fruitNames = food
.filter(element => element.type === "fruit") // get all fruit
.map(element => element.name) // extract their names
// ⇒ ["Apple", "Banana"]// this array contains objects that have a `name` and `type`
const food = [
{
name: "Apple",
type: "fruit"
}, {
name: "Banana",
type: "fruit"
}, {
name: "Cucumber",
type: "vegetable"
}
]
// we can first get all objects that have their `type` set to "fruit"
const fruit = food.filter(element => element.type === "fruit")
// ⇒ [
// {
// name: "Apple",
// type: "fruit"
// }, {
// name: "Banana",
// type: "fruit"
// }
// ]
// we can then use `.map()` to extract their names
const fruitNames = fruit.map(element => element.name)
// ⇒ ["Apple", "Banana"]
// we can do both steps at once by chaining `.filter()` and `.map()`
const fruitNames = food
.filter(element => element.type === "fruit") // get all fruit
.map(element => element.name) // extract their names
// ⇒ ["Apple", "Banana"]// this array contains objects that have a `name` and `type`
const food = [
{
name: "Apple",
type: "fruit"
}, {
name: "Banana",
type: "fruit"
}, {
name: "Cucumber",
type: "vegetable"
}
]
// we can first get all objects that have their `type` set to "fruit"
const fruit = food.filter(element => element.type === "fruit")
// ⇒ [
// {
// name: "Apple",
// type: "fruit"
// }, {
// name: "Banana",
// type: "fruit"
// }
// ]
// we can then use `.map()` to extract their names
const fruitNames = fruit.map(element => element.name)
// ⇒ ["Apple", "Banana"]
// we can do both steps at once by chaining `.filter()` and `.map()`
const fruitNames = food
.filter(element => element.type === "fruit") // get all fruit
.map(element => element.name) // extract their names
// ⇒ ["Apple", "Banana"]// this array contains objects that have a `name` and `type`
const food = [
{
name: "Apple",
type: "fruit"
}, {
name: "Banana",
type: "fruit"
}, {
name: "Cucumber",
type: "vegetable"
}
]
// we can first get all objects that have their `type` set to "fruit"
const fruit = food.filter(element => element.type === "fruit")
// ⇒ [
// {
// name: "Apple",
// type: "fruit"
// }, {
// name: "Banana",
// type: "fruit"
// }
// ]
// we can then use `.map()` to extract their names
const fruitNames = fruit.map(element => element.name)
// ⇒ ["Apple", "Banana"]
// we can do both steps at once by chaining `.filter()` and `.map()`
const fruitNames = food
.filter(element => element.type === "fruit") // get all fruit
.map(element => element.name) // extract their names
// ⇒ ["Apple", "Banana"]Continue reading
Error handling with try-catch
By wrapping code that can fail in try-catch, we can react to and recover from any errors that happen.
Read full articleUsing Boolean prefixes for variable names
When naming variables that hold Boolean values, using a prefix that indicates as much helps with readability.
Read full articleDestructuring values returned by functions
By destructuring the return value of a function, we can take out only the values we need without having to assign the result to an object first.
Read full articleFlattening nested arrays
We can un-nest arrays with a native function now. We can also define how many levels of nesting we want to take out, to a maximum of “all levels”.
Read full articleGrouping array elements by a property
To quickly access all objects that share the same value for a property, we can group them by that property first.
Read full article