Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

227
Views
Conditional arguments

I would like to create a function that restricts the arguments passed. dpr and w should not be both passed at the same time. Here's my attempt:

Playground


interface W { w: number }
interface Dpr { dpr: number }

type Srcset<T> = { url: string } & WidthOrDpr<T> 

type WidthOrDpr<T> = T extends W ? W : Dpr; 

function formatSrcset<T extends W | Dpr>(options: Srcset<T>) {

}

formatSrcset({ url: '//', dpr: 1 }); // ok
formatSrcset({ url: '//', w: 1 }); // ok
formatSrcset({ url: '//', w: 1, dpr: 1 }); // should fail

I would like to avoid function overloads.

about 4 years ago · Juan Pablo Isaza
2 answers
Answer question

0

This is not the most concise code, but what if you forced dpr / w to be undefined by defining two interfaces for the different arg options? Something like this:

type Args1 = { dpr: number, w?: undefined };
type Args2 = { dpr?: undefined, w: number };

type Srcset<T> = { url: string } & (Args1 | Args2);
about 4 years ago · Juan Pablo Isaza Report

0

You can use type-fest's RequireAtLeastOne

// code from sindresorhus/type-fest

type RequireAtLeastOne<
    ObjectType,
    KeysType extends keyof ObjectType = keyof ObjectType,
> = {
    // For each `Key` in `KeysType` make a mapped type:
    [Key in KeysType]-?: Required<Pick<ObjectType, Key>> & // 1. Make `Key`'s type required
        // 2. Make all other keys in `KeysType` optional
        Partial<Pick<ObjectType, Exclude<KeysType, Key>>>;
}[KeysType] &
    // 3. Add the remaining keys not in `KeysType`
    Except<ObjectType, KeysType>;

In your case

type Args = RequireAtLeastOne<{
    url: string
    dpr?: number
    w?: number
}, 'dpr' | 'w'>


function fn({ url, dpr, w }: Args) {...}

about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!