Konvertieren von data-*-Attributen in ein Objekt

Ich spiele mit dem herum attr-daten-* Attribute von HTML5 und dem entsprechenden Javascript Datensatz

Ich mache viel dynamische Formularverarbeitung, also bekomme ich am Ende Sachen wie diese:

<input data-feaux="bar" data-fizz="buzz"/>

Seit HTMLElement.dataset gibt a zurück DOM string mapder einzige Weg, wie ich herausfinden kann, wie ich es in ein natives Objekt umwandeln kann, ist:

var obj = JSON.parse(JSON.stringify(input_el.dataset))

Gibt es einen besseren Weg, dies zu tun?

Bearbeiten:

Warum sollte ich das tun wollen? Nehmen wir an, ich habe viele, viele dieser Elemente. Ich möchte sie alle durchlaufen und sie zur späteren Verarbeitung in ein Array schieben, dh

elements = document.querySelectorAll("input")
my_data_array = []
for(var i = 0; i < elements.length; i++) {
    my_data_array.push(elements[i].dataset)
}

Jetzt habe ich ein Array von Objekten, dh [{feaux: "bar", fizz:"buzz"}....] mit dem ich arbeiten kann.

Wenn ich die jedoch nicht umwandle DOM string map in ein Objekt, das Array wird nicht gefüllt (dh der obige Code funktioniert nicht)

Bearbeiten 2

Bei näherer Betrachtung handelt es sich tatsächlich um eine DOM string mapnicht ein object. Korrektur von Tippfehlern in der ursprünglichen Frage, um dies widerzuspiegeln.

Sie können verwenden Objektzuweisung

Object.assign({}, element.dataset) 

Für Browser, die Object.assign nicht unterstützen, können Sie verwenden Polyfill

in es6 können Sie die Objektverteilung verwenden.
{ ...element.dataset }

Vergessen Sie nicht JSON.stringify und JSON.parse.

var data = document.getElementById('someElement').dataset;
data = JSON.parse(JSON.stringify(data));

Entsprechend Mozilla Dies sollte ohne Polyfill bis zurück zu IE 8 funktionieren.

Hier ist eine kleine Funktion, um den Elementdatensatz als normales Objekt abzurufen:

function datasetToObject(elem){
    var data = {};
    [].forEach.call(elem.attributes, function(attr) {
        if (/^data-/.test(attr.name)) {
            var camelCaseName = attr.name.substr(5).replace(/-(.)/g, function ($0, $1) {
                return $1.toUpperCase();
            });
            data[camelCaseName] = attr.value;
        }
    });
    return data;
}

Geschöpft von: Holen Sie sich eine Liste von Daten-*-Attributen mit Javascript / jQuery