如何在 javascript 数组上迭代新的 class 实例？

Question

I have an array which looks like this:

var array = ["name", " zip", " city", " 51.408", "1.333", " 5.008", "name2", "zip2", "city2", " 51.404", "4.999", "2.434"]

It contains data from 2 users. I want to create 2 instances of a class below.

class User {
    constructor(name, zip, city, x, y) {
        this.name = name;
        this.zip = zip;
        this.city = city;
        this.x = x;
        this.y = y;
    }

The 6th and the last element of the array is not used in the class.

This is an iteration I wrote:

for (var i = 0; i < array.length; i++) {

    var user1 = new User(arrayData[i], arrayData[i+1], arrayData[i+2], arrayData[i+3], arrayData[i+4], arrayData[i+5])
    var user2 = new User(arrayData[i+6], arrayData[i+7], arrayData[i+8], arrayData[i+9], arrayData[i+10], arrayData[i+11])

}

It works fine but as you can see this is not a really smart peace of code. I want to make it better. Also, I don't know how to make it works for n number of users. Do you have any ideas?

Answer 1

I think you are looking for

var users = [];
for (var i = 0; i < array.length; i += 6) {
//                                ^^^^^^
    var user = new User(arrayData[i], arrayData[i+1], arrayData[i+2], arrayData[i+3], arrayData[i+4], arrayData[i+5]);
    users.push(user);
}
console.log(users);

_{(Using i+5 < array.length for the loop condition would be more accurate, but doesn't matter as long as it's guaranteed the array length is always a multiple of 6)}

@trincot follows the same idea and achieves the same result with more concise code (mapping, slicing, spreading), I tried to keep it as simple as the original code.

Answer 2

Your loop should really only create one user in its body, and i should increment with steps of 6.

You can also use a parameter spread to avoid you have to address the five argument separately.

Finally, with Array.from you can loop and create an array of users:

 class User { constructor(name, zip, city, x, y) { this.name = name; this.zip = zip; this.city = city; this.x = x; this.y = y; } } var array = ["name", " zip", " city", " 51.408", "1.333", " 5.008", "name2", "zip2", "city2", " 51.404", "4.999", "2.434"]; let users = Array.from({length: array.length / 6}, (_, i) => new User(...array.slice(i*6, i*6+5)) // Not including the unused 6th value ); console.log(users);

Answer 3

You could use reduce method with % remainder operator to get every nth element and then use slice with rest operator to get data for the class instance.

 var array = ["name", " zip", " city", " 51.408", "1.333", " 5.008", "name2", "zip2", "city2", " 51.404", "4.999", "2.434"] class User { constructor(name, zip, city, x, y) { this.name = name; this.zip = zip; this.city = city; this.x = x; this.y = y; } } const users = array.reduce((r, e, i, a) => { if (i % 6 === 0) { const props = a.slice(i, i + 6); const user = new User(...props); r.push(user); } return r; }, []) console.log(users)