{"id":94374,"date":"2025-01-24T12:13:09","date_gmt":"2025-01-24T08:43:09","guid":{"rendered":"https:\/\/nabfollower.com\/blog\/%d8%a7%db%8c%d8%ac%d8%a7%d8%af-%d9%be%d9%88%db%8c%d8%a7-%d8%b1%d8%a7%d8%a8%d8%b7-%d9%87%d8%a7-%d9%88-%d8%b7%d8%b1%d8%ad%d9%88%d8%a7%d8%b1%d9%87-%d9%87%d8%a7%db%8c-%d8%a7%d8%b9%d8%aa%d8%a8%d8%a7%d8%b1\/"},"modified":"2025-01-24T12:13:09","modified_gmt":"2025-01-24T08:43:09","slug":"%d8%a7%db%8c%d8%ac%d8%a7%d8%af-%d9%be%d9%88%db%8c%d8%a7-%d8%b1%d8%a7%d8%a8%d8%b7-%d9%87%d8%a7-%d9%88-%d8%b7%d8%b1%d8%ad%d9%88%d8%a7%d8%b1%d9%87-%d9%87%d8%a7%db%8c-%d8%a7%d8%b9%d8%aa%d8%a8%d8%a7%d8%b1","status":"publish","type":"post","link":"https:\/\/nabfollower.com\/blog\/%d8%a7%db%8c%d8%ac%d8%a7%d8%af-%d9%be%d9%88%db%8c%d8%a7-%d8%b1%d8%a7%d8%a8%d8%b7-%d9%87%d8%a7-%d9%88-%d8%b7%d8%b1%d8%ad%d9%88%d8%a7%d8%b1%d9%87-%d9%87%d8%a7%db%8c-%d8%a7%d8%b9%d8%aa%d8%a8%d8%a7%d8%b1\/","title":{"rendered":"\u0627\u06cc\u062c\u0627\u062f \u067e\u0648\u06cc\u0627 \u0631\u0627\u0628\u0637 \u0647\u0627 \u0648 \u0637\u0631\u062d\u0648\u0627\u0631\u0647 \u0647\u0627\u06cc \u0627\u0639\u062a\u0628\u0627\u0631 \u0633\u0646\u062c\u06cc \u062f\u0631 TypeScript \u0628\u0627 Yup"},"content":{"rendered":"
\n

\u062f\u0631 \u06cc\u06a9 \u067e\u0631\u0648\u0698\u0647 \u0627\u062e\u06cc\u0631\u060c \u0645\u0646 \u0628\u0627 \u0645\u0634\u06a9\u0644\u06cc \u0645\u0648\u0627\u062c\u0647 \u0634\u062f\u0645 \u06a9\u0647 \u062f\u0631 \u0622\u0646 \u0628\u0627\u06cc\u062f \u06cc\u06a9 \u0634\u06cc \u0631\u0627 \u0628\u0627 \u06a9\u0644\u06cc\u062f\u0647\u0627\u06cc\u06cc \u06a9\u0647 \u0628\u0647 \u0635\u0648\u0631\u062a \u067e\u0648\u06cc\u0627 \u062a\u0648\u0633\u0637 \u06cc\u06a9 \u0646\u0642\u0634\u0647 \u062b\u0627\u0628\u062a \u062a\u0639\u0631\u06cc\u0641 \u0634\u062f\u0647 \u0627\u0646\u062f \u062a\u0623\u06cc\u06cc\u062f \u06a9\u0646\u06cc\u0645 \u0648 \u062d\u062f\u0627\u0642\u0644 \u06cc\u06a9 \u06a9\u0644\u06cc\u062f \u062f\u0627\u0631\u0627\u06cc \u0645\u0642\u062f\u0627\u0631 \u0645\u0639\u062a\u0628\u0631\u06cc \u0628\u0627\u0634\u062f. <\/p>\n

\u0686\u0627\u0644\u0634<\/p>\n

\u0645\u0627 \u06cc\u06a9 \u0634\u06cc MetadataMap \u062f\u0627\u0634\u062a\u06cc\u0645 \u06a9\u0647 \u06a9\u0644\u06cc\u062f\u0647\u0627\u06cc \u0645\u0639\u062a\u0628\u0631 \u0648 \u0627\u0646\u0648\u0627\u0639 \u0645\u0631\u0628\u0648\u0637 \u0628\u0647 \u0622\u0646\u0647\u0627 \u0631\u0627 \u062a\u0639\u0631\u06cc\u0641 \u0645\u06cc \u06a9\u0631\u062f:<\/p>\n

const MetadataMap = {
userId: Number,
utmSource: String,
utmMedium: String,
utmCampaign: String,
} as const;<\/code><\/p>\n

\u0627\u0632 \u0627\u06cc\u0646 \u0646\u0642\u0634\u0647\u060c \u0645\u0627 \u0646\u06cc\u0627\u0632 \u062f\u0627\u0634\u062a\u06cc\u0645:<\/p>\n

    \n
  1. \u0628\u0647 \u0635\u0648\u0631\u062a \u067e\u0648\u06cc\u0627 \u06cc\u06a9 \u0631\u0627\u0628\u0637 TypeScript \u0627\u06cc\u062c\u0627\u062f \u06a9\u0646\u06cc\u062f \u062a\u0627 \u0627\u06cc\u0645\u0646\u06cc \u0646\u0648\u0639 \u0631\u0627 \u0627\u0639\u0645\u0627\u0644 \u06a9\u0646\u06cc\u062f.<\/li>\n
  2. \u06cc\u06a9 \u0637\u0631\u062d \u0627\u0639\u062a\u0628\u0627\u0631\u0633\u0646\u062c\u06cc Yup \u0627\u06cc\u062c\u0627\u062f \u06a9\u0646\u06cc\u062f \u06a9\u0647 \u0634\u06cc \u0631\u0627 \u0628\u0631 \u0627\u0633\u0627\u0633 \u0646\u0642\u0634\u0647 \u062a\u0623\u06cc\u06cc\u062f \u0645\u06cc \u06a9\u0646\u062f.<\/li>\n
  3. \u0627\u0637\u0645\u06cc\u0646\u0627\u0646 \u062d\u0627\u0635\u0644 \u06a9\u0646\u06cc\u062f \u06a9\u0647 \u062d\u062f\u0627\u0642\u0644 \u06cc\u06a9 \u06a9\u0644\u06cc\u062f \u062f\u0631 \u0634\u06cc \u062f\u0627\u0631\u0627\u06cc \u06cc\u06a9 \u0645\u0642\u062f\u0627\u0631 \u0645\u0639\u062a\u0628\u0631 \u0648 \u062a\u0639\u0631\u06cc\u0641 \u0646\u0634\u062f\u0647 \u0627\u0633\u062a.<\/li>\n
  4. \u0627\u0632 \u06a9\u0644\u06cc\u062f\u0647\u0627\u06cc \u06a9\u062f\u06af\u0630\u0627\u0631\u06cc \u0633\u062e\u062a \u0627\u062c\u062a\u0646\u0627\u0628 \u06a9\u0646\u06cc\u062f \u062a\u0627 \u0631\u0627\u0647 \u062d\u0644 \u0642\u0627\u0628\u0644 \u0646\u06af\u0647\u062f\u0627\u0631\u06cc \u0628\u0627\u0634\u062f.<\/li>\n<\/ol>\n

    \u0627\u0645\u0627\u060c TypeScript \u0627\u0646\u0648\u0627\u0639 \u0627\u0633\u062a\u0627\u062a\u06cc\u06a9 \u0631\u0627 \u062f\u0631 \u0632\u0645\u0627\u0646 \u06a9\u0627\u0645\u067e\u0627\u06cc\u0644 \u0627\u0639\u0645\u0627\u0644 \u0645\u06cc \u06a9\u0646\u062f\u060c \u062f\u0631 \u062d\u0627\u0644\u06cc \u06a9\u0647 Yup \u0627\u0639\u062a\u0628\u0627\u0631 \u0633\u0646\u062c\u06cc \u0632\u0645\u0627\u0646 \u0627\u062c\u0631\u0627 \u0631\u0627 \u06a9\u0646\u062a\u0631\u0644 \u0645\u06cc \u06a9\u0646\u062f.<\/p>\n

    \u0645\u0631\u062d\u0644\u0647 1: \u0627\u06cc\u062c\u0627\u062f \u0631\u0627\u0628\u0637<\/strong>
    \u0628\u0631\u0627\u06cc \u062a\u0648\u0644\u06cc\u062f \u0631\u0627\u0628\u0637 TypeScript \u0627\u0632 MetadataMap\u060c \u0627\u0632 \u0627\u0646\u0648\u0627\u0639 keyof \u0648 \u0646\u06af\u0627\u0634\u062a \u0634\u062f\u0647 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0631\u062f\u06cc\u0645. \u062f\u0631 \u0627\u06cc\u0646\u062c\u0627 \u0646\u062d\u0648\u0647 \u062a\u0639\u0631\u06cc\u0641 \u0622\u0646 \u0622\u0645\u062f\u0647 \u0627\u0633\u062a:<\/p>\n

    type Metadata = {
    [K in keyof typeof MetadataMap]: typeof MetadataMap[K] extends NumberConstructor
    ? number
    : string;
    };<\/code><\/p>\n

    \u0627\u06cc\u0646 \u0631\u0648\u06cc\u06a9\u0631\u062f \u062a\u0636\u0645\u06cc\u0646 \u0645\u06cc\u200c\u06a9\u0646\u062f \u06a9\u0647 \u0647\u0631 \u0628\u0647\u200c\u0631\u0648\u0632\u0631\u0633\u0627\u0646\u06cc \u0628\u0647 MetadataMap \u0628\u0647 \u0637\u0648\u0631 \u062e\u0648\u062f\u06a9\u0627\u0631 \u062f\u0631 \u0631\u0627\u0628\u0637 Metadata \u0645\u0646\u0639\u06a9\u0633 \u0645\u06cc\u200c\u0634\u0648\u062f. \u0628\u0647 \u0639\u0646\u0648\u0627\u0646 \u0645\u062b\u0627\u0644:<\/p>\n

    \/\/ Resulting Metadata interface:
    interface Metadata {
    userId?: number;
    utmSource?: string;
    utmMedium?: string;
    utmCampaign?: string;
    }
    <\/code><\/p>\n

    \u0645\u0631\u062d\u0644\u0647 2: \u0627\u06cc\u062c\u0627\u062f \u067e\u0648\u06cc\u0627 \u0637\u0631\u062d\u0648\u0627\u0631\u0647 Yup<\/strong><\/p>\n

    \u0645\u0627 \u0646\u06cc\u0627\u0632 \u062f\u0627\u0634\u062a\u06cc\u0645 \u06a9\u0647 \u0628\u0647 \u0635\u0648\u0631\u062a \u067e\u0648\u06cc\u0627 \u0637\u0631\u062d\u06cc Yup \u0627\u06cc\u062c\u0627\u062f \u06a9\u0646\u06cc\u0645 \u06a9\u0647 \u0628\u0627 \u06a9\u0644\u06cc\u062f\u0647\u0627 \u0648 \u0627\u0646\u0648\u0627\u0639 \u0645\u0648\u062c\u0648\u062f \u062f\u0631 MetadataMap \u0645\u0637\u0627\u0628\u0642\u062a \u062f\u0627\u0634\u062a\u0647 \u0628\u0627\u0634\u062f. \u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 Object.keys \u0648 \u06cc\u06a9 \u06a9\u0627\u0647\u0646\u062f\u0647\u060c \u0647\u0631 \u06a9\u0644\u06cc\u062f \u0631\u0627 \u0628\u0647 \u0627\u0639\u062a\u0628\u0627\u0631\u0633\u0646\u062c\u06cc Yup \u0645\u0631\u0628\u0648\u0637\u0647 \u0646\u06af\u0627\u0634\u062a \u06a9\u0631\u062f\u06cc\u0645:<\/p>\n

    const metadataSchema = Yup.object(
    Object.keys(MetadataMap).reduce((schema, key) => {
    const type = MetadataMap[key as keyof typeof MetadataMap];
    if (type === Number) {
    schema[key] = Yup.number().optional();
    } else if (type === String) {
    schema[key] = Yup.string().optional();
    }
    return schema;
    }, {} as Record)
    );<\/string><\/code><\/p>\n

    \u0627\u06cc\u0646 \u0631\u0648\u0634 \u06a9\u062f\u06af\u0630\u0627\u0631\u06cc \u0633\u062e\u062a \u0631\u0627 \u062d\u0630\u0641 \u06a9\u0631\u062f \u0648 \u062a\u0636\u0645\u06cc\u0646 \u06a9\u0631\u062f \u06a9\u0647 \u062a\u063a\u06cc\u06cc\u0631\u0627\u062a \u062f\u0631 MetadataMap \u0628\u062f\u0648\u0646 \u0628\u0647 \u0631\u0648\u0632 \u0631\u0633\u0627\u0646\u06cc \u062f\u0633\u062a\u06cc \u062f\u0631 \u0637\u0631\u062d \u0645\u0646\u0639\u06a9\u0633 \u0645\u06cc \u0634\u0648\u062f.<\/p>\n

    \u0645\u0631\u062d\u0644\u0647 3: \u0627\u0636\u0627\u0641\u0647 \u06a9\u0631\u062f\u0646 \u0642\u0627\u0646\u0648\u0646 “\u062d\u062f\u0627\u0642\u0644 \u06cc\u06a9 \u06a9\u0644\u06cc\u062f”.<\/strong><\/p>\n

    \u0686\u0627\u0644\u0634 \u0628\u0639\u062f\u06cc \u062d\u0635\u0648\u0644 \u0627\u0637\u0645\u06cc\u0646\u0627\u0646 \u0627\u0632 \u0627\u06cc\u0646 \u0628\u0648\u062f \u06a9\u0647 \u062d\u062f\u0627\u0642\u0644 \u06cc\u06a9 \u06a9\u0644\u06cc\u062f \u062f\u0631 \u0634\u06cc \u062f\u0627\u0631\u0627\u06cc \u06cc\u06a9 \u0645\u0642\u062f\u0627\u0631 \u062a\u0639\u0631\u06cc\u0641 \u0634\u062f\u0647 \u0628\u0627\u0634\u062f. \u0645\u0627 \u06cc\u06a9 \u0631\u0648\u0634 .test \u0631\u0627 \u0628\u0647 \u0637\u0631\u062d Yup \u0627\u0636\u0627\u0641\u0647 \u06a9\u0631\u062f\u06cc\u0645:<\/p>\n

    metadataSchema.test(
    \"at-least-one-key\",
    \"Metadata must have at least one valid key.\",
    (value) => {
    if (!value || typeof value !== \"object\") return false;
    const validKeys = Object.keys(MetadataMap) as (keyof typeof MetadataMap)[];
    return validKeys.some((key) => key in value && value[key] !== undefined);
    }
    );<\/code><\/p>\n

    \u0627\u06cc\u0646 \u0645\u0646\u0637\u0642:<\/p>\n

      \n
    1. \u0627\u0632 \u0645\u0639\u062a\u0628\u0631 \u0628\u0648\u062f\u0646 \u0634\u06cc \u0627\u0637\u0645\u06cc\u0646\u0627\u0646 \u0645\u06cc \u062f\u0647\u062f.<\/li>\n
    2. \u06a9\u0644\u06cc\u062f\u0647\u0627\u06cc \u0645\u0639\u062a\u0628\u0631 \u0631\u0627 \u0628\u0647 \u0635\u0648\u0631\u062a \u067e\u0648\u06cc\u0627 \u0627\u0632 MetadataMap \u0627\u0633\u062a\u062e\u0631\u0627\u062c \u0645\u06cc \u06a9\u0646\u062f.<\/li>\n
    3. \u062a\u0623\u06cc\u06cc\u062f \u0645\u06cc \u06a9\u0646\u062f \u06a9\u0647 \u062d\u062f\u0627\u0642\u0644 \u06cc\u06a9 \u06a9\u0644\u06cc\u062f \u062f\u0627\u0631\u0627\u06cc \u0645\u0642\u062f\u0627\u0631 \u0646\u0627\u0645\u0634\u062e\u0635\u06cc \u0627\u0633\u062a.<\/li>\n<\/ol>\n

      \u0646\u062a\u06cc\u062c\u0647
      \u062f\u0631 \u0627\u06cc\u0646\u062c\u0627 \u0646\u062d\u0648\u0647 \u0631\u0641\u062a\u0627\u0631 \u0637\u0631\u062d\u0648\u0627\u0631\u0647 \u0646\u0647\u0627\u06cc\u06cc \u0622\u0645\u062f\u0647 \u0627\u0633\u062a:<\/p>\n

      const exampleMetadata = {
      userId: undefined,
      utmSource: \"google\",
      extraField: \"invalid\", \/\/ This key is ignored.
      };
      <\/code>
      metadataSchema
      .validate(exampleMetadata)
      .then(() => console.log(\"Validation succeeded\"))
      .catch((err) => console.error(\"Validation failed:\", err.errors));<\/code><\/p>\n

      \u062f\u0631 \u0627\u06cc\u0646 \u0645\u062b\u0627\u0644\u060c \u0627\u0639\u062a\u0628\u0627\u0631\u0633\u0646\u062c\u06cc \u0645\u0648\u0641\u0642\u06cc\u062a \u0622\u0645\u06cc\u0632 \u0627\u0633\u062a \u0632\u06cc\u0631\u0627 utmSource \u06cc\u06a9 \u06a9\u0644\u06cc\u062f \u0645\u0639\u062a\u0628\u0631 \u0628\u0627 \u0645\u0642\u062f\u0627\u0631 \u062a\u0639\u0631\u06cc\u0641 \u0646\u0634\u062f\u0647 \u0627\u0633\u062a\u060c \u062d\u062a\u06cc \u0627\u06af\u0631 userId \u062a\u0639\u0631\u06cc\u0641 \u0646\u0634\u062f\u0647 \u0628\u0627\u0634\u062f \u0648 extraField \u0628\u062e\u0634\u06cc \u0627\u0632 MetadataMap \u0646\u06cc\u0633\u062a.<\/p>\n<\/p><\/div>\n","protected":false},"excerpt":{"rendered":"

      \u062f\u0631 \u06cc\u06a9 \u067e\u0631\u0648\u0698\u0647 \u0627\u062e\u06cc\u0631\u060c \u0645\u0646 \u0628\u0627 \u0645\u0634\u06a9\u0644\u06cc \u0645\u0648\u0627\u062c\u0647 \u0634\u062f\u0645 \u06a9\u0647 \u062f\u0631 \u0622\u0646 \u0628\u0627\u06cc\u062f \u06cc\u06a9 \u0634\u06cc \u0631\u0627 \u0628\u0627 \u06a9\u0644\u06cc\u062f\u0647\u0627\u06cc\u06cc \u06a9\u0647 \u0628\u0647 \u0635\u0648\u0631\u062a \u067e\u0648\u06cc\u0627 \u062a\u0648\u0633\u0637 \u06cc\u06a9 \u0646\u0642\u0634\u0647 \u062b\u0627\u0628\u062a \u062a\u0639\u0631\u06cc\u0641 \u0634\u062f\u0647 \u0627\u0646\u062f \u062a\u0623\u06cc\u06cc\u062f \u06a9\u0646\u06cc\u0645 \u0648 \u062d\u062f\u0627\u0642\u0644 \u06cc\u06a9 \u06a9\u0644\u06cc\u062f \u062f\u0627\u0631\u0627\u06cc \u0645\u0642\u062f\u0627\u0631 \u0645\u0639\u062a\u0628\u0631\u06cc \u0628\u0627\u0634\u062f. \u0686\u0627\u0644\u0634 \u0645\u0627 \u06cc\u06a9 \u0634\u06cc MetadataMap \u062f\u0627\u0634\u062a\u06cc\u0645 \u06a9\u0647 \u06a9\u0644\u06cc\u062f\u0647\u0627\u06cc \u0645\u0639\u062a\u0628\u0631 \u0648 \u0627\u0646\u0648\u0627\u0639 \u0645\u0631\u0628\u0648\u0637 \u0628\u0647 \u0622\u0646\u0647\u0627 \u0631\u0627 \u062a\u0639\u0631\u06cc\u0641 …<\/p>\n","protected":false},"author":2,"featured_media":94375,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"fifu_image_url":"https:\/\/media2.dev.to\/dynamic\/image\/width=1000,height=500,fit=cover,gravity=auto,format=auto\/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fw421sh8xynbsp0j7pat6.jpg","fifu_image_alt":"","footnotes":""},"categories":[339],"tags":[],"class_list":["post-94374","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-dev"],"_links":{"self":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/posts\/94374","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/comments?post=94374"}],"version-history":[{"count":0,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/posts\/94374\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/media\/94375"}],"wp:attachment":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/media?parent=94374"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/categories?post=94374"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/tags?post=94374"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}