Change object properties dynamically to meet requirements in TypeScript

Let's say I have a function that outputs the following:

interface result {
  A?: string;
  B?: string;
  C?: string;
}

When using an array parameter in a function, how can I make certain return parameters non-nullable and required? For example:

function toRequired(keysToTurnRequired: string[]): CorrectResult {
}

If I were to execute toRequired(['A', 'B']), then my return type should be updated to this:

result {
  A!: string;
  B!: string;
  C?: string;
}

Is there a generic method in Typescript to achieve this easily? This would greatly enhance type safety when working with ORM repositories.

Answer №1

It is possible to define types in advance and then apply type narrowing, but the creation of types during runtime is not feasible in TypeScript. This is because TypeScript primarily serves as a tool for developers in the development environment, and by the time the code runs, it has already been converted into JavaScript.

interface ResultBase {
    A?: string;
    B?: string;
    C?: string;
  } 
  
  interface ResultAB extends Partial<ResultBase> {
    A: string;
    B: string;
  }

  const isResultAB = (candidate: ResultBase): candidate is ResultAB => {
      return ('A' in candidate && typeof 'A' === 'string') &&
         ('B' in candidate && typeof 'B' === 'string')
  }

  const x = {
      A: 'sfsdf',
      B: 'bbbb'
  }

  if (isResultAB) {
      // Now we know we have a type ResultAB
  }

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

Executing an asynchronous function within an Angular 7 interceptor is crucial

I've been working on creating an interceptor to handle a situation where a function needs to be called to refresh the session upon receiving a 401 error response. Here's what I have so far but I'm facing build issues and struggling to figure ...

What is the best way to launch an event when a component is accessed through navigation?

I am working on an angular2 application (RC5) that includes a chapter component containing a large template file named chapter.html. The template features different sections for each chapter specified by conditionals like: <div *ngIf="chapter == 1"> ...

Relaying numerous references in TypeScript

Having some trouble forwarding an object of refs in TypeScript and struggling with how to properly type them. Here are the refs and the way I'm passing them into my component. const storyRef = useRef<HTMLElement>(null); const parcoursRef = useR ...

Tips for aligning the arrow of a dropdown menu option

When examining the code provided, I have noticed the clr-select-container with specific attributes as depicted. In the screenshot attached, it displays the clr-select-container. The issue that I am encountering is that the inverted arrow is positioned a f ...

VueJS - When using common functions, the reference to "this" may be undefined

I'm struggling to extract a function that can be used across various components. The issue is that when I try to use "this", it is coming up as undefined. I'm not sure of the best practice for handling this situation and how to properly assign th ...

Typescript has a knack for uncovering non-existent errors

When I attempted to perform a save operation in MongoDB using Mongoose, the code I initially tried was not functioning as expected. Upon conducting a search online, I came across a solution that worked successfully; however, TypeScript continued to flag an ...

Is it possible to regulate the type of a class that has not yet been instantiated?

Is there a method in typescript to restrict the type of an uninstantiated class? I am looking to specify that only classes which inherit from Repository can be accepted by the addRepository method without actually creating an instance of the class (its co ...

Fetching data in VueJs before redirecting to a new page

Within the mounted function, I am creating an action that fetches data from a Rest API and populates my table in a Vue.js component mounted() { UserService.getProjects().then( (response) => { this.isProject = true; this.project ...

Issue with Angular2 where stylesheets are not loading properly

In my various angular 2 components, I include my stylesheets in the following manner: @Component({ selector: 'rewards-component', styleUrls: [ '../../assets/styles/old-web-styles/old-web-styles.component.scss', ...

Invoke the subscribe function within the encompassing parent function

In crafting a versatile method, I have devised the following code snippet: fetchArticle(loading: Loading): void { this.articleService.getArticleById(this.data.definition.id) .map((response: any) => response.json()) .subscribe((response: ...

Is it possible to use Eclipse for debugging AngularJS and TypeScript code?

I recently dove into the world of TypEcs and am currently working on developing a webpage using Typescript and AngularJS that I'd like to debug in Eclipse. Is it feasible to debug a TypeScript and Angular page in Eclipse? If so, could you provide m ...

Tips for transferring information between two components when a button is clicked in Angular 2

I am currently working on a code that displays a table on the main page with two buttons, "Edit" and "Delete", for each row. When the Edit button is clicked, a modal opens up. My question is, how can I pass the "employee id" of a specific employee to the ...

Execute child function in Angular after parent completes operations on observables within a forEach loop

Within the parent component, I am collecting responses from observables in an array that is then passed to the child component. parent.component.ts let categoriesArray = []; for (let category of listing.categories) { this._projectService.getCatego ...

Tips for initializing and updating a string array using the useState hook in TypeScript:1. Begin by importing the useState hook from the

Currently, I am working on a React project that involves implementing a multi-select function for avatars. The goal is to allow users to select and deselect multiple avatars simultaneously. Here is what I have so far: export interface IStoreRecommendation ...

Attempting to build a table within a table structure

My goal is to create a nested table structure similar to this image: https://i.sstatic.net/v6lZo.png The number of months, topics, and arguments for each topic can vary as they are retrieved from a database. I have attempted to implement this functionali ...

Deleting and inserting an element in the Document Object Model

I am currently working on developing a framework and need to create a directive called cp-if. Unlike the existing cp-show directive, where I can simply change the visibility of an element to 'none' and then make it visible again, with the cp-if d ...

What is the process for creating a method within a class?

Here is the current structure of my class: export class Patient { constructor(public id: number, public name: string, public location: string, public bedId: number, public severity: string, public trajectory: number, public vitalSigns: ...

Having trouble reading the length property of undefined in Angular 7

Seeking to obtain a picture link of the object. The objects are stored in an array and the typescript method looks like this: getMealPicture(orderLineMeal: OrderLine): string { for (let meal of this.meals) { if (meal.id === orderLineMeal.mealId) ...

Ways to confirm non-null values and bypass the row if it is

I have been attempting to compare 2 dates in order to appropriately display data in a table. I have tried the following approach: ${this.dateToCompare.getTime()} > ${row.CreateDate.getTime()} However, there is an issue where CreateDate has a null value ...

The guard check may not be enough to prevent the object from being null

Hello, I am facing an issue with the Object is possibly "null" error message in my Node.js + Express application. How can I resolve this problem? REST API export const getOrderReport = async ( req: Request<{}, {}, IAuthUser>, res: Resp ...