return поставьте if(!gif) return null; и станет лучше.)undefined, попытка получения свойства у undefined(gif.<some>) - очевидная ошибка. object в современном ts занчит просто {} без всяких свойств. Если вам нужен любой объект с любыми свойствами, то используйте Record<string, any>. Однако по хорошему никаких any быть не должно, вам следует чётко описать структуру получаемого объекта.useOnScreen - это нестандартных хук. Реализаций в гугле полно разных. Так что приведите его код и скажите, что вы хотите от него добиться.
string объекту вида {id: some}. const { id }: {id: string}
interface CreatureBase {
type: string;
subtype: string;
params: unknown;
}
interface PeopleBase extends CreatureBase {
type: 'People';
}
interface PeopleChild extends PeopleBase {
subtype: 'child';
params: {
age: number;
school: string;
}
}
interface PeopleAdult extends PeopleBase {
subtype: 'adult';
params: {
height: number,
weight: number,
age: number
}
}
type Creature = PeopleChild | PeopleAdult; //...
const arr: Creature[] = [
{
type: 'People',
subtype: 'adult',
params: {
height: 1,
weight: 2,
age: 3
}
},
{
type: 'People',
subtype: 'child',
params: {
school: 'foo',
age: 3
}
},
{
type: 'People',
subtype: 'adult',
params: {
school: 'foo', // err
age: 3
}
}
]as any, или дважды кастанув в новый тип var as unknown as type. Но не нужно.)
"plugin:@typescript-eslint/recommended", то не нужен, он просто там уже прописан.recommended и ты можешь его выкинуть, набросав свой по вкусу. И тогда всё сломается. Потому лучше указывать парсер сразу явно.
Promise.reslove(data) и Promise.reject(error), а во-вторых: при возврате из then\catch даже они не нужны. interface ResponseData {
status: boolean;
data?: object;
}
function sendQuery(url: string, data: object): Promise<ResponseData> {
return fetch(url, {
method: "POST",
headers: {
Accept: "application/json",
"Content-Type": "application/json"
},
body: JSON.stringify(data)
}).then(response =>
response.json()
).then(data => ({
status: true,
data: data
})).catch(() => {
throw {
status: false
}
});
}new Promise, а потому выдаёт Promise<unknown>. Т.е. каждый раз, когда вы используете new Promise - надо использовать его с дженериком: new Promise<Type>.
const queryKey: AuthMessagesKeys = queryObject.messagefunction isAuthMessagesKey(str: string): str is AuthMessagesKeys {
return ['login', 'logout', 'session'].includes(str);
}PropsWithChildren<Props>. Но под капотом он просто делает так: type PropsWithChildren<P> = P & { children?: ReactNode };type TwitterProps = {
children: (user: string) => ReactNode
}const response: ITwitter = .... Только если какая-нить хрень прилетит то может сломаться в рантайме, так что либо ты доверяешь серверу, либо используешь какую-нить либу для дополнительной проверки вживую.)
type WritableFields<T> = Partial<Pick<T, WritableKeys<T>>>;
export function createElement<K extends keyof HTMLElementTagNameMap>(tag: K, options?: WritableFields<HTMLElementTagNameMap[K]>): HTMLElementTagNameMap[K] {
let element = document.createElement(tag)
if (options) {
// assign options
Object.assign(element, options);
}
return element
}type WritableFields<T> = Partial<Pick<T, WritableKeys<T>>>;
export function createElement<K extends keyof HTMLElementTagNameMap>(tag: K, options?: WritableFields<HTMLElementTagNameMap[K]>): HTMLElementTagNameMap[K] {
let element = document.createElement(tag)
if (options) {
// assign options
let option: keyof typeof options;
for (option in options) {
element[option] = options[option]!; // ! - потому что теоретически ты можешь передать undefined явно, но морочиться с этим не стоит
}
}
return element
}interface Foo {
foo: number;
}{
foo: 1,
bar: 2
}Vue появились дополнительные свойства типа $route. Надо отдельно подключать декларации вручную, либо следовать инструкции выше.
interface Volume {
id: number;
volume?: string;
}
interface Snapshot {
id: number;
snapshot?: string;
}interface Volume {
id: number;
volume: string;
}
interface Snapshot {
id: number;
snapshot: string;
}interface Volume {
id?: number;
}
interface Snapshot {
id?: string;
}enum Constants {
VERTICAL = 'vertical',
STEP = 'step'
}
interface ConstantsTypes {
[Constants.VERTICAL]: boolean,
[Constants.STEP]: number,
}
public get<T extends keyof ConstantsTypes>(prop: T): ConstantsTypes[T] {}export class IResultItem {
constructor(
public id: i32,
public type: string,
public date: string,
public from: string,
public from_id: i32,
public text: string
) {}
}
export function add(
result: IResultItem[] = [new IResultItem( 1, "type", "25.25.2025", "rew", 123, "hello" )]
): IResultItem[] {
return result;
}unknown - совершенно нормально, его можно использовать везде где тип не известен. Он никак не ухудшает качество кода.any - совершенно нормально использовать в дженериках, если он применяется для вывода типа (напр. T extends (...args: any) => any). Совсем от него отказываться - охота на ведьм. MyClass в принципе может быть не интересен, то сам MyClass по-хорошему должен быть задан таким образом, чтобы можно было писать просто constructor(private myInstance: MyClass){};, т.е. иметь типы по умолчанию: class MyClass<T = unknown> {
myMethod(): T {...};
}unknown или any будет уже плохой практикой. Однако если нет альтернатив, и на дженерик действительно похрен - то что поделать.)
type ClearIndex<T> = {
[ P in keyof T as string extends P ? never : P ] : T[P]
};
class FOO implements ClearIndex<Service_FOO > {
methodFoo() {}
}Record<string, () => void> имеет "index signature", т.е. заявляет, что обращение по любому ключу stringвернёт () => void. Service_FOO расширяет этот тип(а не сужает), потому Service_FOO имеет ту же index signature и уточнённый конкретный метод.
jsx, полагаю, мозги парит. Не юзайте jsx с vue. Хоть это и разрешено, но jsx такое уродливое дерьмо по сравнению с нормальными vue-шаблонами...