Implement classnames()

Question

Implement the popular `classnames` utility that conditionally joins class names. It should handle strings, objects, arrays, and falsy values.

Accepted Answer

function classnames(...args) {
  const classes = []

for (const arg of args) {
    if (!arg) continue  // skip falsy values

if (typeof arg === 'string' || typeof arg === 'number') {
      classes.push(arg)
    } else if (Array.isArray(arg)) {
      const inner = classnames(...arg)
      if (inner) classes.push(inner)
    } else if (typeof arg === 'object') {
      for (const [key, value] of Object.entries(arg)) {
        if (value) classes.push(key)
      }
    }
  }

return classes.join(' ')
}

// Usage
classnames('foo', 'bar')               // "foo bar"
classnames('foo', { bar: true })       // "foo bar"
classnames({ foo: true, bar: false })  // "foo"
classnames('foo', ['bar', 'baz'])      // "foo bar baz"
classnames(null, undefined, 0, false)  // ""

Implement classnames()

Answer