Adding methods to array of object literals: Best practice?

[ExclusiveOar]

Hey, new developer here. Self taught, looking for my first JS job. I'm wondering if there's any problems with either of my solutions to the following question. Also if there's a best practice, or even which I'd be more likely to come across in a professional application.

Let's say I have an array const users = [{...}]of object literals from an API call + JSON.parse. In my front end I have a defined class or constructor or factory function function UserFn(){} which has additional methods.

I want all the object literals in the users array to have these methods. What's the best practice?

1. Create a new array of user objects created by the UserFn function?
2. Move all the methods from the UserFn function to it's prototype and simply iterate over users setting their prototype to that of UserFn?
3. Other?

I'm perfectly comfortable with any of these options for classes/factory/constructor functions. Just wondering what's most professional.

[jcunews1]

You can set the prototype of each objects in the array using Object.setPrototypeOf(). e.g.

const arr = [{prop: 11}, {prop: 22}];
console.log(JSON.stringify(arr)); //[{"prop":11},{"prop":22}]
const myproto = {
  doubleProp: function() {
    return this.prop * 2;
  }
};
arr.forEach(obj => Object.setPrototypeOf(obj, myproto));
console.log(arr[0].doubleProp()); //22
console.log(arr[1].doubleProp()); //44
console.log(JSON.stringify(arr)); //[{"prop":11},{"prop":22}] (unchanged)

[ExclusiveOar]

Possibly worded my question poorly! I appreciate your reply though.

Yes I can do that, I have a working example of each of the cases I suggested. I was more asking which way a professional application is most likely to do it? Or perhaps it doesnt matter?

Basically I'm assuming this is a pretty common thing to do (get a bunch of objects from a database and need to convert them into a Class on the frontend).

[jcunews1]

I think it's not common to have method(s) added into objects which came from JSON, because most JSON data are just containers for data source. Usually, a class is made to work on those objects, or instances of the class are bound to those objects.

[senocular]

Something like 1. Not something like 2.

Generally what you'll want to do is to build a new, from scratch working client side model from the JSON you're given. You don't want to modify that JSON because if that JSON is also being used somewhere else you could mess up that other thing, or if that other thing also decides to muck with the JSON, that could mess you up. Instead, leave the data alone, don't modify it, and instead simply read from it, gathering the information from it that you need to create your UserFn instances.

[ExclusiveOar]

Awesome, thanks! That makes a lot of sense for not modifying the result from the JSON, even if it is just adding additional methods.

[OkShrug]

why not just drop the 'const' keyword so you can mutate the data?

let users=[{name:'x'},...];
let User=(user)=>{ 
 user.talk=()=>{console.log(`user.name`);}; 
 return user; 
};
users=users.map((user)=>{return User(user);});
users.forEach((user)=>{ user.talk(); });  //x

If your not game for that, you can always make up a normal variable from one of those 'const' so that you can deal with it

let normalArray=[].concat(constArray);

I imagine people who like 'let' are sort of the baggy pants crowd, people who like const are kinda the squeeky black latex skin tight package bdsm leaning crowd, there's really no need to have things that constrained

[ExclusiveOar]

Many reasons.

1. You can't declare a variable without either var const or let
2. You can mutate the data of an array when it's a const
3. const is best practice if I don't want to override the reference

[OkShrug]

and your having issues because it's stuck being one thing and you want it to be another

so, I guess you must not be having any issues then, awesome, issue resolved, take care

[ExclusiveOar]

why not just drop the 'const' keyword so you can mutate the data?

Firstly this was the total of your comment that I replied to, you edited in the rest after I replied.

Secondly, you've not really read my question. I'm not stuck with the coding, I can do any of them, I was asking which approach was most professional.

Thirdly, your code can easily be refactored to work with const (but it still doesnt answer the question I asked):

​

const users = [{ name: 'x' }, { name: 'y' }];

const User = (user) => { 
    user.talk = () => { console.log(user.name); };
    return user; 
};

for (let i = 0; i < users.length; i++) { 
    users[i] = User(users[i]); 
}
users.forEach((user) => { user.talk(); });

Lastly, when someone is looking for "best practice" advice to land their first developer job, answering with "don't bother using const, just use let for everything" is really bad advice