Implement the usage of plainToClass within the constructor function

I have a dilemma with my constructor that assigns properties to the instance:

class BaseModel {
    constructor (args = {}) {
        for (let key in args) {
            this[key] = args[key]
        }
    }
}

class User extends BaseModel {
    name: string
}

For creating instances, I've been using the following method:

let user = new User({name: 'Jon'})

However, now I'm interested in implementing class-transformer and replacing the basics with it:

let user = plainToClass(User, {name: 'Jon'})

Since my codebase heavily relies on the initial approach, I want to integrate the new method seamlessly without disrupting existing code:

 constructor (args = {}) {
        let instance = plainToClass(CLASSTYPE, args)
        for (let key in Object.keys(instance)) {
            this[key] = instance [key]
        }
    }

The challenge is identifying the class type within the constructor. Using "User" isn't feasible since there are other classes extending from the base model.

Answer №1

One possibility is using new.target. Check out the documentation for more information.
To access the constructor, you can use new.target.prototype.constructor, and the property name will give you the class name.

class BaseModel {
    typeName: string;

    constructor (args = {}) {
        this.typeName = new.taget.constructor.name;
    }
}

class User extends BaseModel {
}

const user = new User();
const typeName = user.typeName; // This will return 'User'

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Addressing the issue of prolonged Electron initialization

Scenario After spending considerable time experimenting with Electron, I have noticed a consistent delay of over 2.5 seconds when rendering a simple html file on the screen. The timeline of events unfolds like this: 60 ms: app ready event is triggered; a ...

Is there a way to establish a "transient" category within a category to maintain code efficiency?

I'm struggling to figure out how to search for this specific question on Stack Overflow. The structure of my generic type FetchOptions looks like this: type FetchOptions<T> = { explode?: string & keyof T | (string & keyof T)[]; } I&a ...

Changing HTML elements dynamically within an ng-repeat using AngularJS directives

I have devised an angular directive where I execute an ng-repeat. The fundamental purpose of this directive is to interchange itself with a distinct directive that depends on a value forwarded into the original directive: <content-type-directive type=" ...

react-i18next: issues with translating strings

I encountered a frustrating issue with the react-i18next library. Despite my efforts, I was unable to successfully translate the strings in my application. The relevant code looked like this: App.tsx: import i18n from 'i18next'; import { initR ...

Leveraging Toaster Notifications in AngularJS for Custom Exception Management and Logging

Implemented the use of AngularJS Toaster for effective notification handling. To customize exception handling, set up in index.html as shown below <toaster-container toaster-options="{'time-out': 3000, 'position-class': 'toast ...

Preventing the detection of a jshint "error"

When creating an object using the constructor X, I later add multiple methods in the file using X.prototype.method = function () {...}. Although technically an assignment statement, it behaves like a function declaration, which typically doesn't requi ...

Utilize a Sails.js Single Page Application (SPA) to route all unutilized paths to a centralized controller function

I'm currently working on a project where I am building a single page application (SPA) with Sails.js as the backend. My goal is to have all routes redirect to a single controller action. However, the issue I am facing is that when I try the following ...

The Alchemy feature on hover is not functioning

I am currently using alchemy.js to display a graph, but I am encountering issues with showing the "onMouseOver" caption of the graph's node. The console is displaying some errors which you can see here. Here is the code snippet: <html> < ...

Modify the property of an element within an array

I have an array of objects with a certain property. I need to perform some mathematical operations on this property and return a new array. However, my current approach does not seem to be working as expected. array.map(el => { el.count * 2; r ...

What is the simplest method for fetching and parsing JSON data with jQuery and JavaScript?

I'm having trouble making this code snippet work. I can't seem to figure it out. The objective is to retrieve and parse a JSON object in the simplest and easiest way possible. Here's the code snippet. <!DOCTYPE html> <html> &l ...

Use of ng-if in combination with recursive directives does unexpected behavior

I have a situation where I am using two recursive directives inside ui-bootstrap tabs. In order to optimize performance, I want the directive to only load when its corresponding tab is active. To achieve this, I am using ng-if on the directive like this: & ...

The controller is not receiving the isolated scope value

I have implemented angular-slider.js on a webpage where a server request is triggered upon changing the slider's value. I am looking to delay this action until the user releases the mouse button, specifically during onmouseup event. Incorporating thi ...

Having trouble with Bootstrap 4 maintaining consistent width when affixing the sidebar

Hello there, I'm currently working with Bootstrap 4 and trying to implement affix on the sidebar. I have set up three columns for the sidebar and made them fixed under certain conditions. However, I am facing an issue where the width of the sidebar ch ...

Is it possible to use JavaScript to append elements with a fade-in effect

I'm looking to add an element with a fade-in animation to another class using JavaScript. Can anyone provide guidance on how to achieve this? Here is what I've tried: success:function(data){ $(".new_posts").append(data); $(".new ...

Challenges when building a production version of an Expo app with Typescript

Attempting to perform a local production build, I ran expo start --no-dev --minify. Only the initial template file displays, stating "Open up App.tsx to start working on your app," and none of my work is visible... Has anyone else encountered this issue a ...

In order for Angular jQuery click events to properly function, they must be triggered by a

My admin panel is built using jQuery and Bootstrap, and it functions properly when used outside of the Angular framework. However, after integrating jQuery and Bootstrap into an Angular project and configuring them, I noticed that I had to double click on ...

Transitioning from Webpack version 4 to version 5 resulted in a failure to detect certain styles

After migrating my React project to Webpack v5, I am facing an issue where none of my .scss files are being picked up when I run the project. I meticulously followed the guide on migrating webpack https://webpack.js.org/migrate/5/, updated all plugins and ...

Submitting forms through Vanilla JavaScript using AJAX

Can anyone assist me in implementing an AJAX form submission using Vanilla JavaScript instead of jQuery? I have the following jQuery code that needs to be converted: document.addEventListener('DOMContentLoaded', function() { document.querySelec ...

Is it possible to incorporate a fadein animation into a function?

Developing the entire HTML structure using JavaScript is one of my skills. Here is a snippet as an example: function generateHeader () { $('body').append( $('<header>') .attr('id', "main-header") ...

Executing MySQL queries through JavaScript functions

I need to create a PHP function that I can use in my JavaScript code. The issue I'm facing is that the variables from the beginning of the file are not recognized in the JavaScript block. <!DOCTYPE html> <?php include 'pdo_connect.php&a ...