{"id":231601,"date":"2023-01-08T12:01:00","date_gmt":"2023-01-08T09:01:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=231601"},"modified":"2022-12-25T19:00:45","modified_gmt":"2022-12-25T16:00:45","slug":"typescript-valitud-atribuudid-on-valikulised-funktsiooniga-partial-omit","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/et\/typescript-valitud-atribuudid-on-valikulised-funktsiooniga-partial-omit\/","title":{"rendered":"TypeScript: valitud atribuudid on valikulised funktsiooniga Partial & Omit"},"content":{"rendered":"\n

Kui kasutate utiliidi Partial<\/code>t\u00fc\u00fcbi puhul, muudab see k\u00f5ik t\u00fc\u00fcbi atribuudid valikuliseks. Vaatame, kuidas saame selle utiliidi koostada teise utiliidiga Omit<\/code>, et muuta valikuliseks ainult teatud seda t\u00fc\u00fcpi atribuudid. L\u00f5puks loome utiliidi t\u00fc\u00fcbi, kasutades TypeScripti \u00fcldisi tegureid, et rakendada seda mis tahes soovitud t\u00fc\u00fcbi puhul.<\/p>\n

Muutke k\u00f5ik t\u00fc\u00fcbi atribuudid valikuliseks<\/h2>\n

Utiliidid<\/a>Partial<\/code> ja on TypeScripti valdkonnas Omit<\/code>h\u00e4sti tuntud, kuna need on v\u00e4ga mugavad nende kiireks t\u00fc\u00fcbile rakendamiseks ja p\u00f5him\u00f5tteliselt uue t\u00fc\u00fcbi hankimiseks. teisendab k\u00f5ik teatud t\u00fc\u00fcpi klahvid valikulisteks. Kui teil on n\u00e4iteks seda t\u00fc\u00fcpi:<\/a>Partial<T><\/code><\/p>\n

interface Band {\n    lead: string\n    guitar: string\n    bass: string\n    drums: string\n    keyboard: string\n}<\/code><\/pre>\n
k\u00f5ik omadused on n\u00f5utavad, kui millelgi on seda t\u00fc\u00fcpi. Kui soovite m\u00e4\u00e4rata sellise objekti:<\/p>\n
const FooFighters: Band = {\n    lead: 'Dave Grohl',\n    guitar: 'Pat Smears',\n    bass: 'Nate Mendel',\n    drums: 'Taylor Williams',\n}<\/code><\/pre>\n
see eba\u00f5nnestub, kuna sellel on keyboard<\/code>vara puudu. N\u00fc\u00fcd v\u00f5iksime selle atribuudi m\u00e4rkida valikuliseks ja TypeScript v\u00f5imaldab meil seda h\u00f5lpsalt teha. K\u00f5ige lihtsam viis seda teha on lisada selle nimele k\u00fcsim\u00e4rk. Sel juhul, kui algset t\u00fc\u00fcpi on v\u00f5imalik redigeerida, saate selle juurde minna ja seda j\u00e4rgmiselt muuta:<\/p>\n
interface Band {\n    lead: string\n    guitar: string\n    bass: string\n    drums: string\n    keyboard?: string\n}<\/code><\/pre>\n
Suurep\u00e4rane. N\u00fc\u00fcd \u00f5nnestub eelmine \u00fclesanne, sest keyboard<\/code>seda pole enam vaja. Aga mis siis, kui algset t\u00fc\u00fcpi pole mingil p\u00f5hjusel v\u00f5imalik muuta? Mida saate sellistel juhtudel kiiresti teha, on taotleda Partial<\/code>seda t\u00fc\u00fcpi:<\/p>\n
type NotAllTheBand = Partial\n\nconst FooFighters: NotAllTheBand = {\n    lead: 'Dave Grohl',\n    guitar: 'Pat Smears',\n    bass: 'Nate Mendel',\n    drums: 'Taylor Williams',\n}<\/code><\/pre>\n
See peatab k\u00f5igi omaduste j\u00f5ustamise, muutes need k\u00f5ik valikuliseks. V\u00f5ib-olla m\u00f5nikord tahame seda, aga mis siis, kui tahame teha ainult \u00fche atribuudi valikuliseks ja v\u00e4ltida algse t\u00fc\u00fcbi muutmist?<\/p>\n
Atribuutide eemaldamine t\u00fc\u00fcbist<\/h2>\n
Enne selle juurde asumist ja selle toimimise vaatamist vaatame veel \u00fcht utiliiti, mis meid selles aitab: Omit<\/code>. See utiliidit\u00fc\u00fcp eemaldab atribuudid t\u00fc\u00fcbilt, kus see on rakendatud. Kuigi Partial<\/code>see ei v\u00f5ta muid argumente peale t\u00fc\u00fcbi, Omit<\/code>v\u00f5tab t\u00fc\u00fcbi ja atribuudid, mida soovite eemaldada: Omit<T, K><\/code>.<\/p>\n
See ei Partial<\/code>muuda need valikuliseks: Omit<\/code>kustutab need t\u00fc\u00fcbist t\u00e4ielikult. Kui kasutate Partial<Band><\/code>, on see nii, nagu oleksite seda teinud:<\/p>\n
interface Band {\n    lead?: string\n    guitar?: string\n    bass?: string\n    drums?: string\n    keyboard?: string\n}<\/code><\/pre>\n
Kui aga kasutate Omit<Band, 'keyboard'><\/code>, siis tundub, nagu oleksite seda teinud:<\/p>\n
interface Band {\n    lead: string\n    guitar: string\n    bass: string\n    drums: string\n}<\/code><\/pre>\n
See hakkab n\u00fc\u00fcd aru saama, eks? Kas kujutate ette, mida saaksime TypeScriptis teha, kui meil on t\u00fc\u00fcp, mille k\u00f5ik algse atribuudid on seatud valikuliseks, ja teine \u200b\u200bt\u00fc\u00fcp, millel on ainult need omadused, mida me tahame n\u00f5uda? Kui vaid oleks v\u00f5imalus\u2026 neid t\u00fc\u00fcpe ristuda, eks?<\/p>\n
Ristuvad t\u00fc\u00fcbid<\/h2>\n
Jah, TypeScriptis saab kasutada ampersandi &<\/code>, t\u00fc\u00fcbi ristmiku operaatorit. See operaator, arvestades kahte t\u00fc\u00fcpi, konstrueerib uue, millel on omadused, mis kuuluvad m\u00f5lemasse t\u00fc\u00fcpi:<\/p>\n
interface SomeType {\n    propA: string\n    propB: number\n}\n\ninterface AnotherType {\n    propC: boolean\n    propD: Array\n}\n\ntype IntersectedType = SomeType & AnotherType\n<\/code><\/pre>\n
N\u00fc\u00fcdseks olete ilmselt sellest aru saanud: ristame osalise t\u00fc\u00fcbi ja t\u00fc\u00fcbi, kust eemaldasime m\u00f5ned selle omadused.<\/p>\n
Muuda t\u00fc\u00fcbi valitud atribuudid valikuliseks<\/h2>\n
Proovime seda m\u00f5testada. TypeScripti \u00f5ppimisel on oluline m\u00f5ista, mis meie t\u00fc\u00fcpidega toimub.<\/p>\n
Haarame t\u00fc\u00fcbi, mille k\u00f5ik omadused on m\u00e4\u00e4ratud valikuliseks t\u00e4nu sellele, et Partial<\/code>see on rakendatud. J\u00e4rgmisena ristame selle t\u00fc\u00fcbiga, mille atribuudid on eemaldanud Omit<\/code>. Vaatame n\u00e4idet:<\/p>\n
interface SomeType {\n    propA: string\n    propB: number\n}\n\ntype OptionalPropB = Partial & Omit<\/code><\/pre>\n
Meil on n\u00fc\u00fcd uus t\u00fc\u00fcp, ilma algset t\u00fc\u00fcpi muutmata, mis n\u00e4eb v\u00e4lja j\u00e4rgmine:<\/p>\n
type OptionalPropB = {\n    propA: string\n    propB?: string\n}<\/code><\/pre>\n
See juhtub seet\u00f5ttu, et me haarame omadusi propA?<\/code>ja propB?<\/code>t\u00fc\u00fcbi poolt toodetud t\u00fc\u00fcbilt Partial<\/code>ning l\u00f5ikuvad need propA<\/code>t\u00fc\u00fcbi poolt toodetud t\u00fc\u00fcbiga Omit<\/code>.<\/p>\n
TypeScripti \u00fcldised utiliidid<\/h2>\n
Ok, n\u00fc\u00fcd t\u00f6\u00f6tab meie uus t\u00fc\u00fcp ja meil saab olla ainult valitud atribuudid, mis on m\u00e4rgitud valikuliseks, ilma algset t\u00fc\u00fcpi muutmata. Siiski see rida<\/p>\n
type OptionalPropB = Partial & Omit<\/code><\/pre>\n
On liiga paljus\u00f5naline, iga kord kirjutamiseks \u00fcsna kole ja t\u00fc\u00fctu. Veelgi olulisem on see, et see ei t\u00f6\u00f6ta erineva t\u00fc\u00fcbi puhul, me peame selle iga kord uuesti kirjutama. Kas me saame selle l\u00fchemaks ja ilusamaks muuta ning mis tahes t\u00fc\u00fcpi jaoks toimima panna? Jah, TypeScript v\u00f5imaldab meil siin kasutada \u00fcldisi ja luua oma utiliidi t\u00fc\u00fcp:<\/p>\n
type Optional = Partial & Omit<\/code><\/pre>\n
Ja n\u00fc\u00fcd on meil oma TypeScripti utiliidit\u00fc\u00fcp, mis on juurutatud geneeriliste andmetega, mida saame kasutada valitud t\u00fc\u00fcbi atribuudid mis tahes t\u00fc\u00fcbi puhul valikuliseks muutmiseks. Saame seda kasutada j\u00e4rgmiselt:<\/p>\n
type TypeWithOptionalProp = Optional<\/code><\/pre>\n
M\u00e4rkate, et allkiri sarnaneb v\u00e4ljaj\u00e4tmisega: see utiliit v\u00f5tab t\u00fc\u00fcbi, millega t\u00f6\u00f6tada, ja atribuudid, mis muudetakse valikuliseks. Kui teil on rohkem, v\u00f5ite kasutada ameti\u00fchingu operaatorit:<\/p>\n
type TypeWithOptionalProps = Optional<\/code><\/pre>\n
L\u00f5pus\u00f5nad<\/h2>\n
N\u00fc\u00fcd saate selle \u00fcldise utiliidi t\u00fc\u00fcbi faili salvestada ja eksportida, et kasutada seda kogu rakenduses. Siin on link TypeScripti m\u00e4nguv\u00e4ljakule,<\/a> kuhu lisasin selle artikli koodi ja kommenteerisin seda, et saaksite n\u00e4ha, mis toimub, vaadates Partial<\/code>, Omit<\/code>ja meie \u00fcldist utiliidi t\u00fc\u00fcpi.<\/p>\n
Geneeriliste ravimite ja utiliitide maailm on TypeScriptis fantastiline. Astuge sellesse ja hakake katsetama!<\/p>\n
:  startfunction.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"
Kasutage funktsiooni Osaline ja v\u00e4ljaj\u00e4tmine, et muuta valikuliseks ainult teatud t\u00fc\u00fcbi atribuudid.<\/p>\n","protected":false},"author":1,"featured_media":236900,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[718,749,729,894,842,863],"tags":[1165],"class_list":["post-231601","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-arendaja","category-avatud-laehtekoodiga","category-javascript-4","category-kood","category-opetused","category-wordpress-4","tag-affiai-et"],"_links":{"self":[{"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/posts\/231601","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/comments?post=231601"}],"version-history":[{"count":0,"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/posts\/231601\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/media\/236900"}],"wp:attachment":[{"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/media?parent=231601"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/categories?post=231601"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/tags?post=231601"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}