Creating service in React Typescript using axios-CodePudding

There are two different ways to create a service and call from the required funtional component.

export const userProfileService = {

    ResetPassword: async (userId: string) => {
        var response = await http.get<string, boolean>(`UserProfile/ResetPassword?userId=${userId}`);
        return response;
    }
}

class UserProfileService {

    readonly userProfilePath = 'UserProfile';

    resetPassword = async (userId: string) => {
        var response = await http.get<string, boolean> 
      (`${this.userProfilePath}/ResetPassword?userId=${userId}`);
        return response;
    }
    export default new UserProfileService();


**The question is which way is better and optimized way? or better convention?**

CodePudding user response：

Why not just make it a function?

export const resetPassword: async (userId: string) => {
         return await http.get<string, boolean>(`UserProfile/ResetPassword?userId=${userId}`);
    }

Putting the function in a class or an object seems to only complicate and obfuscate in this case. It looks very much like a C#-influenced style. Not terrible or wrong per se, but a bit verbose and complicated when all you need is a pure function.

Also, you should use let or const keyword instead of var because of differences in scope. You're not making any errors in the code above because var is function-scoped, but it's almost always better to use const (or let if you need to modify it).