为何HTML5 data属性会将null、undefined转为字符串？

Great question! This discrepancy boils down to how the dataset property (a DOMStringMap object) interacts with HTML element attributes, and how pure JavaScript values differ from DOM-bound values. Let’s break this down:

1. dataset is tied to HTML attributes (which are always strings) #

The dataset object is a convenient interface for accessing an element’s data-* attributes—but at its core, these attributes are part of the HTML DOM, and all HTML attribute values are stored as strings. When you assign a value to a dataset property, the browser automatically converts that value to a string to sync it with the corresponding data-* attribute on the element.

For example:

• When you run book.dataset.author = null, the browser converts null to the string "null" and updates the element’s data-author attribute to "null".
• When you run book.dataset.year = undefined, it gets converted to the string "undefined", so the data-year attribute becomes "undefined".

If you inspect the element after these assignments, you’ll see the updated attributes directly in the HTML:

<div id="book" data-id="47909" data-title="Under The Dome" data-author="null" data-year="undefined"> </div>

2. Pure JavaScript values vs. DOM-bound values #

In plain JavaScript, null and undefined have their own distinct types:

• let a = null; typeof a returns object because null is a special value representing an empty object reference.
• let b = undefined; typeof b returns undefined because it’s a primitive value indicating an uninitialized or missing value.

These values exist directly in the JavaScript engine’s memory without any conversion layer. But when you assign them to dataset, you’re passing them through the DOM’s attribute system, which enforces string-only storage.

3. Your hunch is correct! #

Yes, this difference is absolutely related to the fact that HTML element attributes are inherently string-based. The DOMStringMap acts as a bridge between JavaScript values and HTML attributes, and it always converts values to strings when writing, and reads them as strings when accessing.

内容的提问来源于stack exchange，提问作者user6361565