0
124
ViewsTypescript object with default function typing in React
I wonder how this code written in JavaScript
const stuff = useCallback(() => {
function first() {
return "firstStaff";
}
function major() {
return "majorStaff";
}
major.first = first;
return major;
})();
Can be written with correct types in TypeScript, so it has the right hints for stuff() and stuff.first()
·
Juan Pablo Isaza
3 answers
Answer question0
We can define a type by combining multiple types like this to achieve required
type Stuff = { first: () => string } & (() => string);
const stuff: Stuff = useCallback(() => {
...
})();
stuff.first();
stuff();
·
Juan Pablo Isaza
Report
0
If you are interested in function static property typing you can use this example:
import { useCallback } from 'react'
interface Major {
(): string
first: () => string
}
const stuff = useCallback((): Major => {
function first() {
return "firstStaff";
}
function major() {
return "majorStaff";
}
major.first = first;
return major;
}, [])();
Please see this question/answer if you want to know more about typing static function properties
·
Juan Pablo Isaza
Report
0
useCallback need an array of dependency as the 2nd argument then it can be self infer
import { useCallback } from "react";
export default function App() {
const stuff = useCallback(() => {
function first() {
return "firstStaff";
}
function major() {
return "majorStaff";
}
major.first = first;
return major;
}, []);
return (
...
);
}
Working Example:
·
Juan Pablo Isaza
Report
Answer question