Sign Up for Free

RunKit +

Try any Node.js package right in your browser

This is a playground to test code. It runs a full Node.js environment and already has all of npm’s 1,000,000+ packages pre-installed, including flatten-anything with all npm packages installed. Try it out:

var flattenAnything = require("flatten-anything")

This service is provided by RunKit and is not affiliated with npm, Inc or the package authors.

flatten-anything v2.0.3

Flatten objects and replace nested props with 'prop.subprop'. A simple and small integration

Flatten anything 🏏

npm i flatten-anything

Flatten objects and replace nested props with 'prop.subprop'. A simple and small integration.

I was looking for:

  • A simple solution to flatten objects & arrays
  • Only flatten plain objects and not special class instances!

This last one is crucial! So many libraries use custom classes that create objects with special prototypes, and such objects all break when trying to flatten them. So we gotta be careful!

flatten-anything will flatten objects and their nested properties, but only as long as they're "plain objects". As soon as a sub-prop is not a "plain object" and has a special prototype, it will stop flattening there and reference that instance "as is". ♻️

Very usable for creating a payload for Firebase Firestore update function, which only accepts flat objects! With Firestore for example Firebase.firestore.FieldValue.delete() does not break.

Can be used in combination with nestify-anything, which does the exact opposite of this one! 😉

Meet the family

Usage

  • If you pass an object, it will flatten all nested properties
  • If you pass an array, it will flatten all nested arrays

Flatten objects

import { flatten } from 'flatten-anything'

const target = { name: 'Ho-oh', types: { fire: true, flying: true } }

flatten(target)
// returns {
//   name: 'Ho-oh',
//   types.fire: true,
//   types.flying: true
// }

Please note that when you pass an object it will only flatten nested object props, and do nothing to arrays inside the object.

Flatten arrays

import { flatten } from 'flatten-anything'

const target = [1, 2, ['a', 'b', ['y', 'z']], 3]

flatten(target)
// returns [1, 2, 'a', 'b', 'y', 'z', 3]

Please note that when you pass an array it will only flatten direct arrays, and do nothing to objects inside the array.

Limit the depth to flatten

currently only works with objects. Please open an issue if you want it to work with arrays as well!

const target = {
  name: 'Lugia',
  appearence: {
    // let's only flatten 1 level until here:
    parts: { wings: true },
    colors: { white: true, blue: true },
  },
}
const untilDepth = 1

flatten(target, untilDepth)
// returns {
//   name: 'Lugia',
//   appearence.parts: { wings: true },
//   appearence.colors: { white: true, blue: true },
// }

Flatten only certain props

It's possible to only flatten eg. one prop.

import { flattenObjectProps } from 'flatten-anything'

const target = {
  appearence: { hair: 'orange' },
  traits: { strength: 9000 },
}
const propsToFlatten = ['traits']

flattenObjectProps(target, propsToFlatten)
// returns {
//   appearence: { hair: 'orange' },
//   traits.strength: 9000,
// }

You can also point to a nested object property to only flatten specific nested props, but keep the rest as an object!

const target = {
  traits: {
    strength: 9000,
    range: { min: 8000, max: 10000 },
  },
}

const propsToFlatten = ['traits.range']
// only flatten `traits.range` and nothing else.

flattenObjectProps(target, propsToFlatten)
// returns {
//   traits: { strength: 9000 },
//   'traits.range': {min: 8000, max: 10000},
// }

Treeshaking

Importing flatten allows you to use it for both objects and arrays.

If you use webpack, rollup, etc. you can import less code by specifying the exact flatten function you need:

import { flattenObject } from 'flatten-anything'
// or
import { flattenArray } from 'flatten-anything'

Example for Firestore

const pokemon = {
  name: 'Charizard',
  types: { dark: true, fire: true, flying: true },
}
// we want to delete the `dark` type from this Pokemon

const payload = flatten({
  types: { dark: Firebase.firestore.FieldValue.delete() },
})
Firebase.firestore()
  .doc('pokemon/charizard')
  .update(payload)
RunKit is a free, in-browser JavaScript dev environment for prototyping Node.js code, with every npm package installed. Sign up to share your code.
Sign Up for Free