JSFiddle - React, Tailwind, and code Playground

by MegaScience

JavaScript

const stats = [
  ['MaxHP', '10'],
  ['MaxMP', '5'],
  ['LUK', '2'],
  ['DEX', '2'],
  ['STR', '2'],
  ['INT', '2'],
  ['All Stats', '2'],
  ['DEF', '10'],
  ['Weapon ATT', '2'],
  ['Magic ATT', '2'],
  ['Speed', '2'],
  ['Jump', '2'],
  ['MaxHP', '2%'],
  ['All Stats', '1%'],
  ['DEF', '2%'],
  ['Weapon Attack', '3%'],
  ['Magic ATT', '3%'],
  ['Damage', '3%'],
  ['Critical Rate', '3%'],
  ['Ignore Enemy DEF', '15%']
]

const lengths = stats.reduce(([m1, m2], [s1, s2]) => [Math.max(m1, s1.length), Math.max(m2, s2.length)], [0, 0])
//const statsNEW = stats.map(([s1, s2]) => [s1.padEnd(lengths[0]), s2.padStart(lengths[1])])
const statsNEW = stats.map(([s1, s2]) => `${s1.padEnd(lengths[0])} 0/${s2.padStart(lengths[1] - 1)}`).join('\n')
console.log(statsNEW)