Parse and modify an array in Javascript

January 16, 2022

I am working in Javascript with a .dat file with different data about English Soccer teams. I was able to obtain a Json that I transform in this array:

[{"team":"Arsenal","f":"79","a":"36"},
{"team":"Liverpool","f":"67","a":"30"},
{"team":"Manchester_U","f":"87","a":"45"},
{"team":"Newcastle","f":"74","a":"52"},
{"team":"Leeds","f":"53","a":"37"},
{"team":"Chelsea","f":"66","a":"38"},
{"team":"West_Ham","f":"48","a":"57"},
{"team":"Aston_Villa","f":"46","a":"47"},
{"team":"Tottenham","f":"49","a":"53"},
{"team":"Blackburn","f":"55","a":"51"},
{"team":"Southampton","f":"46","a":"54"},
{"team":"Middlesbrough","f":"35","a":"47"},
{"team":"Fulham","f":"36","a":"44"},
{"team":"Charlton","f":"38","a":"49"},
{"team":"Everton","f":"45","a":"57"},
{"team":"Bolton","f":"44","a":"62"},
{"team":"Sunderland","f":"29","a":"51"},
{"team":"Ipswich","f":"41","a":"64"},
{"team":"Derby","f":"33","a":"63"},
{"team":"Leicester","f":"30","a":"64"}]

This array contain the name of different soccer teams and two values: the number of the goal scored (F) and the number of goal conceded (A) by every team. I have to parse this Array to make the following operations:

Add to the array (for very team) the value the difference between "a" and "f";
Return the name of the team with the least difference between goals scored and conceded.

But I don’t know how.

I arrived only to this point:

const myFrom = document.getElementById("myForm");
const datFile = document.getElementById("datFile");

function fileToArray(text) {
  const lines = text.split(/\n/); // split on \n
  const header = lines[0].trim().split(/\s+/); // split on whitespace after trimming
  return [...lines.slice(1).map(line => {
    // ignore the number and the dash
    const [number, team, p, w, l, d, f, ignore2, a, pts] = line.trim().split(/\s+/);
    let values={team, f, a};
    return values;
  })]
  
}

myForm.addEventListener("submit", function (e) {
    e.preventDefault();
    console.log("Form submitted");
   const input = datFile.files[0];
   const reader = new FileReader();
   reader.onload = function (e){
     const text= e.target.result;
     const data = fileToArray(text);
     const arr1 = data.slice(0,17);
     const arr2 = data.slice(18,21);
    let myArray = arr1.concat(arr2);
    let myJSON = JSON.stringify(myArray);
    let obj=JSON.parse(myJSON);
   }
   
   reader.readAsText(input);
  });

 <form id="myForm">
        <input type="file" id="datFile" accept=".dat" />
        <br />
        <input type="submit" value="Submit" />
      </form>

At this point I am stopped.

>Solution :

Thought these two operation can be done together for clean writing you can do the following.

map to add the difference between the two property in a new property called d

using Math.abs to keep the difference positive.

let teams = [{"team":"Arsenal","f":"79","a":"36"},
{"team":"Liverpool","f":"67","a":"30"},
{"team":"Manchester_U","f":"87","a":"45"},
{"team":"Newcastle","f":"74","a":"52"},
{"team":"Leeds","f":"53","a":"37"},
{"team":"Chelsea","f":"66","a":"38"},
{"team":"West_Ham","f":"48","a":"57"},
{"team":"Aston_Villa","f":"46","a":"47"},
{"team":"Tottenham","f":"49","a":"53"},
{"team":"Blackburn","f":"55","a":"51"},
{"team":"Southampton","f":"46","a":"54"},
{"team":"Middlesbrough","f":"35","a":"47"},
{"team":"Fulham","f":"36","a":"44"},
{"team":"Charlton","f":"38","a":"49"},
{"team":"Everton","f":"45","a":"57"},
{"team":"Bolton","f":"44","a":"62"},
{"team":"Sunderland","f":"29","a":"51"},
{"team":"Ipswich","f":"41","a":"64"},
{"team":"Derby","f":"33","a":"63"},
{"team":"Leicester","f":"30","a":"64"}];

teams.map((t) => t['d'] = Math.abs(t.f - t.a))

console.log(teams);

To reduce to the team that has the lowest difference you can use the below code with reduce

    let teams = [{"team":"Arsenal","f":"79","a":"36"},
    {"team":"Liverpool","f":"67","a":"30"},
    {"team":"Manchester_U","f":"87","a":"45"},
    {"team":"Newcastle","f":"74","a":"52"},
    {"team":"Leeds","f":"53","a":"37"},
    {"team":"Chelsea","f":"66","a":"38"},
    {"team":"West_Ham","f":"48","a":"57"},
    {"team":"Aston_Villa","f":"46","a":"47"},
    {"team":"Tottenham","f":"49","a":"53"},
    {"team":"Blackburn","f":"55","a":"51"},
    {"team":"Southampton","f":"46","a":"54"},
    {"team":"Middlesbrough","f":"35","a":"47"},
    {"team":"Fulham","f":"36","a":"44"},
    {"team":"Charlton","f":"38","a":"49"},
    {"team":"Everton","f":"45","a":"57"},
    {"team":"Bolton","f":"44","a":"62"},
    {"team":"Sunderland","f":"29","a":"51"},
    {"team":"Ipswich","f":"41","a":"64"},
    {"team":"Derby","f":"33","a":"63"},
    {"team":"Leicester","f":"30","a":"64"}];
    teams.map((t) => t['d'] = Math.abs(t.f - t.a))
    
    // now finding the team with the lowsest
    
    let result = teams.reduce((teamA,teamB) => teamA.d > teamB.d? teamB: teamA );

    console.log(result);