Here is my code
async getAll(): Promise<GetAllUserData[]> {
return await dbQuery(); // dbQuery returns User[]
}
class User {
id: number;
name: string;
}
class GetAllUserData{
id: number;
}
getAll function returns User[], and each element of array has the name property, even if its return type is GetAllUserData[].
I want to know if it is possible "out of the box" in TypeScript to restrict an object only to properties specified by its type.
I figured out a way, using built-in types available since TypeScript version 3, to ensure that an object passed to a function does not contain any properties beyond those in a specified (object) type.
// First, define a type that, when passed a union of keys, creates an object which
// cannot have those properties. I couldn't find a way to use this type directly,
// but it can be used with the below type.
type Impossible<K extends keyof any> = {
[P in K]: never;
};
// The secret sauce! Provide it the type that contains only the properties you want,
// and then a type that extends that type, based on what the caller provided
// using generics.
type NoExtraProperties<T, U extends T = T> = U & Impossible<Exclude<keyof U, keyof T>>;
// Now let's try it out!
// A simple type to work with
interface Animal {
name: string;
noise: string;
}
// This works, but I agree the type is pretty gross. But it might make it easier
// to see how this works.
//
// Whatever is passed to the function has to at least satisfy the Animal contract
// (the <T extends Animal> part), but then we intersect whatever type that is
// with an Impossible type which has only the keys on it that don't exist on Animal.
// The result is that the keys that don't exist on Animal have a type of `never`,
// so if they exist, they get flagged as an error!
function thisWorks<T extends Animal>(animal: T & Impossible<Exclude<keyof T, keyof Animal>>): void {
console.log(`The noise that ${animal.name.toLowerCase()}s make is ${animal.noise}.`);
}
// This is the best I could reduce it to, using the NoExtraProperties<> type above.
// Functions which use this technique will need to all follow this formula.
function thisIsAsGoodAsICanGetIt<T extends Animal>(animal: NoExtraProperties<Animal, T>): void {
console.log(`The noise that ${animal.name.toLowerCase()}s make is ${animal.noise}.`);
}
// It works for variables defined as the type
const okay: NoExtraProperties<Animal> = {
name: 'Dog',
noise: 'bark',
};
const wrong1: NoExtraProperties<Animal> = {
name: 'Cat',
noise: 'meow'
betterThanDogs: false, // look, an error!
};
// What happens if we try to bypass the "Excess Properties Check" done on object literals
// by assigning it to a variable with no explicit type?
const wrong2 = {
name: 'Rat',
noise: 'squeak',
idealScenarios: ['labs', 'storehouses'],
invalid: true,
};
thisWorks(okay);
thisWorks(wrong1); // doesn't flag it as an error here, but does flag it above
thisWorks(wrong2); // yay, an error!
thisIsAsGoodAsICanGetIt(okay);
thisIsAsGoodAsICanGetIt(wrong1); // no error, but error above, so okay
thisIsAsGoodAsICanGetIt(wrong2); // yay, an error!
Typescript can't restrict extra properties
Unfortunately this isn't currently possible in Typescript, and somewhat contradicts the shape nature of TS type checking.
Answers in this thread that relay on the generic NoExtraProperties are very elegant, but unfortunately they are unreliable, and can result in difficult to detect bugs.
I'll demonstrate with GregL's answer.
// From GregL's answer
type Impossible<K extends keyof any> = {
[P in K]: never;
};
type NoExtraProperties<T, U extends T = T> = U & Impossible<Exclude<keyof U, keyof T>>;
interface Animal {
name: string;
noise: string;
}
function thisWorks<T extends Animal>(animal: T & Impossible<Exclude<keyof T, keyof Animal>>): void {
console.log(`The noise that ${animal.name.toLowerCase()}s make is ${animal.noise}.`);
}
function thisIsAsGoodAsICanGetIt<T extends Animal>(animal: NoExtraProperties<Animal, T>): void {
console.log(`The noise that ${animal.name.toLowerCase()}s make is ${animal.noise}.`);
}
const wrong2 = {
name: 'Rat',
noise: 'squeak',
idealScenarios: ['labs', 'storehouses'],
invalid: true,
};
thisWorks(wrong2); // yay, an error!
thisIsAsGoodAsICanGetIt(wrong2); // yay, an error!
This works if at the time of passing an object to thisWorks/thisIsAsGoodAsICanGet TS recognizes that the object has extra properties. But in TS if it's not an object literal, a value can always have extra properties:
const fun = (animal:Animal) =>{
thisWorks(animal) // No Error
thisIsAsGoodAsICanGetIt(animal) // No Error
}
fun(wrong2) // No Error
So, inside thisWorks/thisIsAsGoodAsICanGetIt you can't trust that the animal param doesn't have extra properties.
Solution
Simply use pick (Lodash, Ramda, Underscore).
interface Narrow {
a: "alpha"
}
interface Wide extends Narrow{
b: "beta"
}
const fun = (obj: Narrow) => {
const narrowKeys = ["a"]
const narrow = pick(obj, narrowKeys)
// Even if obj has extra properties, we know for sure that narrow doesn't
...
}
Typescript uses structural typing instead of nominal typing to determine type equality. This means that a type definition is really just the "shape" of a object of that type. It also means that any types which shares a subset of another type's "shape" is implicitly a subclass of that type.
In your example, because a User has all of the properties of GetAllUserData, User is implicitly a subtype of GetAllUserData.
To solve this problem, you can add a dummy property specifically to make your two classes different from one another. This type of property is called a discriminator. (Search for discriminated union here).
Your code might look like this. The name of the discriminator property is not important. Doing this will produce a type check error like you want.
async function getAll(): Promise<GetAllUserData[]> {
return await dbQuery(); // dbQuery returns User[]
}
class User {
discriminator: 'User';
id: number;
name: string;
}
class GetAllUserData {
discriminator: 'GetAllUserData';
id: number;
}
I don't think it's possible with the code structure you have. Typescript does have excess property checks, which sounds like what you're after, but they only work for object literals. From those docs:
Object literals get special treatment and undergo excess property checking when assigning them to other variables, or passing them as arguments.
But returned variables will not undergo that check. So while
function returnUserData(): GetAllUserData {
return {id: 1, name: "John Doe"};
}
Will produce an error "Object literal may only specify known properties", the code:
function returnUserData(): GetAllUserData {
const user = {id: 1, name: "John Doe"};
return user;
}
Will not produce any errors, since it returns a variable and not the object literal itself.
So for your case, since getAll isn't returning a literal, typescript won't do the excess property check.
Final Note: There is an issue for "Exact Types" which if ever implemented would allow for the kind of check you want here.
Following up on GregL's answer, I'd like to add support for arrays and make sure that if you've got one, all the objects in the array have no extra props:
type Impossible<K extends keyof any> = {
[P in K]: never;
};
export type NoExtraProperties<T, U extends T = T> = U extends Array<infer V>
? NoExtraProperties<V>[]
: U & Impossible<Exclude<keyof U, keyof T>>;
Note: The type recursion is only possible if you've got TS 3.7 (included) or above.
The accepted answer, with a discriminator, is right. TypeScript uses structural typing instead of nominal typing. It means that the transpiler will check to see if the structure match. Since both classes (could be interface or type) has id of type number it matches, hence interchangeable (this is true one side since User is having more properties.
While this might be good enough, the issue is that at runtime the returned data from your method getAll will contains the name property. Returning more might not be an issue, but could be if you are sending back the information somewhere else.
If you want to restrict the data to only what is defined in the class (interface or type), you have to build or spread a new object manually. Here is how it can look for your example:
function dbQuery(): User[] {
return [];
}
function getAll(): GetAllUserData[] {
const users: User[] = dbQuery();
const usersIDs: GetAllUserData[] = users.map(({id}) => ({id}));
return usersIDs;
}
class User {
id: number;
name: string;
}
class GetAllUserData {
id: number;
}
Without going with the runtime approach of pruning the fields, you could indicate to TypeScript that both classes are different with a private field. The code below won't let you return a User when the return type is set to GetAllUserData
class User {
id: number;
name: string;
}
class GetAllUserData {
private _unique: void;
id: number;
}
function getAll(): GetAllUserData[] {
return dbQuery(); // Doesn't compile here!
}
I found this another workaround:
function exactMatch<A extends C, B extends A, C = B>() { }
const a = { a: "", b: "", c: "" }
const b = { a: "", b: "", c: "", e: "" }
exactMatch<typeof a, typeof b>() //invalid
const c = { e: "", }
exactMatch<typeof a, typeof c>() //invalid
const d = { a: "", b: "", c: "" }
exactMatch<typeof a, typeof d>() //valid
const e = {...a,...c}
exactMatch<typeof b, typeof e>() //valid
const f = {...a,...d}
exactMatch<typeof b, typeof f>() //invalid
See the original Post
Link to Playground
As an option, you can go with a hack:
const dbQuery = () => [ { name: '', id: 1}];
async function getAll(): Promise<GetAllUserData[]> {
return await dbQuery(); // dbQuery returns User[]
}
type Exact<T> = {[k: string | number | symbol]: never} & T
type User = {
id: number;
name: string;
}
type GetAllUserData = Exact<{
id: number;
}>
Error this produces:
Type '{ name: string; id: number; }[]' is not assignable to type '({ [k: string]: never; [k: number]: never; [k: symbol]: never; } & { id: number; })[]'.
Type '{ name: string; id: number; }' is not assignable to type '{ [k: string]: never; [k: number]: never; [k: symbol]: never; } & { id: number; }'.
Type '{ name: string; id: number; }' is not assignable to type '{ [k: string]: never; [k: number]: never; [k: symbol]: never; }'.
Property 'name' is incompatible with index signature.
Type 'string' is not assignable to type 'never'.
When using types instead of interfaces, the property are restricted. At least in the IDE (no runtime check).
Example
type Point = {
x: number;
y: number;
}
const somePoint: Point = {
x: 10,
y: 22,
z: 32
}
It throws :
Type '{ x: number; y: number; z: number; }' is not assignable to type 'Point'. Object literal may only specify known properties, and 'z' does not exist in type 'Point'.
I think types are good for defining closed data structures, compared to interfaces. Having the IDE yelling (actually the compiler) when the data does not match exactly the shape is already a great type guardian when developping
I'm using react with typescript and I have this:
interface SomeProps {
stuff: {
optionalStuff?: object[];
}[];
}
The only problem with this approach is that if I try to insert any property besides optionalStuff inside the stuff object[], it will fail because those properties are not listed.
How can I do something like:
interface SomeProps {
stuff: {
ACCEPTS_ANY_GENERIC_STUFF_INSIDE: string | number | object | undefined
optionalStuff?: object[];
}[];
}
You could make SomeProps generic, so you could specify what other optional fields would stuff accept. In the example below, stuff except optionalStuff takes also foo field.
type SomeProps<T> = {
stuff: ({
optionalStuff?: object[];
} & T)[];
}
const arr: SomeProps<{ foo: string }> = {
stuff: [{
optionalStuff: [],
foo: 'abc'
}]
}
Typescript playground
The previous answer is correct, but in case you don't know in advance or the type of objects in stuff only share the optionalStuff array but not the other keys, you could use an index signature.
interface SomeProps {
stuff: {
optionalStuff?: object[];
[key: string]: string | number | object | undefined;
}[];
}
Then you get type checking for optionalStuff but the objects can be extended with any other property.
I remember there is a way to create, inside an interface, a field without specifying its name, something like this:
export interface myInterface{
[propName:string]:string;
}
If I remember well, that sinthax means I can create a field with whatever name I want, something like this:
ob:myInterface = {customName: "value"}
What I'm trying to do now is to add a new field to that interface, with a specific name, something like this:
export interface myInterface{
[propName:string]:string;
secondProperties: boolean;
}
When I try the code above I get this error:
Property 'secondProperties' of type 'boolean' is not assignable to string index type 'string'
What is my error?
You need to define all possible types for [propName: string]
So you need to do it in this way
export interface myInterface{
secondProperties: boolean
[propName:string]: string | boolean;
}
I never found a good solution but the problem arises from this.
You are trying to force a property to be of type boolean & string, which equals to never.
type myInterface = {
[propName:string]: string;
} & {
secondProperties: boolean;
};
const obj: myInterface = {
secondProperties: true,
};
playground
Thanks to #LaytonGB for hinting, that | can be used to make almost the type we wanted.
type myInterface = {
[propName:string]: string;
} | {
secondProperties: boolean;
};
const obj: myInterface = {
secondProperties: 'string' || true,
otherProps: 'string only', // booleans will result in error.
};
Because you have defined any string-named-property of your objects to have a value of string, you can only give secondProperties a string value, because secondProperties itself is a string.
Alternatively consider this:
interface myInterface {
[propName: string]: string | boolean;
["secondProperties"]: boolean;
}
Because secondProperties is a string, and its value returns a boolean, it is not throwing errors.
I want to declare a variable with two types via ts.But the complier tips error.
like this:
interface IAnyPropObject {
[name: string]: any;
}
let a: IAnyPropObject | ((str: string) => any);
a.B = "bbbbbbbb";//tips error
a("");//tips error
note:I don't want to use 'any' to declare.I just want to constraint the variable by this way only.Because of the code are so old and they are not TS code.
Brief explanation of Mixin vs Union types.
Union: Either this or that type, but not both.
interface A { [name: string]: any; }
interface B { (str: string): string; }
type UnionType = A | B;
Mixin: A mix of this and that type at the same time.
interface A { [name: string]: any; }
interface B { (str: string): string; }
type MixinType = A & B;
Your code would work if you use a Mixin type, if that is your intention. Variable a can have a mix of both types at the same time.
If you use an OR type, that doesn't mean your object has two types at the same time, you have to test it and use the correct type with casting inside of the test.
See https://www.typescriptlang.org/docs/handbook/advanced-types.html
interface IAnyPropObject { [name: string]: any; }
type MyFunc = (str: string) => any;
let a: IAnyPropObject | ((str: string) => any);
if (a instanceof Function) {
(<MyFunc>a)("hi"); //passing a number will throw an error
} else {
(<IAnyPropObject>a).b = 'bbbbbbbb';
}
You could also create a custom type guard, it's explained in the documentation I linked to, then you would not have to cast it. There's a lot more to be said, I just scratched the surface since I'm answering from my phone, read the doc for all the details.
I created this HashMap interface:
export interface HashMap<K, V> {
[name: K]: V;
}
With the idea that I can use it as:
const map: HashMap<String, String>;
However, right now I get an error saying name can only be of type string or number.
How do I apply the constraint on K template here?
Firstly, do not use the UpperCase primitive type names. That is to say use string instead of String.
As to the meat of your question, a TypeScript index signature's parameter type must be one of string, number, or symbol. The last is only available under --target es2015 or greater.
You can, however, constraint the type of the key to be a subset of string values. In this case you must use a type alias declaration, not an interface.
export type HashMap<K extends string, V> = {
[P in K]?: V;
}
The [P in K] syntax means "enumerate each string literal type in the subset of string types with which K is instantiated".
This is useful because we can restrict the contents of the map by specifying a union type with string literal types as its constituents.
For example:
const map: HashMap<'firstName' | 'lastName', string> = {
firstName: 'John', // OK
nickname: 'Johnny' // Error
};
Basically, for all intents and purposes you must use string but you can constrain the key type to be a specific string or a set of specific strings by using a union type.
In practice, the string union type will very often be a function of another type.
For example:
interface Item {
name: string;
id: number;
}
interface PropertyMetadata {
kind: 'data' | 'accessor';
}
type LazyItem = {
[P in keyof Item]: PropertyDescriptor
};
keyof is a Type Operator that takes a type and returns a type that is the string union of its property keys.
Now, this is probably not what you are looking for. If you want to use an arbitrary key type, bound by some constraint you will need to use an ES2015 Map object. Prior to the addition of this type in JavaScript, it was not possible to perform this mapping in a clean way and string was essentially the only viable key type.
By combining an ES2015 map with the power of TypeScript generics (templates as you call them) we can approximate what you are looking for.
For example:
interface Category {
name: string;
products: Product[];
}
interface Product {
name: string;
category: Category;
}
const categoriesToProducts = new Map<Category, Product[]>();
declare function getProducts(): Product[];
const products = getProducts();
products.forEach(product => {
const mapped = categoriesToProducts.get(product.category);
if (mapped) {
mapped.push(product);
}
else {
categoriesToProducts.add(product.category, [product]);
}
});
Since the only types you can normally use as keys for indexable types are primitive types string and number, I don't think there is much gained from the ability to parametrize on them, but if you insist...
type IndexableTypes<V> = {
[s: string]: { [n: string]: V };
number: { [n: number]: V };
}
type SN = { [n: number]: 'number', [s: string]: string };
type HashMap<K extends string | number, V> = IndexableTypes<V>[SN[K]];
const map: HashMap<string, string> = {}; // inferred as {[n: string]: string; }
const map1: HashMap<number, string> = {}; // inferred as {[n: number]: string;}
const map2: HashMap<number, HashMap<string, number>> = {};
// inferred as
{[n: number]:
{[n: string]: number;};
}
const map4: HashMap<boolean, {}> = {};
// error: Type 'boolean' does not satisfy the constraint 'string | number'.
However, you could just use es2015 Map class if it's available in your runtime:
type MyMap<K extends string | number, V> = Map<K, V>