Skip to content

Functional Pattern Transformeren

ralfz123 edited this page Jan 27, 2021 · 8 revisions

Inhoud


Transformeren van de data

Data nesten is trasnofmrnern, Dat heeft laruens gezegd in een PB naar mij. Nesten = transformeren.

// Combine with data key 'waaromTijdreizenNaarJaar' and nest in new self-created data key `tijdreis` and corrects the values
// Only nesting works, replacing from / to - does not work yet.
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;
    }

    if (element.tijdreisJaar === '/') {
      console.log('bevat een /');
      element.tijdreisJaar === '-';
      //   element.tijdreisJaar.replaceAll('/', 'xxx');
    }

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

  return dataObject;
}

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