11 2022 档案

摘要:type RGB = [number, number, number] const palette: Record<'red' | 'blue' | 'green', string | RGB> = { red: [255, 0, 0], green: "#00ff00", blue: [0,0,2 阅读全文
posted @ 2022-11-30 15:53 Zhentiw 阅读(12) 评论(0) 推荐(0) 编辑
摘要:Typescript 4.9 supports an upcoming feature: Auto-accessors: class Person { accessor name: string constructor(name: string) { this.name = name } } Und 阅读全文
posted @ 2022-11-30 15:24 Zhentiw 阅读(46) 评论(0) 推荐(0) 编辑
摘要:Before version 4.9, you will get type error for the code: interface Context { packageJSON: unknown } function tryGetPackageName(context: Context) { co 阅读全文
posted @ 2022-11-30 15:15 Zhentiw 阅读(21) 评论(0) 推荐(0) 编辑
摘要:Implement the advanced util type MutableKeys, which picks all the mutable (not readonly) keys into a union. For example: type Keys = MutableKeys<{ rea 阅读全文
posted @ 2022-11-30 14:48 Zhentiw 阅读(26) 评论(0) 推荐(0) 编辑
摘要:Invoke by Promise: import { createMachine, interpret, send } from "xstate"; const machine = createMachine({ initial: "loading", states: { loading: { o 阅读全文
posted @ 2022-11-30 02:07 Zhentiw 阅读(43) 评论(0) 推荐(0) 编辑
摘要:function countBehavior(state, event) { if (event.type "INC") { return { ...state, count: state.count + 1 } } } function createActor(behavior, initialS 阅读全文
posted @ 2022-11-30 01:35 Zhentiw 阅读(28) 评论(0) 推荐(0) 编辑
摘要:https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Container_Queries Use the container-type property a value of size, inline-size, or normal. These 阅读全文
posted @ 2022-11-29 15:41 Zhentiw 阅读(73) 评论(0) 推荐(0) 编辑
摘要:Implement type IsPalindrome<T> to check whether a string or number is palindrome. For example: IsPalindrome<'abc'> // false IsPalindrome<121> // true 阅读全文
posted @ 2022-11-29 15:14 Zhentiw 阅读(9) 评论(0) 推荐(0) 编辑
摘要:Implement the type version of Object.fromEntries For example: interface Model { name: string; age: number; locations: string[] | null; } type ModelEnt 阅读全文
posted @ 2022-11-28 15:54 Zhentiw 阅读(21) 评论(0) 推荐(0) 编辑
摘要:Implement a generic GetReadonlyKeys<T> that returns a union of the readonly keys of an Object. For example interface Todo { readonly title: string rea 阅读全文
posted @ 2022-11-27 19:47 Zhentiw 阅读(117) 评论(0) 推荐(0) 编辑
摘要:import { Machine, actions } from "xstate"; const { raise } = actions; // Demostrate `raise` action const stubbornMachine = Machine({ id: "raisedmo", i 阅读全文
posted @ 2022-11-26 17:50 Zhentiw 阅读(35) 评论(0) 推荐(0) 编辑
摘要:Implement a generic IsRequiredKey<T, K> that return whether K are required keys of T . For example type A = IsRequiredKey<{ a: number, b?: string },'a 阅读全文
posted @ 2022-11-26 16:27 Zhentiw 阅读(15) 评论(0) 推荐(0) 编辑
摘要:Implement the generic ClassPublicKeys<T> which returns all public keys of a class. For example: class A { public str: string protected num: number pri 阅读全文
posted @ 2022-11-26 16:14 Zhentiw 阅读(10) 评论(0) 推荐(0) 编辑
摘要:The well known split() method splits a string into an array of substrings by looking for a separator, and returns the new array. The goal of this chal 阅读全文
posted @ 2022-11-25 15:15 Zhentiw 阅读(17) 评论(0) 推荐(0) 编辑
摘要:Drop the specified chars from a string. For example: type Butterfly = DropString<'foobar!', 'fb'> // 'ooar!' /* _____________ Your Code Here _________ 阅读全文
posted @ 2022-11-25 01:15 Zhentiw 阅读(14) 评论(0) 推荐(0) 编辑
摘要:Implement Camelize which converts object from snake_case to to camelCase Camelize<{ some_prop: string, prop: { another_prop: string }, array: [{ snake 阅读全文
posted @ 2022-11-24 15:16 Zhentiw 阅读(17) 评论(0) 推荐(0) 编辑
摘要:import { assign, createMachine } from "xstate"; type FetchStates = | { value: "idle"; context: FetchContext & { results: []; message: ""; }; } | { val 阅读全文
posted @ 2022-11-23 16:39 Zhentiw 阅读(50) 评论(0) 推荐(0) 编辑
摘要:import "./styles.css"; import React from "react"; import ReactDOM from "react-dom"; import { createMachine, assign } from "xstate"; import { useMachin 阅读全文
posted @ 2022-11-23 03:24 Zhentiw 阅读(57) 评论(0) 推荐(0) 编辑
摘要:Create a type-level function whose types is similar to Pinia library. You don't need to implement function actually, just adding types. Overview This 阅读全文
posted @ 2022-11-22 16:02 Zhentiw 阅读(31) 评论(0) 推荐(0) 编辑
摘要:import React, { useState } from "react"; type Base = { id: string } | string; type GenericSelectProps<TValue> = { formatLabel: (value: TValue) => stri 阅读全文
posted @ 2022-11-21 15:48 Zhentiw 阅读(15) 评论(0) 推荐(0) 编辑
摘要:Implement a type DeepPick, that extends Utility types Pick. A type takes two arguments. For example: type obj = { name: 'hoge', age: 20, friend: { nam 阅读全文
posted @ 2022-11-21 15:32 Zhentiw 阅读(35) 评论(0) 推荐(0) 编辑
摘要:const obj = { name: "John", age: 33, cars: [ { make: "Ford", age: 10 }, { make: "Tesla", age: 2 }, ], } as const; export type PathKeys<T> = T extends 阅读全文
posted @ 2022-11-21 00:24 Zhentiw 阅读(22) 评论(0) 推荐(0) 编辑
摘要:MethodDecorator @Log(level): Console log message @Pref: Mesure time function Log(level: LoggingLevel): MethodDecorator { return ( target: any, propert 阅读全文
posted @ 2022-11-20 18:01 Zhentiw 阅读(65) 评论(0) 推荐(0) 编辑
摘要:Create a type-safe string join utility which can be used like so: const hyphenJoiner = join('-') const result = hyphenJoiner('a', 'b', 'c'); // = 'a-b 阅读全文
posted @ 2022-11-19 20:13 Zhentiw 阅读(29) 评论(0) 推荐(0) 编辑
摘要:Implement a type, UnionToTuple, that converts a union to a tuple. As we know, union is an unordered structure, but tuple is an ordered, which implies 阅读全文
posted @ 2022-11-19 00:52 Zhentiw 阅读(41) 评论(0) 推荐(0) 编辑
摘要:Let's say you extends from a base class, you intent to override a method in base class class BaseCmp { showCmp() {} hideCmp() {} helperMethod() {} } c 阅读全文
posted @ 2022-11-18 15:31 Zhentiw 阅读(80) 评论(0) 推荐(0) 编辑
摘要:You can give Getter or Setter different types. So that Setter can accpet a wider range of types, while Getter can return a narrow type. class Thing { 阅读全文
posted @ 2022-11-18 15:22 Zhentiw 阅读(32) 评论(0) 推荐(0) 编辑
摘要:Implement a type LengthOfString<S> that calculates the length of the template string (as in 298 - Length of String): type T0 = LengthOfString<"foo"> / 阅读全文
posted @ 2022-11-18 02:37 Zhentiw 阅读(22) 评论(0) 推荐(0) 编辑
摘要:Typescript has NonNullable<T>, let's build a Nullable<T> type Nullable<T extends Record<PropertyKey, unknown>> = { [K in keyof T]: T[K] | null } type 阅读全文
posted @ 2022-11-17 15:16 Zhentiw 阅读(42) 评论(0) 推荐(0) 编辑
摘要:You can use `extends infer X` to assign the result of an expression to a variable type SomeFunction<U> = SuperHeavyComputation<U> extends infer Result 阅读全文
posted @ 2022-11-17 15:11 Zhentiw 阅读(8) 评论(0) 推荐(0) 编辑
摘要:The enum is an original syntax of TypeScript (it does not exist in JavaScript). So it is converted to like the following form as a result of transpila 阅读全文
posted @ 2022-11-16 22:35 Zhentiw 阅读(26) 评论(0) 推荐(0) 编辑
摘要:Similar to Array.findIndex: type FindIndex<T extends readonly any[], K, ACC extends unknown[] = []> = T extends readonly [infer F, ...infer RT] ? K ex 阅读全文
posted @ 2022-11-16 22:34 Zhentiw 阅读(29) 评论(0) 推荐(0) 编辑
摘要:type OnPropChangedMethods<T> = { [Key in keyof T & string as `${Key}Changed`]: (cb: (newValue: T[Key]) => void) => void } declare function makeWatched 阅读全文
posted @ 2022-11-16 15:02 Zhentiw 阅读(10) 评论(0) 推荐(0) 编辑
摘要:type Placeholder<T extends string> = T extends `${string}{${infer P}}${infer REST}` ? P | Placeholder<REST> : never; declare function format<S extends 阅读全文
posted @ 2022-11-16 14:48 Zhentiw 阅读(10) 评论(0) 推荐(0) 编辑
摘要:Implement a type FilterOut<T, F> that filters out items of the given type F from the tuple T. For example, type Filtered = FilterOut<[1, 2, null, 3], 阅读全文
posted @ 2022-11-16 02:19 Zhentiw 阅读(13) 评论(0) 推荐(0) 编辑
摘要:Convert a string literal to a number, which behaves like Number.parseInt. /* _____________ Your Code Here _____________ */ type ToNumber<S extends str 阅读全文
posted @ 2022-11-15 00:43 Zhentiw 阅读(16) 评论(0) 推荐(0) 编辑
摘要:The get function in lodash is a quite convenient helper for accessing nested values in JavaScript. However, when we come to TypeScript, using function 阅读全文
posted @ 2022-11-15 00:34 Zhentiw 阅读(14) 评论(0) 推荐(0) 编辑
摘要:Sometimes it's useful to detect if you have a value with any type. This is especially helpful while working with third-party Typescript modules, which 阅读全文
posted @ 2022-11-14 01:01 Zhentiw 阅读(43) 评论(0) 推荐(0) 编辑
摘要:Implement CamelCase<T> which converts snake_case string to camelCase. For example type camelCase1 = CamelCase<'hello_world_with_types'> // expected to 阅读全文
posted @ 2022-11-12 17:28 Zhentiw 阅读(21) 评论(0) 推荐(0) 编辑
摘要:Implement a type that adds a new field to the interface. The type takes the three arguments. The output should be an object with the new field. For ex 阅读全文
posted @ 2022-11-12 17:02 Zhentiw 阅读(14) 评论(0) 推荐(0) 编辑
摘要:import { z } from "zod"; export enum SUBTYPE { ABORT = "abort", START = "start", UPLOAD = "upload", LOADING = "loading", } export const TYPE = "print" 阅读全文
posted @ 2022-11-11 20:42 Zhentiw 阅读(30) 评论(0) 推荐(0) 编辑
摘要:Implement CapitalizeWords<T> which converts the first letter of each word of a string to uppercase and leaves the rest as-is. For example type capital 阅读全文
posted @ 2022-11-11 15:51 Zhentiw 阅读(21) 评论(0) 推荐(0) 编辑
摘要:Implement the advanced util type OptionalKeys<T>, which picks all the optional keys into a union. /* _____________ Your Code Here _____________ */ typ 阅读全文
posted @ 2022-11-11 00:11 Zhentiw 阅读(16) 评论(0) 推荐(0) 编辑
摘要:Implement the advanced util type RequiredKeys<T>, which picks all the required keys into a union. For example type Result = RequiredKeys<{ foo: number 阅读全文
posted @ 2022-11-11 00:07 Zhentiw 阅读(26) 评论(0) 推荐(0) 编辑
摘要:Implement the advanced util type GetOptional<T>, which remains all the optional fields For example type I = GetOptional<{ foo: number, bar?: string }> 阅读全文
posted @ 2022-11-10 22:03 Zhentiw 阅读(19) 评论(0) 推荐(0) 编辑
摘要:Implement the advanced util type GetRequired<T>, which remains all the required fields For example type I = GetRequired<{ foo: number, bar?: string }> 阅读全文
posted @ 2022-11-10 21:57 Zhentiw 阅读(29) 评论(0) 推荐(0) 编辑
摘要:type PathParams<S extends string> = S extends `/${string}/:${infer Param}/${infer REST}` ? Param | PathParams<`/${REST}`> : S extends `${string}/:${in 阅读全文
posted @ 2022-11-09 22:28 Zhentiw 阅读(10) 评论(0) 推荐(0) 编辑
摘要:Implement the advanced util type UnionToIntersection<U> For example type I = Union2Intersection<'foo' | 42 | true> // expected to be 'foo' & 42 & true 阅读全文
posted @ 2022-11-09 17:22 Zhentiw 阅读(27) 评论(0) 推荐(0) 编辑
摘要:Co-Variance: declare let b: string declare let c: string | number c = b // ✅ // string is a sub-type of string | number // all elements of string appe 阅读全文
posted @ 2022-11-09 17:18 Zhentiw 阅读(31) 评论(0) 推荐(0) 编辑
摘要:So what is a nake type? Example: type UnionToIntersection<T> = (T extends any ? (x: T) => any : never) //... We check Tin a sub-type condition, T exte 阅读全文
posted @ 2022-11-09 02:47 Zhentiw 阅读(17) 评论(0) 推荐(0) 编辑
摘要:Implement Replace<S, From, To> which replace the string From with To once in the given string S For example type replaced = Replace<'types are fun!', 阅读全文
posted @ 2022-11-08 14:45 Zhentiw 阅读(20) 评论(0) 推荐(0) 编辑
摘要:TypeScript 4.0 is recommended in this challenge Currying is the technique of converting a function that takes multiple arguments into a sequence of fu 阅读全文
posted @ 2022-11-08 02:57 Zhentiw 阅读(26) 评论(0) 推荐(0) 编辑
摘要:Implement a simpiled version of a Vue-like typing support. By providing a function name SimpleVue (similar to Vue.extend or defineComponent), it shoul 阅读全文
posted @ 2022-11-08 02:43 Zhentiw 阅读(33) 评论(0) 推荐(0) 编辑
摘要:This utility does not return a transformed type. Instead, it serves as a marker for a contextual this type. Note that the noImplicitThis flag must be 阅读全文
posted @ 2022-11-08 02:34 Zhentiw 阅读(63) 评论(0) 推荐(0) 编辑
摘要:We have the following code which has compile error: async function readData(event?: Event | unknown): Promise<void> { // ... let text: string | undefi 阅读全文
posted @ 2022-11-04 16:00 Zhentiw 阅读(20) 评论(0) 推荐(0) 编辑
摘要:Example: expect(contextSpy.sendEncodedMessage).toHaveBeenCalledWith( expect.objectContaining({ correlationId: expect.objectContaining({ operationId: ' 阅读全文
posted @ 2022-11-03 17:57 Zhentiw 阅读(20) 评论(0) 推荐(0) 编辑
摘要:original code: Using type guards type Ticket = { workshopId: string attendeeId: string discountCode?: string } // this is a type guard function functi 阅读全文
posted @ 2022-11-03 15:35 Zhentiw 阅读(22) 评论(0) 推荐(0) 编辑
摘要:Implement a generic DeepMutable which make every parameter of an object - and its sub-objects recursively - mutable. For example type X = { readonly a 阅读全文
posted @ 2022-11-03 15:11 Zhentiw 阅读(24) 评论(0) 推荐(0) 编辑
摘要:Convert a property of type literal (label type) to a primitive type. For example type X = { name: 'Tom', age: 30, married: false, addr: { home: '12345 阅读全文
posted @ 2022-11-02 14:31 Zhentiw 阅读(15) 评论(0) 推荐(0) 编辑
摘要:Please complete type IsInteger<T>, type T inherits from number, if T is an integer return it, otherwise return never. /* _____________ Your Code Here 阅读全文
posted @ 2022-11-01 16:20 Zhentiw 阅读(13) 评论(0) 推荐(0) 编辑
摘要:Get the middle element of the array by implementing a GetMiddleElement method, represented by an array If the length of the array is odd, return the m 阅读全文
posted @ 2022-11-01 16:04 Zhentiw 阅读(51) 评论(0) 推荐(0) 编辑

点击右上角即可分享
微信分享提示