Abarbeitung einer Fetch - JavaSript

[mat-sche]

Liebes Forum,

schon etwas länger her aber immer noch das gleiche Thema. Mein obiger Post hat sich erledigt, über Web-Button kann ich nun auf meinem ESP Schalthandlungen ausführen.
jezt würde ich gern den Code im Script sowie auch auf der Arduino C++ Seite etwas ändern/verjüngen....verbessern ?! Der bisherige Code funktioniert ja... aber ich denke er kann besser umgesetzt werden.
Etwas zum Hintergrund:
Ich benötige immer ein Byte, in dem ich jedes Bit daraus auf 0 und 1 setze, je nachdem welcher Button auf der Webseite gedrückt wurde. So kann ich 8 Button pro Byte adressieren. Dieses Byte wird dann 1 zu 1 an ein I2C- IC (MCP23017 - Portexpander) weitergegeben, wo zum Schluss Relais geschalten werden.

Ich schicke per Fetch ein Json String, den ich in C++ folgend zusammen setze:

Code:

server.send(200, "application/json", "[\"" +  String(bitRead(buttonstate_index[0], 0)) +                                                                       // Sende Statuszustand
      "\",\"" +  String(bitRead(buttonstate_index[0], 1)) + "\",\"" +  String(bitRead(buttonstate_index[0], 2)) +
     "\",\"" +  String(bitRead(buttonstate_index[0], 3)) + "\",\"" +  String(bitRead(buttonstate_index[0], 4)) +
     "\",\"" +  String(bitRead(buttonstate_index[0], 5)) + "\",\"" +  String(bitRead(buttonstate_index[0], 6)) +
     "\",\"" +  String(bitRead(buttonstate_index[0], 7)) + "\",\"" +  String(bitRead(buttonstate_index[1], 0)) +
     "\",\"" +  String(bitRead(buttonstate_index[1], 1)) + "\",\"" +  String(bitRead(buttonstate_index[1], 2)) +
     "\",\"" +  String(bitRead(buttonstate_index[1], 3)) + "\",\"" +  String(bitRead(buttonstate_index[1], 4)) +
     "\",\"" +  String(bitRead(buttonstate_index[1], 5)) + "\",\"" +  String(bitRead(buttonstate_index[1], 6)) +
     "\",\"" +  String(bitRead(buttonstate_index[1], 7)) + "\", \"" + Tor + "\", \"" + server.client().remoteIP().toString() + "\"]");

Hier würde ich den Code gern kleiner gestallten, in dem ich nicht jedes Bit einzeln schicke. Ich würde gern nur z.bsp. das Byte als 0hff verschicke, ok ich weiß wie es geht.
Meine Frage ist nur, wie kann ich über eine Javascript dieses Byte wieder in 8 Bit umwandeln und dann den Button in der Webseite zuordnen?
Aktuell ordne ich die Bits den Button so ein:

Code:

function loadDaten() {

            fetch('/ButtonData')
                .then(function(response) {
                    return response.json();
                })
                .then(function(myArr) {
                    buttonstate(0, myArr[0]);           // LI_CarSpotDoor
                    buttonstate(1, myArr[1]);           // LI_CarSpot
                    buttonstate(2, myArr[2]);           // LI_CarPort
                    buttonstate(3, myArr[3]);           // LI_Tools
                    buttonstate(4, myArr[4]);           // Tor_Reed_100
                    buttonstate(5, myArr[5]);           // Tor_Reed_50         
                    buttonstate(6, myArr[6]);           // Tor_Reed_0
                    buttonstate(7, myArr[7]);                   
                    buttonstate(8, myArr[8]);
                    buttonstate(9, myArr[9]);
                    buttonstate(10, myArr[10]);     
                    buttonstate(11, myArr[11]);
                    buttonstate(12, myArr[12]);
                    buttonstate(13, myArr[13]);
                    buttonstate(14, myArr[14]);
                    buttonstate(15, myArr[15]);
                    document.getElementById("Text-1").innerHTML = myArr[16];
                    document.getElementById("Text-2").innerHTML = myArr[17];
                });
        }

und in HTML werden so die Button kreiert:

Code:

  <div class="grid-container_4">
            <!--Tor halb öffnen-->
            <div class="grid-item"><input type="button" style="height: 30px; width: 150px;font: bold 16px Arial;color: black;" id="5" onclick="btnPressed(id)" ></div>
            <!--Tor öffnen-->
            <div class="grid-item"><input type="button" style="height: 30px; width: 150px;font: bold 16px Arial;color: black;" id="4" onclick="btnPressed(id)" ></div>
            <!--Tor schließen-->
            <div class="grid-item"><input type="button" style="height: 30px; width: 150px;font: bold 16px Arial;color: black;" id="6" onclick="btnPressed(id)" ></div>
        </div>

Meine Idee wäre nun in einem Script per fetch die Daten einzulesen

Code:

function loadDaten() {

            fetch('/ButtonData')
                .then(function(response) {
                    return response.json();
                })
                .then(function(myArr) {

den String in ein Byte wandeln und dann über eine for next Schleife die einzelnen Bits in die Variable zu legen.

Aber wie ist hier die gute Frage, da ich mich sehr begrenst mit Javascribt nicht auskennen...
Wer könnte mir denn da weiterhelfen?

Vielen Dank für  Eure Hilfe!