Functional Pattern Transformeren

Inhoud

• Cleaning/Fitering van data

• 👉 Transformeren van data 👈

• Verzamelen van data

---

Transformeren van de data

Het transformeren van data is nodig wanneer je data aangeleverd krijgt en je hebt het nodig, maar dan net in een andere vorm. Dat gaan we doen tijdens het transformeren van data 😄 ! Het meest voorkomende geval is dat een datastructuur wordt aangepast, door nesten bijvoorbeeld.

Data keys nesten

In het voorbeeld hieronder heb ik een stukje logica geschreven die het volgende probleem oplost: ik heb de data keys tijdreisJaar en waaromTijdreizenNaarJaar , maar ik wil deze losse data keys graag bij elkaar hebben, genest in een andere (nieuwe) data key genaamd tijdreis. Tevens wil ik wel graag lege waardes houden.

Hoe heb ik dat gedaan? Ik heb een map()-functie geschreven die ervoor zorgt dat de lege waardes vervangen worden door null. In de return staat hoe elk dataobject eruit zou moeten zien. Daar nest ik de 2 data keys in een zelfgemaakte data key genaamd tijdreis.

Code

let nestedData = nestDataKeys(myData);
console.log('Nested data:', nestedData);

function nestDataKeys(data) {
  const dataObject = data.map((element) => {
    if (
      element.tijdreisJaar === '' ||
      element.waaromTijdreizenNaarJaar === ''
    ) {
      element.tijdreisJaar = null;
      element.waaromTijdreizenNaarJaar = null;
    }

    return {
      tijdreis: {
        tijdreisJaar: element.tijdreisJaar,
        waaromTijdreizenNaarJaar: element.waaromTijdreizenNaarJaar,
      },
    };
  });

  return dataObject;
}

Output

Code tweak n.a.v. feedbackmoment

Na een gesprek op 23/10/2020 te hebben gehad met Laurens, ben ik erachter gekomen dat het handiger is om niet de incorrecte antwoorden eruit te filteren, maar juist te transformeren naar null. De betekenis van null is dat dit element moedwillig is weggelaten. De reden dat ik het dus transformeer naar null en dus deze waarde behoud, is omdat ik dan de data-rows behoud. Dat is alleen maar fijn, anders filter ik gelijk de hele data-row weg en dat is zonde, want dan gaat data van een specifieke data-row verloren.

Ik heb dit opgelost met de ternary operator en dat bevalt mij erg goed, omdat het lekker overzichtelijk en fijn werken is. Je kan in een oogopslag zien wat de functie doet. Hieronder zie je de code ervan.

Oude Code

let checkedNames = allNames.map(function (name) {
  return name == '-' ? null :
	 name == '/' ? null :
	 name == '' ? null :
	 name == 'geen' ? null :
	 name == 'nvt' ? null :
	 name.indexOf(' ') > 0 ? null :
	 name;
});
console.log('Gecorrigeerde namenlijst', checkedNames); // List of ALL names, with 'null' mentioning

Tijdens het bouwen en experimenteren met code heb ik een aantal momenten dat ik kritisch naar mijn code ga kijken. Ook bij dit code block hierboven heb ik dat gedaan. Ik merkte op dat ik steeds null vermelde in de ternary operators in de return. Logisch natuurlijk, in een ternary operator, maar niet echt netjes voor in een return. Slordig is een beter woord 😄.

Daarom heb ik een if-statement hiervan gemaakt (zie code hieronder); ik heb alle waardes die ik als null wil hebben in de if-statement gezet, en als de condition true is aan het if-statement, dan returnt hij null. In alle andere gevallen returnt hij gewoon de waarde zoals die staat in de dataset. Bovendien heb ik ook de 'regular' function getransformeerd naar een arrow function, omdat dat een modernere techniek is (ES5 --> ES6) en het staat veel netter.

Nieuwe Code

let checkedNames = allNames.map((name) => {
  if (
    name == '-' ||
    name == '/' ||
    name == '' ||
    name == 'geen' ||
    name == 'nvt' ||
    name.indexOf(' ') > 0
  ) {
    return null;
  }
  return name;
});
console.log('Gecorrigeerde namenlijst', checkedNames); // List of ALL names, with 'null' mentioning