挑战1

Author: jeffacode

src/06-challenges/29-infinite-scroll.problem.ts

@@ -1,7 +1,13 @@
 import { expect, it } from "vitest";
 import { Equal, Expect } from "../helpers/type-utils";
 
-const makeInfiniteScroll = (params: unknown) => {
+interface MakeInfiniteScrollParams<TRow> {
+  key: keyof TRow;
+  fetchRows: () => Promise<TRow[]>;
+  initialRows?: TRow[];
+}
+
+const makeInfiniteScroll = <TRow>(params: MakeInfiniteScrollParams<TRow>) => {
   const data = params.initialRows || [];
 
   const scroll = async () => {

src/06-challenges/29.2-dynamic-function-arguments.problem.ts

@@ -8,7 +8,10 @@ interface Events {
   focus: undefined;
 }
 
-export const sendEvent = (event: keyof Events, ...args: any[]) => {
+export const sendEvent = <EventType extends keyof Events>(
+  event: EventType,
+  ...args: Events[EventType] extends undefined ? [] : [Events[EventType]] // args的类型不是数组而是元组，元组长度代表参数个数，0就代表没有参数
+) => {
   // Send the event somewhere!
 };
 

src/06-challenges/29.5-pick.problem.ts

@@ -1,11 +1,12 @@
 import { expect, it } from "vitest";
 import { Equal, Expect } from "../helpers/type-utils";
 
-const pick = (obj: {}, picked: string[]) => {
+// TKey是泛型，它是union类型中的其中一个
+const pick = <TObj, TKey extends keyof TObj>(obj: TObj, picked: TKey[]) => {
   return picked.reduce((acc, key) => {
     acc[key] = obj[key];
     return acc;
-  }, {});
+  }, {} as Record<TKey, TObj[TKey]>);
 };
 
 it("Should pick the keys from the object", () => {

src/06-challenges/30-form-validator.problem.ts

@@ -1,23 +1,27 @@
 import { expect, it } from "vitest";
 import { Equal, Expect } from "../helpers/type-utils";
 
-const makeFormValidatorFactory = (validators: unknown) => (config: unknown) => {
-  return (values: unknown) => {
-    const errors = {} as any;
+const makeFormValidatorFactory =
+  <TValidatorKey extends string>(
+    validators: Record<TValidatorKey, (value: string) => string | void>
+  ) =>
+  <TConfigKey extends string>(config: Record<TConfigKey, TValidatorKey[]>) => {
+    return (values: Record<TConfigKey, string>) => {
+      const errors = {} as Record<TConfigKey, string | undefined>;
 
-    for (const key in config) {
-      for (const validator of config[key]) {
-        const error = validators[validator](values[key]);
-        if (error) {
-          errors[key] = error;
-          break;
+      for (const key in config) {
+        for (const validator of config[key]) {
+          const error = validators[validator](values[key]);
+          if (error) {
+            errors[key] = error;
+            break;
+          }
         }
       }
-    }
 
-    return errors;
+      return errors;
+    };
   };
-};
 
 const createFormValidator = makeFormValidatorFactory({
   required: (value) => {

src/06-challenges/32-data-fetcher-with-warning.problem.ts

@@ -1,14 +1,18 @@
 import { expect, it } from "vitest";
 import { Equal, Expect } from "../helpers/type-utils";
 
-const fetchData = async <TResult>(url: string): Promise<TResult> => {
+const fetchData = async <
+  TResult extends any = "You must pass a type argument to fetchData"
+>(
+  url: string
+): Promise<TResult> => {
   const data = await fetch(url).then((response) => response.json());
   return data;
 };
 
 it("Should fetch data from an API", async () => {
   const data = await fetchData<{ name: string }>(
-    "https://swapi.dev/api/people/1",
+    "https://swapi.dev/api/people/1"
   );
   expect(data.name).toEqual("Luke Skywalker");
 
@@ -19,6 +23,6 @@ it("Should force you to add a type annotation with a helpful error message", asy
   const data = await fetchData("https://swapi.dev/api/people/1");
 
   type tests = [
-    Expect<Equal<typeof data, "You must pass a type argument to fetchData">>,
+    Expect<Equal<typeof data, "You must pass a type argument to fetchData">>
   ];
 });