Adding a dynamic, inheritable property to a class in real-time

Can we dynamically assign static inheritable properties to a class?

(I am looking for a solution in Typescript for annotating properties that need to be stored within the Class and accessible in subclasses, but I believe this question is applicable to Javascript as well)

Answer №1

Just to clarify, after finding a helpful discussion (thanks to the insightful response there), I discovered exactly what I was seeking:

class SuperClass{}
let example = new SuperClass();
let prototype = Object.getPrototypeOf(example);
Object.defineProperty(prototype, "metadata", {
    enumerable: false, 
    writable: true      // crucial for modifying the metadata
});
prototype.metadata = {x: 10, y: "world"};     // The SuperClass will now have this property accessible in the prototype of all its instances (including any subclasses)
class SubClass extends SuperClass{}
let subInstance = new SubClass();
let retrievedValue = Object.getPrototypeOf(subInstance).metadata;  // {x: 10, y: "world"}

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

I'm currently attempting to establish a connection between my server.js express API and MongoDB, but I keep encountering an unfamiliar error message that I'm having trouble decipher

Here is the server.js code: import express from 'express'; import bodyParser from 'body-parser'; import userRoutes from './routes/users.js'; import mongoose from 'mongoose'; co ...

Instructions on how to sign up for a worldwide technique that is known as

I have a file called globalvars.ts where I added a global method. How can I subscribe to this method in the ts page where it is being called? globalvars.ts; httpgetmethod(url:string) { var veri; var headers = new Headers(); headers.append(' ...

Exploring Pan Gestures in Ionic 3

Looking for information on Pan events in Ionic 3 - not sure if they are related to Cordova or Angular 4? <div class="swipper" #swipper (panleft)="swipe( $event)" (panright)="swipe( $event)" (panend)="swipe( $event) " (panup)="swipe( $event) " (pandown) ...

Tips for creating a login/registration system in a single page application

I've been working on a single-page application with ngRoute for navigation between tabs. Now, I need to incorporate a login and registration feature. After that, users should be able to access all the tabs. I'm unsure about the following: 1) Sho ...

Utilize Javascript to trigger AJAX refreshes only when necessary

I have developed a web application that displays data fetched from an AJAX request to a PHP script on the same server. This particular application involves playing music from Spotify, and in order to ensure the displayed information is always up-to-date ...

Tips for resolving the issue with the 'search input field in the header' across all pages in angular 5 with typescript

I currently have a search field in the header that retrieves a list of records when you type a search term and click on one of them. The search function utilizes debounceTime to reduce API requests, but I'm encountering an issue where the search doesn ...

Establish a JavaScript hyperlink to assign a value to a shared rendering parameter

In my attempt to create a JavaScript link that, when clicked, assigns a value to a public render parameter in WebSphere Portal, I'm encountering unexpected code instead of the intended value. Here is how I am constructing the link using JavaScript: ...

Setting a specific time for a div element with opacity: A step-by-step guide

Is there a way to adjust the timing for the appearance of the add-to-cart when hovering over the product-list-item? Currently, it appears when I hover over the item and disappears when I move my mouse away. .product-list-item { position: relative; w ...

Resizable and adaptable side panel

Seeking a template for a responsive sidebar that can be dragged horizontally to resize. Bootstrap compatibility is optional (using bootstrap 4.6, but other versions are acceptable) and jQuery can be utilized. An example that meets some of my requirements: ...

Using Apps Scripts to split a multi-value cell into individual rows

I need help dividing a cell with various values separated by "\n" using App Script. I've experimented with suggested functions but none have been successful. Below is an example of the current format and the desired result. https://i.sstatic.net ...

Error in jQuery: IE8/9 does not support transportation for CORS requests, even when $.support.cors is set to true

Encountered a 'No Transport' Error (as indicated by Firebug Lite) and on IE console it just shows LOG: [object Object] Even after adding jQuery.support.cors = true; just before jQuery.ajax, the issue persisted. Unfortunately, my IE seems to be m ...

Having difficulty assigning properties in react-redux

I'm experiencing an issue with my code that involves using both React and Redux. The problem lies in the fact that this.props.comments is coming up as undefined. Can anyone identify what may be amiss? reducer.js: import {Map,List} from 'immutab ...

Query by ObjectId attribute of a subdocument in Mongoose

I'm facing a challenge with the following query: Stuff.findOneAndUpdate({ status: 'open', ...query }, value, { new: true }); Here, query is defined as: { 'buyer.user': mongoose.Types.ObjectId(user._id) }; The Stuff model contains ...

Is there a way to see the default reactions in a browser when keyboard events such as 'tab' keydown occur?

Whenever I press the 'tab' key, the browser switches focus to a different element. I would like to be able to customize the order of focused elements or skip over certain elements when tabbing through a page. While I am aware that I can use preve ...

Synchronize chat messages automatically with the scrolling window using AJAX technology

Original Content Scrolling Overflowed DIVs with JavaScript In my AJAX chat application, messages are displayed in a div with overflow: auto, enabling the scroll bar when the content exceeds the space. I am looking for a solution that automatically scrol ...

NodeJS Puppeteer encountering problem with setting download behavior

When attempting to specify a custom download path, Chrome seems to ignore the downloadPath option and continues to save files in the default C:/Users/Me/Downloads folder regardless. const puppeteer = require('puppeteer'); (async () => { c ...

To achieve proper display of multiple boxes, it is essential for each box to be

My current approach involves adding boxes to the scene based on specific dimensions for height, width, and depth, and it works perfectly when the boxes are all square. https://i.sstatic.net/HdDSX.png However, the issue arises when I try to use a rectangu ...

Is there a way to get Axios to display CSS on the page?

While working on a Web Viewer project with axios for web scraping practice, I encountered an issue where the CSS wasn't loading properly. Here is the code snippet I used: console.log("Tribble-Webviewer is starting!") const express = requir ...

Issue with Vue 3 component not updating following vue-router invocation

I am currently working on developing a todo app using ionic-vue with vue 3. In my Lists.vue component, I have set up an overview where users can click on different lists to load tasks specific to each list. However, I am facing an issue where the same data ...

Tips on targeting a node that is dynamically generated within a function and styling it externally

Is there a way to style or change divs created within a function, but without making the change within that same function? Since variables are in the local scope of functions, it can be challenging to access these created divs for future styling or changes ...