title: How can I convert dataset property names to data attribute names?
body: <p>I have an object with some keys and values, intended to be assigned to the <code>dataset</code> property of an HTML element. I would like to get the names of the <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/data-*" rel="nofollow noreferrer">data attributes</a> that would be produced from those keys, as described where it says "camelCase to dash-style" in the "Name Conversion" section of the <a href="https://developer.mozilla.org/en-US/docs/Web/API/HTMLOrForeignElement/dataset" rel="nofollow noreferrer">MDN dataset documentation</a>.</p>
  
  <p><strong>How can I convert from dataset property names to data attribute names?</strong> I came up with something that works, which I put in an answer, but I'm wondering if there is a simpler or more elegant way, maybe involving a built-in function that I somehow overlooked.</p>
  
  <p>I am looking for either a function that converts an individual name, or a function that converts an object with key-value pairs.</p>