Can you explain how the dash-question mark syntax works in TypeScript?

Not addressing the question mark syntax, my inquiry pertains to the usage of -? in scenarios such as the following:

type Required<T> =
  T extends object
    ? { [P in keyof T]-?: NonNullable<T[P]>; } // <---------- "-?" here
    : T;

Referenced from a 2018 GitHub comment, this particular syntax seems absent from TypeScript's guide on advanced types and utility types.

The usage of -? displayed above successfully compiles in TypeScript 3.8 and serves as the opposite of ?, essentially requiring the key. Is it similar to Required? If not, what is the specific name for this syntax and where can one find further information about it?

Answer №1

Correct! This code snippet removes the optional property modifier ? from a mapped type. The feature was added in TypeScript 2.8 to enhance control over mapped type modifiers (refer to this link for detailed documentation). Although it's not exactly the same as the Required utility type, Required is actually built on this functionality (view library definitions here) and depends on it.

It's unfortunate that the TypeScript documentation is scattered across various sources like the handbook, release notes, FAQ, outdated specs, and GitHub issues without a central location to find information. The language evolves rapidly, often outpacing the documentation efforts.

Feel free to reach out if you have any more questions or need further assistance. Good luck with your coding journey!

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

In Vue3, when using the `script setup` with the `withDefaults` option for a nested object, its attributes are marked as required. How can this issue

I have defined a props object with certain attributes: interface Props { formList: BaseSearchFormListItemType[], inline?: boolean searchBtn?: { show?: boolean text?: string type?: string size?: string } } const props = withDefaults( ...

Does my pseudo example for react event pooling seem logical?

TLDR Looking for insights on implementing event pooling logic in React. Curious to understand the principles behind event pooling :) Question While exploring the depths of the React documentation, I stumbled upon event pooling. Intrigued by this concep ...

A versatile union type in Typescript that combines dynamic properties of dynamic objects

Is there a way to create a unified union type based on the dynamic properties of an object? const config = { devices: { Brand1: ['model1'], Brand2: ['model2', 'model3'], }, }; export type DeviceBrand = keyof typeo ...

Angular 2: The *ngFor directive is unable to locate a suitable differing framework

Below is the code for client.service.ts clients: Client[]; getClientList() { let headers = new Headers(); headers.append('Content-Type', 'application/json'); let authToken = localStorage.getItem('auth_token&apo ...

The @IsEnum function does not support converting undefined or null values to objects

When I tried to use the IsEnum class validator in the code snippet below: export class UpdateEvaluationModelForReportChanges { @IsNotEmpty() @IsEnum(ReportOperationEnum) // FIRST operation: ReportOperationEnum; @IsNotEmpty() @IsEnum(Evaluatio ...

Is there a way to automatically validate v-forms inside a v-data-table when the page loads?

In my data entry form, I have utilized a v-data-table with each column containing a v-form and v-text-field for direct value updates. My goal is to validate all fields upon page load to identify any incorrect data inputs. However, I am facing challenges in ...

"Error encountered: Unable to resolve dependency tree" message appears when attempting to run npm install

Encountering dependency errors while trying to execute the npm install command for my Angular application. As a newcomer to TypeScript and Angular, I'm unsure of the next steps to take. Any suggestions? Attempted solutions include clearing the npm ca ...

What can possibly be the reason why the HttpClient in Angular 5 is not functioning properly

I am attempting to retrieve data from the server and display it in a dropdown menu, but I am encountering an error while fetching the data. Here is my code: https://stackblitz.com/edit/angular-xsydti ngOnInit(){ console.log('init') this ...

Can you please tell me the name of the ??= operator in Typescript?

The Lit Element repository contains a function called range that utilizes the ??= operator. This operator resembles the nullish coalescing operator but with an equal sign. Do you know what this specific operator is called? Below is the complete code snipp ...

The 'import type' declaration cannot be parsed by the Babel parser

Whenever I attempt to utilize parser.parse("import type {Element} from 'react-devtools-shared/src/frontend/types';", {sourceType: "unambiguous"}); for parsing the statement, I come across an error stating Unexpected token, exp ...

What is a simple method to convert TypeScript to JavaScript?

Is it possible to eliminate TypeScript-specific keywords from a JavaScript file without using the tsc command, while ensuring that the file remains readable by humans and maintains JSX syntax? ...

Utilizing NestJS to efficiently share an end-to-end server across multiple test suites

Currently, I'm utilizing the NestJS test module to simulate the nest app for testing purposes and my goal is to make this app accessible across various test suites. Here is how I have set it up: test |_ helpers |_ testApp.ts |_ e2e |_ u ...

Keeping track of various combinations of a string containing only certain characters

Currently, I am working on a project that involves replacing letters of the alphabet with numbers resembling similar styles in typescript. For example, converting the letter 'I' to '1'. I have successfully implemented a function called ...

"Activate the mat-checkbox based on the outcome of a certain process

I'm working with a mat-checkbox that triggers a mat-dialog when clicked. If the user clicks "confirm" in the dialog, I want the checkbox to be checked. If they click "cancel", I want it to remain unchecked. How can I achieve this? Below is the method ...

Explanation of Default Export in TypeScript

I recently started learning about JS, TS, and node.js. While exploring https://github.com/santiq/bulletproof-nodejs, I came across a section of code that is a bit confusing to me. I'm hoping someone can help explain a part of the code. In this project ...

Executing functions from a child component in a parent component in Angular 2

I'm currently working on ng2 RC6. I have a parent component and a child component. Within the child component, I am utilizing an ng2-bootstrap modal and the following start function: import { Component, ViewChild, AfterViewInit, Input } from '@ ...

Encountering a NaN outcome when summing values from various select options

I'm working on a project that involves adding up the prices based on the surface chosen by the user. I'm struggling with calculating the partial cost when the user's choice changes. totalSum.ts num: Calculation totalAmount: number cate ...

Setting up Storybook with Tailwindcss, ReactJS and Typescript: A comprehensive guide

What is the best way to configure Storybook to handle Tailwindcss styles and absolute paths? Just a heads up, this question and answer are self-documenting in line with this. It was quite the process to figure out, but I'm certain it will help others ...

Issue with hardhat failing to detect balance transfer from smart contract

I am currently in the process of creating tests for a smart contract that I have developed. Below is a simplified version of the smart contract: Please Note: I have hard-coded the value to ensure accuracy regarding the amount leaving the contract. functio ...

The issue with launching a Node.js server in a production environment

I'm currently facing an issue when trying to start my TypeScript app after transpiling it to JavaScript. Here is my tsconfig: { "compilerOptions": { "module": "NodeNext", "moduleResolution": "NodeNext", "baseUrl": "src", "target": " ...