JavaScript - Name object properties based on a certain logic

Question

Apologize for the lack of information in the title, I couldn't come up a better one to describe my problem.

I'm currently building a simple script that scrapes data from another website and eventually, after customizing the fetched data, output the results as JSON.

There's nothing "wrong" or "broken" with the code nor do I get any errors, just need to improve my script a bit.

Underneath is the script I wrote with Express to fetch the players for other website:

router.get('/teams/:id/roster', function(req, res) {

var id = req.params.id;

var url = 'http://www.testdata.dev/api/teams/' + id;

request(url, function (error, response, html) {
    if (!error && response.statusCode == 200) {
        var $ = cheerio.load(html); // load the DOM with Cheerio

        $('#roster').filter(function () {
            var player, line, lines = [], forward = {}, defense = {};
            line = {
                "forwards": forward
            };

            // Iterate over all the forwards
            $("#forwards > tbody > tr > td").each(function(index) {

                var that = $(this);
                player = that.text().trim(); // F.e "Lebron James", "Michael Jordan"

                // Create a new line after every three players (in total of 12 forwards, in total of 4 lines)
                if(index % 3 == 0) {

                    lines.push({
                        "line": {
                            "forwards": [player]
                        }
                    });
                } else {
                    lines[lines.length - 1]["line"]["forwards"].push(player);
                }
            });

            // Output results as JSON
            res.contentType('application/json');
            res.json(lines);
        });
    } else {

        console.log("Request was not made");

    }
});

});

Current JSON output:

[
  {
    "line": {
      "forwards": [
        "Player 1",
        "Player 2",
        "Player 3"
      ]
    }
  },
  {
    "line": {
      "forwards": [
        "Player 4",
        "Player 5",
        "Player 6"
      ]
    }
  },
 // ...
 // In total of 4 lines
]

So the code does it's job and I'm able to output the JSON as described above. However, I'd like to give each player a property based on the following rule set: The first player outputted in each "line" object will always be a LW (Left Winger), second player will always be a C (Centerman) and third RW (Right Winger).

Unfortunately, I was unable to implement this by myself and that's where I need your help. Thanks in advance!

Expected JSON output:

{
    "lines": [{
        "line": {
            "forwards": {
                "LW": "Player 1",
                "C": "Player 2",
                "RW": "Player 3"
            }
        }
    }, {
        "line": {
            "forwards": {
                "LW": "Player 1",
                "C": "Player 2",
                "RW": "Player 3"
            }
        }
    }]
}

Answer 1

This proposal assumes, that forwards is an object, not an array, because of the properties.

You could introduce an array with the sides

sides = ['LW', 'C', 'RW'];

and change the code a bit to

if (index % 3 == 0) {
    lines.push({ line: { forwards: {} } });
} 
lines[lines.length - 1].line.forwards[sides[index % 3]] = player;

Answer 2

You could do something like this:

var input = [
    {
        "line": {
            "forwards": [
                "Player 1",
                "Player 2",
                "Player 3"
            ]
        }
    },
    {
        "line": {
            "forwards": [
                "Player 4",
                "Player 5",
                "Player 6"
            ]
        }
    },
    // ...
    // In total of 4 lines
];

var output = input.map(function (element) {
    var _forwards = {};
    element.line.forwards.forEach(function (name, key) {
        var keymap = ['LW','C','RW'];
        _forwards[keymap[key]]=name;
    });
    element.line.forwards = _forwards;
    return element;
});

Answer 3

You can do this (as of ES2015, aka ES6), but note that the order of properties in JSON text is not significant; a JSON parser is not required to handle the properties in any particular order. {"a":1,"b":2} and {"b":2,"a":1} are identical from a JSON perspective. So you can produce the JSON with the properties in the order you've described, but that doesn't mean it'll be consumed in that order.

So for most use cases, it's not worth doing.

For the use cases where it is worth doing (for instance, producing JSON texts that can be textually compared, such as in a source control system), you can do it as of ES2015 because in ES2015, the concept of object properties having an order was introduced. The details for the "own" properties of an object are covered by the abstract OrdinaryOwnPropertyKeys operation, which says that properties that look like array indexes come first in numeric order, followed by any other property names that are strings in property creation order, followed by property names that are Symbols in property creation order.

That means if we create the LW, C, and RW properties on an object in that order, then operations that respect property order will handle them in that order.

So then the question is: Does JSON.stringify respect property order? Not all operations do. (Notably: for-in and Object.keys are not required to.)

The answer, though, is yes, it does. For plain objects, JSON.stringify uses the abstract SerializeJSONObject operation, which uses the abstract EnumerableOwnNames operation, which uses [[OwnPropertyKeys]], which for plain objects uses the OrdinaryOwnPropertyKeys operation I mentioned above.

So that means on an ES2015 compliant implementation, JSON.stringify({a:1,b:2}) must be '{"a":1,"b":2}' and JSON.stringify({b:2,a:1}) must be '{"b":2,"a":1}' (because object initializers create their properties in source code order).

So the upshot is: If you create the forwards object for each line:

forwards = {};

...and add the LW, C, and RW properties to it in the same order you're currently adding them to an array, a compliant implementation using JSON.stringify will output JSON with them in that order.

How you add them in that order is a matter of implementation. A really minimal, simple-minded, unoptimized way would be to replace

lines[lines.length - 1]["line"]["forwards"].push(player);

with

var f = lines[lines.length - 1]["line"]["forwards"];
if (!f.LW) {
    f.LW = player;
} else if (!f.C) {
    f.C = player;
} else {
    f.RW = player;
}

...but you can probably come p with something more elegant. (Ah, looks like Nina already did.)

But then what happens when the JSON is consumed?

If the other end is a JavaScript endpoint, and is also ES2015 compliant, it's worth noting that JSON.parse creates the properties on the objects in textual order, so the order would be maintained. But again, JSON does not dictate that, and so anything else processing the JSON can do what it pleases.