業務に残された「良くない型」で考える「TypeScriptの難しさ」

3ZVTFJ4BKJLJ!TBKJLJY ۀ຿ʹ࢒͞Εͨʮྑ͘ͳ͍ܕʯͰߟ͑Δ ʮ5ZQF4DSJQUͷ೉͠͞ʯ

4BKJ3ZVTFJ4BKJLJ 'SPOUFOE%FWFMPQFSBU$ZCP[V JOD ❤54JO'&5PPMT 𝕏 !TBKJLJY

੒ޭʹύλʔϯ͸ͳ͍͕ ࣦഊʹ͸ύλʔϯ͕͋Δ Έ͍ͨͳ֨ݴ͋Δ͡Όͳ͍Ͱ͔͢

5ZQF4DSJQUͰߟ͑Δͱʁ ࣦഊΑ͘ͳ͍ͱ͞Ε͍ͯΔܕ΍ه๏ɾଥڠͨ͠ͱ͜Ζ ˣͱ͢Δͱ Ծઆ̍ʮ5ZQF4DSJQUͰଥڠɾϛεͪ͠ΌͬͯΔͱ͜Ζʹ͸ύλʔϯ͕͋Δʯ ˣ͞Βʹݴ͑͹ Ծઆ̎ʮ͜ͷύλʔϯ͕ͦ͜5ZQF4DSJQUͷ೉͠͞PSݶքͳͷͰ͸ʯ

ΞδΣϯμ w ʮۀ຿Ͱॻ͍ͯ͠·ͬͨྑ͘ͳ͍ܕɾଥڠͨ͠ܕΛऩूɾ෼ྨʯͯ͠ɺ w ͦΕΒΛʮύλʔϯԽɾ෼ੳ͢Δ͜ͱʯͰɺ w 5ZQF4DSJQUͷ೉͠͞ͷҰ୺ʹഭΖ͏ʂ ͱ͍͏τʔΫͰ͢ʂՃ͑ͯɺ w 5ZQF4DSJQUΛֶͿɾڭ͑Δɾ"*ʹॻ͔ͤΔࡍͷώϯτΛఏڙ͠ɺ
w ༷ʑͳϊ΢ϋ΢΍஌ݟ͕ू·Δ৔ͱ͍ͨ͠

஫ҙࣄ߲⚠ ʮ͜Μͳܕॻ͍ͯΔͳΜͯμϝʂʯͱݴ͏τʔΫͰ͸͋Γ·ͤΜʂ େࣄ w ୭ͩͬͯ޷ΜͰas@ts-ignoreͯ͠ΔΘ͚͡Όͳ͍ w ࣗ෼ͩͬͯଟগ͸ͨ͜͠ͱ͋ΔͰ͠ΐʁ ڳʹखΛ౰ͯͳ͕Β
্ڃऀͷํʹͱͬͯ͸౰ͨΓલͷ͜ͱ΋ଟ͍͔΋͠Ε·ͤΜ͕ɺ w ॳ৺Λࢥ͍ग़ͨ͠Γɺ΋ͬͱ͍͍ղܾࡦΛߟ͑ͯΈͨΓ w νʔϜͰͷӡ༻ɾޙਐҭ੒ɾ"*޲͚%PDͳͲ׆͔ͤΔͱ͜͸͋Δ͸ͣ

໨࣍ ϓϩμΫτͷʮྑ͘ͳ͍ܕʯΛ୳ͯ͠ΈΑ͏ සग़ྫɾ೉͍͠ྫͷ঺հ ʮྑ͘ͳ͍ܕʯΛ෼ྨ͢Δ ஌ݟ͔Βӡ༻΁

Ͳ͜·ͰΛྑ͘ͳ͍ܕͱ͢Δ͔ Ұൠతʹྑ͘ͳ͍ͱ͞ΕΔ΋ͷ w anyܕ w asʹΑΔڧ੍Ωϟετ w @ts-ignoreʹΑΔܕνΣοΫͷແࢹ ্ه΄ͲͰ͸ͳ͍͕ྑ͘ͳ͍ͱ͞ΕͯΔ w
ࡶͳܕΨʔυؔ਺

ࠓճର৅ʹͨ͠ίʔυϕʔεͷಛ௃ Ұൠత 3FBDU54ͷҰൠతͳ$MJFOU4JEFΞϓϦߏ੒ ෳࡶͳ'PSNը໘ ೖྗͨ͠σʔλ Ϩίʔυ ͷՄࢹԽ w Ϣʔβʔ͕༷ʑͳ'JFMEͰߏஙͨ͠'PSNΛ࣮ࡍʹಈ࡞ͤ͞Δ w
ೖྗͨ͠σʔλͷৄࡉදࣔ΍ҰཡɾάϥϑදࣔɾߜΓࠐΈͳͲ͕Ͱ͖Δ #&͔Βͷσʔλ͸جຊతʹ;PEͰ7BMJEBUJPOͯ͠Δ ஌ͬͯΔਓ޲͚LJOUPOFͷΞϓϦը໘ͷ3FBDU൛

ࠓճର৅ʹͨ͠ίʔυϕʔεͷಛ௃ ಛघ ΋͔ͨ͠͠ΒҰൠతͰ͸ͳ͍͔΋͠Εͳ͍ཁ݅ w 'PSN͕ͦΕͳΓʹෳࡶ w fi FMEͷछྨׂ͕ͱଟ͍ छྨҎ্
w ςʔϒϧͷதʹ fi FMEΛ഑ஔͰ͖ΔͷͰ̍ஈͷ࠶ىతͳߏ଄͕͋Δ w ੡඼Λ+4Ͱॻ͍ͨ6TFS4DSJQU1MVHJOͰΧελϚΠζͰ͖Δػߏ w Ϣʔβʔೖྗͱ#&͔ΒͷσʔλҎ֎ʹ΋৴པͰ͖ͳ͍ڥք͕͋Δ w ྫ Ϣʔβ͔Β౉͞Εͨ$BMMCBDLͷݺͼग़͠ͱ͔

୳͠ํ ୳ͤ͞ํ ࠓͷ࣌୅͸"*͕͋ΔͷͰੵۃతʹ׆༻͠Α͏ʂ ҎԼΛूதͯ͠໢ཏతʹ୳ͤͨ͞ w @ts-ignore@ts-expect-error w asΩϟετ as constas
unknown as౳Λআ֎ w ܕΨʔυؔ਺value is X ͋Δఔ౓ࡉ͔͘෼ྨͤ͞Δˠ෼ྨ͝ͱʹ࣮ࡍʹίʔυΛݟͯ൑அ

ࠓճ͸̓ͭසग़ྫΛ঺հ ಛघͳ΋ͷɾϨΞ͗͢Δ΋ͷΛൈ͍ͯ̓ͭͷසग़ྫΛ঺հ͢Δ w ͦΕͧΕʹରͯ͠ߟ͑ΒΕΔରࡦ΋ซͤͯ ਐΊ΍͍͢Α͏ʹେ͖̏ͭ͘ͷύλʔϯʹ෼ྨͯ͠঺հ w ͩΜͩΜͱॳาతˠ΍΍͍͜͠ʹͳ͍͖ͬͯ·͢ ˞͋͘·ͰࣗνʔϜͷ෼ੳ݁ՌͳͷͰѱ͔͠Βͣ

සग़ύλʔϯ ಈతͳڥքͰͷܕམͪ

සग़%0.&WFOUDBUDI F %0.&WFOUCVCCMJOHͷͨΊʹͲ͏ͯ͠΋ܕ͸޿͍ &SSPSΠϯελϯε+4ͷ࢓্༷string΋౤͛ΕΔͷͰunknown button.addEventListener('click', (e) => { const target
= e.target as HTMLButtonElement; // ← as }); try { ... } catch (e) { console.error((e as Error).message); // ← as }

සग़%0.&WFOUDBUDI F վળҰखؒͰߜΓࠐΊΔͷͰؤுΖ͏ w %0.&WFOUDVSSFOU5BSHFUΛ࢖͏e instanceofͰOBSSPX w DBUDI F ܕΨʔυΛڞ௨Խͯ͠΋Α͍
export function isError(value: unknown): value is Error { return value instanceof Error; }

සग़VOLOPXOͰBTͯ͠·͏ ͱΓ͋͑ͣͦΕͬΆ͍ܕ΄͍͠ˠVOLOPXOؚ͕·Ε͍ͯΔBTͪ͠ΌͬͯΔ w ϓϩμΫγϣϯίʔυҎ֎ UFTUͱ͔ ͩͱ͋ͬͨΓ͢Δ վળܕΨʔυΛॻ͜͏ w ϓϩμΫγϣϯίʔυͷ৔߹ɺͦ͜ΛڥքʹӨڹ͕೾ٴ͢Δ w
νʔϜ PS"*%PD ͰͪΌΜͱن໿ʹ͢Δͷ΋͋Γ const value = (config as Record<string, unknown>)[key];

සग़จࣈྻˠ#SBOEFEܕϦςϥϧܕͷݶք ҎԼͷΑ͏ͳΑΓݫ͍͠ߜΓࠐΈ͸σϑΥϧτͰ͸Ͱ͖ͳ͍ w ͍ΘΏΔ#SBOEFEܕͷΑ͏ͳಠࣗఆٛͷΑΓݫ͍͠ܕ w SVOUJNFͷϝιου͸جຊจࣈྻϦςϥϧܕ·Ͱ͸ߜΓࠐΊͳ͍ if (regex.test(rawString)) { return
rawString as DateString; // ← as } const lower = value.toLowerCase(); // → string return lower as LowerValue; // ← as

සग़จࣈྻˠ#SBOEFEܕϦςϥϧܕͷݶք վળܕΨʔυΛॻ͘IFMQFSͷಋೖ w regex.testͳͲܕΨʔυؔ਺Λॻ͔͘͠ͳ͍ w -PXFS$BTFͳͲͷϢʔςΟϦςΟ͕͋ΔIFMQFSʹͪ͠Ό͏ toLower<T extends string>(s: T):
Lowercase<T>

ύλʔϯ̍ͷ·ͱΊ w ೖྗɾΤϥʔͳͲͷಈతڥքͰ͸VOLOPXOͳܕ΍ຊདྷΑΓ޿͍ܕ͕ݱΕΔ w ·ͨඪ४ϝιουͰ͸QSJNJUJWFͳܕҎ্ͷߜΓࠐΈ͸೉͍͠ w ͜ͷΑ͏ͳBT͸ʮܕΨʔυPSϔϧύʔݸʯͰ͋Δఔ౓҆શʹফͤΔ w ͲͪΒ͔ͱ͍͏ͱਓతͳཧ༝͕ଟ͍ w
ʮ໘౗Ͱʯݟա͝͞Εͨ w ࢑ఆͷ͸ͣͷ΋ͷ͕࢒ͬͯ͠·ͬͨ

සग़ύλʔϯ ಈతͳ഑ྻɾ0CKFDUม׵

සग़"SSBZGJMUFSJODMVEFTJT"SSBZ "SSBZͷඪ४ϝιουͰ͋Δincludes΍isArrayͳͲ͸·ͩෆศ͕͞࢒Δ w JODMVEFT͸SFBE0OMZ"SSBZͩͱϦςϥϧܕΛڧ੍ w ͔ͱ͍ͬͯɺ௨ৗͷϓϦϛςΟϒͳ഑ྻʹ͢Δͱ౰ͨΓલʹܕ͕མͪΔ const STATES = ['a',
'b'] as const; STATES.includes(state); // state: string ͰܕΤϥʔ STATES.includes(state as 'a' | 'b'); // ← ಺ଆͰ as const fieldTypes : string = ['a', 'b']; return fieldTypes.includes(field.type) ? {...field} as Field : null // type͸stringͷ··ͳͷͰ

සग़"SSBZGJMUFSJODMVEFTJT"SSBZ w JT"SSBZ͸ཁૉܕΛ࣋ͨͳ͍ ˠ͜ͷଞɺ"SSBZͷඪ४ϝιου͕Ͳ͜·ͰߜΓࠐΜͰ͘ΕΔ͔͸஫ҙ͕ඞཁ Array.isArray(value) ? (value as JsApiUserData[]) :
[]

සग़"SSBZGJMUFSJODMVEFTJT"SSBZ ͱ͸͍͑গͣͭ͠ਪ࿦͸վળ͞Ε͍ͯΔ w 54Ͱ fi MUFS͕վળ͞Εͨͷͱ͔͸࿩୊ʹͳͬͨ w FWFSZ΋ಉ༷ʹվળͯ͠Δ [1, 2,
null].filter((x) => x !== null); // ~5.4: (number | null)[] // 5.5~: number[] ← inferred type predicate

සग़"SSBZGJMUFSJODMVEFTJT"SSBZ վળϔϧύʔΛ࡞ΔܕΨʔυΛॻ͘ w JODMVEFTϔϧύʔΛॻ͍ͯͦΕΛ࢖͏Α͏ʹ͢Δ w JT"SSBZ.every(isXXX)Ͱཁૉ୯ҐͷܕΨʔυΛॻ͘ function includesType<T extends readonly
string[]>( arr: T, v: string ): v is T[number] { return arr.includes(v); } const users = Array.isArray(value) && value.every(isUser) ? value : [];

සग़"SSBZGJMUFSJODMVEFTJT"SSBZ վળϥΠϒϥϦͷར༻΋ߟ͑ͯΈΔ w UTSFTFUͱ͍͏ඪ४ϝιουΑΓڧݻͳIFMQFSΛఏڙ͢ΔϥΠϒϥϦ΋͋Δ w IUUQTHJUIVCDPNNBUUQPDPDLUTSFTFU import '@total-typescript/ts-reset/array-includes'; const users
= ['matt', 'sofia', 'waqas'] as const; // .includes ͸୯ʹstringΛظ଴͢ΔΑ͏ʹͳΔ users.includes('bryan');

සग़0CKFDUGSPN&OUSJFT0CKFDULFZT ߏ଄త෦෼ܕͷݶքͱͯ͠0CKFDU૸ࠪܥͷϝιου͸໭Γ஋͕ྼԽ͢Δ w ˠܕʹॻ͍͍ͯͳ͍ΩʔΛ࣋ͭPCKFDU΋ಉ͡ܕͱͯ͠௨Γ͏Δ const obj = Object.fromEntries(entries); // ↑
Record<string, V> (ΩʔϦςϥϧ͕ফ͑Δ) Object.keys(record).forEach((k) => { record[k]; // ← k ͸ stringɺkeyof typeof record ʹͳΒͳ͍ });

සग़0CKFDUGSPN&OUSJFT0CKFDULFZT վળIFMQFSΛ࡞Γ݈ͭͭશੑ͸ࣗ෼ͨͪͰอূ͢Δ w GSPN&OUSJFTΩʔͱͷηοτͰอূ͢ΔIFMQFSΛ࡞Γͭͭݕূ w LFZTܕҾ਺͔Βਪ࿦͢ΔIFMQFS࡞Γͭͭݕূ ͲͪΒʹͤΑɺ҆શੑ͸ϢʔβͰอূ͢Δ͔͠ͳ͍ fromEntriesTyped<K, V>(entries: [K,
V][]): Record<K, V> objectKeys<T>(o: T): (keyof T)[] // (தͰ as)

ύλʔϯ̎ͷ·ͱΊ w "SSBZ0CKFDUͷඪ४ϝιουʹؔͯ͠͸ɺͲ͏ͯ͠΋୯ମͰղܾ͸೉͍͠ w ඪ४ϝιουʹର͢Δઃܭ൑அ w ߏ଄త෦෼ܕʹΑΔݶք w ࣗ࡞ϔϧύʔ΍ܕΨʔυͰ͋Δఔ౓ޮ཰తʹ҆શଆʹ͸౗ͤΔ w
Α͘࢖͏΋ͷ͸ڞ௨Խ͓ͯ͘͠ͱΈΜͳ͕Ըܙʹ༬͔ΕΔ w ͨͩ͠OBSSPXJOH΍ܕΨʔυ͸Ϣʔβʔ࣍ୈͳ෦෼͕େ͖͍ͷͰ৻ॏʹ

සग़ύλʔϯ VOJPOͷѻ͍ͷ೉͠͞

͓͞Β͍EJTDSJNJOBUFEVOJPO 54ʹ͸EJTDSJNJOBUFEVOJPOͱ͍͏ڧྗͳਪ࿦ػೳ͕͋Δ w VOJPOʹଐ͢Δ0CKFDUʹڞ௨͢ΔϓϩύςΟͰVOJPOΛߜΓࠐΊΔػೳ type Field = | { type:
'TEXT'; value: string } // ← discriminant: type | { type: 'NUMBER'; value: number }; function show(f: Field) { if(f.type === "TEXT") return f.value; // string ʹ narrow }

සग़ରԠ͍ͤͨ͞஋Λผʹ૊Έཱͯͯ͠·͏ ຊདྷ̍ର̍ͰରԠ͍ͤͨ͞ܕΛผʑʹ࡞੒ͯ͠͠·͏ w ޙ͔ΒͦΕͧΕͷରԠؔ܎Λิ׬͢Δ͜ͱ͸Ͱ͖ͳ͍ w ܕͱͯ͠͸୯७ͳ௚ੵʹͳͬͯ͠·͏ w const fieldType =
MAPPING[type]; // ผͷࣜͰܭࢉ const fieldValue = convertValue(fieldValue); // ผͷࣜͰܭࢉ const field = { type: jsApiFieldType, value: jsApiValue, } as Field; // Fieldʹas͢Δ͔͠ͳ͘ͳΔ

සग़ରԠ͍ͤͨ͞஋Λผʹ૊Έཱͯͯ͠·͏ TUSJOH OVNCFS 5&95 ✅ /6.#&3 ✅ TUSJOH OVNCFS 5&95
✅ ❌ /6.#&3 ❌ ✅ {type:'TEXT',value:string} {type:'NUMBER',value:number} type: 'TEXT' | 'NUMBER', value: string | number ✅ཉ͔ͬͨ͠ܕ EVOJPO ❌࣮ࡍͷܕ ௚ੵ

සग़ରԠ͍ͤͨ͞஋Λผʹ૊ΈཱͯΔ վળઃܭ্ߏஙΛผʑʹ͠ͳ͍ w GBDUPSZͷΑ͏ͳܗͰରԠ͍ͤͨ͞΋ͷΛηοτͰߏங͠੾Δ function createField(typeInput,fieldInput): Field { switch (typeInput)
{ case 'TEXT': return { type: 'TEXT', value: String(fieldInput) }; // ... } }

සग़Ҿ਺ͷ6OJPO͔ΒฦΓ஋Λਪ࿦ͮ͠Β͍ ʮҾ਺ͷܕʹԠͯ͡ฦΓ஋ͷܕΛม͑Δؔ਺ʯΛδΣωϦοΫʹ͸ॻ͚ͳ͍ w 5<UZQF>ͷΑ͏ͳδΣωϦοΫͳJOEFYFEBDDFTT͸VOJPOʹͳΔ w ˠؔ਺ຊମͰ͸ʮ5͕'JFME"͔'JFME#͔ʯ͕ఆ·Βͳ͍ function validate<T extends FieldA
| FieldB>( value: unknown, type: T['type'] ): Result<T> { return ok({ value: String(value), type } as T); // ^^^^ ← as }

සग़Ҿ਺ͷ6OJPO͔ΒฦΓ஋Λਪ࿦ͮ͠Β͍ ղܾPWFSMPBEؔ਺ͰͳΜͱ͔͢Δ ͱ͸͍͑ɺύλʔϯ͕૿͑Δͱ৑௕Τϥʔ͕গ͠Θ͔Γʹ͍͘ function validate(v: unknown, t: 'TEXT' ): Result<FieldA>;
function validate(v: unknown, t: 'NUMBER'): Result<FieldB>; function validate(v: unknown, t: string): Result<FieldA | FieldB> { return ok({ value: String(v), type: t }); }

සग़ δΣωϦοΫͳҾ਺ͰϋϯυϥΛݺͿ ҎԼͷΑ͏ͳ࢓૊ΈΛ࡞Δ͜ͱΛ૝૾ͯ͠΄͍͠ w LFZΛࢦఆͯ͠ϋϯυϥʔؔ਺Λಈతʹొ࿥Ͱ͖ɺݺͼग़͞ΕΔ w ྫFWFOU໊Λࢦఆͯ͠ΠϕϯτϋϯυϥΛొ࿥ w LFZʹԠͯ͡ҎԼ͕มΘΔ w
ϋϯυϥʔʹ౉͢Ҿ਺ w ϋϯυϥʔ͕ฦ͢͸ͣͷฦΓ஋

සग़ δΣωϦοΫͳҾ਺ͰϋϯυϥΛݺͿ ͬ͘͟Γ࣮૷ͯ͠ΈΔͱ͜͏ͳΓͦ͏ type Apis = { "getId" :() =>string
.... } const callHandler = async <K extends keyof Apis>({ apiPath, // K apiArgs // Parameters<Apis[K]> }: JsApiCallData[K]) => { const handler = apiHandlers[apiPath]; // Apis[K] return await handler(...apiArgs); // Τϥʔ !! };

සग़ δΣωϦοΫͳҾ਺ͰDBMMCBDLΛݺͿ ͳΜͰΤϥʔʹͳͬͯΔͷ͔ w ࣮૷ΛݟΔͱ w LFZ͔ΒҾ͍͖ͯͨϋϯυϥͷܕ͸֤ϋϯυϥ ؔ਺ ͷ6OJPOApis[K] w
Ҿ਺͸ϋϯυϥ͕ظ଴͢ΔҾ਺ͷ6OJPOParameters<Apis[K]> w ొ࿥͞Εͨϋϯυϥ͕ड͚෇͚ΔҾ਺ܕશҾ਺ܕͷJOUFSTFDUJPO ൓ม w ʮશҾ਺ܕͷJOUFSTFDUJPOʯWTʮϋϯυϥ͕ظ଴͢ΔҾ਺ͷ6OJPOʯ w ˠΤϥʔʂ

සग़ δΣωϦοΫͳҾ਺ͰDBMMCBDLΛݺͿ ͜Ε΋0WFSMPBEͳΒղܾग़དྷΔ͕ w "1*΍Πϕϯτ͕૿͑ͨΒͦͷ෼શ෦0WFSMPBEॻ͘ʁˠݱ࣮త͡Όͳ͍ w ͔ͱ͍ͬͯઃܭͰಀ͛Δͷ΋೉͍͠ ͜͜ʹؔͯ͠͸͋Δఔ౓ׂΓ੾Δඞཁ͕͋Δͷ͔΋͠Εͳ͍

DPSSFMBUFEVOJPOTʹΑΔվળ VOJPOͷ݁ͼ͖ͭΛҡ࣋͢ΔΑ͏ͳਪ࿦ͷվળ͸ঃʑʹͳ͞Ε͍ͯΔ w W*OEFYFE"DDFTT*OGFSFODF%FTUSVDUVSFE%JTDSJNJOBUFE6OJPO %FQFOEFOU1BSBNFUFST w WPCK<MJUFSBM,FZ>PCK<VOJRVFTZNCPM>ͷOBSSPXJOH w W$POTUBOU*OEFYFE"DDFTTOBSSPXJOH*OGFSSFE5ZQF1SFEJDBUFT w
WδΣωϦοΫ൑ผϢχΦϯͷOBSSPXJOH֦ு

ύλʔϯ̏·ͱΊ w σʔλͷ࡞੒ʹ͓͍ͯEVOJPOʹͰ͖ͳ͍ͷ͸ઃܭͷ໰୊ w ରԠ͍ͤͨ͞ܕ͸ৗʹҰॹʹੜ੒͢Δ͜ͱΛ๨Εͳ͍ w ޙ൒ͷ6OJPOͷਪ࿦ͷ໰୊͸ϔϧύʔ΍ΨʔυͰ΋ղܾ͕೉͍͠ w ಛʹؔ਺ͷབྷΉ΋ͷɾϋϯυϥʔύλʔϯͳͲ͸೉͍͠ w
গͣͭ͠վળ͍ͯͬͯ͠ΔͷͰࠓޙʹظ଴

෼ྨͷ࣠Λߟ͑Δ ࠓճ͸ʮͲ͏ରࡦ͢Δ͔ʯΛ΋ͱʹҎԼͷ̎ͭͷ࣠Ͱߟ͑ͯΈΔ w ڥքͰى͖ͯΔͷ͔಺෦Ͱى͖ͯΔͷ͔ w ֎෦ͱͷڥքʹΑΔ΋ͷWT಺෦Ͱىͬͯ͜͠·ͬͯΔ͜ͱ w ҆શݍʹԡ͠໭ͤΔ͔ w ܕΨʔυ΍ϔϧύʔͳͲͰ҆શݍʹԡ͠໭ͤΔWT೉͍͠

ࠓճ঺հͨ͠ύλʔϯΛ෼ྨͯ͠ΈΔ ԡ͠໭ͤΔ ԡ͠໭ͤͳ͍ ڥք༝དྷ ಺෦༝དྷ " ࣮͸͸͋·Γͳ͍ $ # w
%0.&WFOUDBUDI w จࣈྻˠ#SBOEFE w VOLOXPOͰͷBT w fi MUFSJODMVEFT wGSPN&OUSJFT w%JTDSJNJOBUFEVOJPOͷੜ੒ w Ҿ਺ʹԠͨ͡ฦΓ஋ਪ࿦ w δΣωϦοΫͳҾ਺ͱϋϯυϥʔ

ͦΕͧΕ΁ͷॲํᝦ "ڥք༝དྷºԡ͠໭ͤΔ w ˠεΩʔϚ ;PE౳ ΛؚΉܕΨʔυ͕ใΘΕΔ w ˠʮܕΨʔυΛॻ͚Δ৔ॴͰ͸ॻ͘ʯΛνʔϜن໿ʹ #಺෦ىҼºԡ͠໭ͤΔ w
ˠνʔϜͰܕϔϧύʔɾܕΨʔυूΛ࣋ͭ w ˠઃܭू໿ͱ%3:ͷτϨʔυΦϑ͸ݟۃΊΔඞཁ͋Γ

ͦΕͧΕͷॲํᝦ $಺෦ىҼºԡ͠໭ͤͳ͍ w ͋Δఔ౓ఘΊΔ͔͠ͳ͍͕ w ˠہॴͰBT@ts-expect-error ཧ༝Λίϝϯτ w ˠ54ͷਐԽΛ௥͏ DPSSFMBUFEVOJPOT౳

ରࡦ͸Θ͔͚ͬͨͲ Ͳ͏΍ͬͨΒؾ͚ͮΔʁ

ةͳ͍κʔϯͷΞϯςφΛݚ͗੅·͢ ࠓͦ͜ʮ͜͜͸ةͳͦ͏ʯͱ͍͏ײ֮͸େࣄ w ίʔυϨϏϡʔͰͷࢦఠ"*΁ͷࢦࣔ w νʔϜ΁ͷڭҭɾΦϯϘʔσΟϯά w ࣗ෼͕ࡶͳBTJHOPSFΛॻ͖ͦ͏ͳ࣌ͷϒϨʔΩ w ͦ΋ͦ΋ઃܭ͔࣌Β54ʹ༏͍͠σʔλʹͳͬͯΔ͔
ˠઌճΓͰ͖Δ΄Ͳ҆શͳӡ༻ɾઃܭʹͭͳ͕Δ

ࠓճͷ෼ੳ͔ΒಘΒΕͨνΣοΫϦετ ͜ΕΒʹ֘౰͢ΔίʔυΛॻ͍ͯΔɾݟͨ৔߹͸ཁ஫ҙαΠϯ🚨 ☑︎ ֎෦ͱͷڥքΛލ͍Ͱ͍Δ͔ʁ ☑︎ ഑ྻɾΦϒδΣΫτͷಈతม׵Λܦ༝͍ͯ͠Δ͔ʁ ☑︎ UZQFͱWBMVFΛผͷࣜͰ૊Έཱ͍ͯͯͳ͍͔ ☑︎
࢖͏ଆͷܕΛؔ਺಺ͰδΣωϦοΫͳܕ͔Β֬ఆͤ͞Α͏ͱͯ͠Δʁ ☑︎ ಉ͡ଥڠ͕܁Γฦ͞Ε͍ͯͳ͍͔ ˞΋ͪΖΜ͜Ε͕શͯͰ͸ͳ͍

໨࣍ ϓϩμΫτͷʮྑ͘ͳ͍ܕʯΛ୳ͯ͠ΈΑ͏ සग़ྫɾ೉͍͠ྫͷ঺հ ʮྑ͘ͳ͍ܕʯΛ෼ྨ͢Δ ӡ༻΁

ͦ͏͸͍ͬͯ΋ Ͳ͏΍ͬͯӡ༻͢Δʁ

ӡ༻ʹ޲͚ͯ MJOUͰن໿Խ͢Δ w CBOUTDPNNFOUSVMF @ts-expect-erroSͰίϝϯτΛڧ੍ ΨΠυϥΠϯʹ໌ه w ྫ 'PSN fi
FMEม׵͸GBDUPSZʹू໿͢Δ͜ͱ ఆظతͳ୨Է͠ w QSPEVDUJPOͷas@ts-ignoreΛ൒೥ʙ೥Ͱ୨Է͠

JO"*$PEFJOH "*͸Կ΋͠ͳ͍ͱಉ͡ଥڠΛ࠶ੜ࢈͠΍͍͢ w ؾ͍ͮͨΒas@ts-ignore͕૿͑ͯΔͦΜͳܦݧ͋ΔͷͰ͸ʁ ن໿ͱͯ͠ॻ͍͓ͯ͘ͱྑ͍ w ࠓճͷΑ͏ͳνΣοΫϦετΛʮةͳ͍৔໘ʯͱͯ͠໌ࣔ w Մೳͳճආࡦɾվળ΋໌͓ࣔͯ͘͠ w
"*͕ଥڠ͢Δ࣌͸ཧ༝Λग़ྗͤ͞Δ

୨Է͠΋"*ʹͤ͞Α͏🤖 ࠓ೔ͷUBMLͷωλ͸"*ʹίʔυϕʔεΛ෼ੳͤͨ͞੒Ռ෺͔Βελʔτ ͱݴ͏͜ͱ͸ΈΜͳ΋؆୯ʹ࢝ΊΒΕΔʂ w "*ʹ೚ͤΔasɾ@ts-ignoreͷϦετΞοϓύλʔϯผͷࣗಈ෼ྨ w ਓؒ XJUI"* ͕൑அ54ͷݶք͔PSઃܭͷ໰୊͔༏ઌ౓͸ߴ͍͔ ˠු্ͨ͠ଥڠΛվળνέοτ΁🎫

࠶ܝ୳͠ํ ୳ͤ͞ํ ࠓͷ࣌୅͸"*͕͋ΔͷͰੵۃతʹ׆༻͠Α͏ʂ ҎԼΛूதͯ͠໢ཏతʹ୳ͤͨ͞ w @ts-ignore@ts-expect-error w BTΩϟετ as constas
unknown as౳Λআ֎ w ܕΨʔυؔ਺value is X ͋Δఔ౓ࡉ͔͘෼ྨͤ͞Δˠ෼ྨ͝ͱʹ࣮ࢪʹίʔυΛݟͯ൑அ

·ͱΊ ۀ຿ͷʮྑ͘ͳ͍ܕʯʹ͸ύλʔϯ͕͋Δ w ͨ͘͞Μ͋ͬͯ΋େ఍਺ύλʔϯʹऩ·Δ w ࠓճ͸ ൒෼͸ઃܭͷ࿪Έɺ൒෼͸54ͷදݱྗͷݶքͩͬͨ ͦΕͧΕͷύλʔϯΛ෼ੳ͢Δͱ w ઃܭͷ೉͍͠ͱ͜Ζ΍54ͷݶքɾ54ͷࠓ·Ͱͱ͜Ε͔ΒΛ஌ΕΔ
w νʔϜϝϯόʔ΍"*ͷྐʹͳΔ օ͞Μ΋ͥͻऩूɾ෼ੳͯ͠ΈΑ͏ʂ

࠷ޙʹ

͔ͤͬ͘ʮϦΞϧʯͷ ΧϯϑΝϨϯεʹ͍Δͷ͔ͩΒ

օ͞Μͷࢥ͍΍஌ݟ΋ฉ͖͍ͨ ͖ͬͱௌ͍ͯΔΈͳ͞Μ΋͍ΖΜͳ͜ͱΛࢥͬͯ͘Εͨ͸ͣ w ʮͦΕ࣮͸΋ͬͱ্ख͘ղܾ͢Δํ๏͋ͬͯʯ w ʮ54Ҏ֎ͷଞͷݴޠͩͱ࿩ͯͨ͠΍͕ͭ͏·͍͘͘ΜͰ͢Αʯ w ʮҎલ͜ͷJTTVFͰ࿩ͯͨ͠ͷͰղܾ͢Δ͔΋͠Ε·ͤΜΑʁʯ w ʮΑ͋͘ΔύλʔϯͰ͜͏͍͏ͷ΋͋Γ·ͤΜʁʯ
w ʮ͏ͪͰ͸͜Μͳӡ༻Ͱ๷͍Ͱ·͢Αʙʯ w FUD

એ఻ϒʔεʹ΋͍·͢ʂ ฐࣾαΠϘ΢ζ͸(PMEεϙϯαʔͱͯ͠ϒʔεΛग़͍ͯ͠·͢ʂ ͥͻ༡ͼʹ͖͍࣭ͯͩ͘͞໰ɾ͓࿩8FMDPNFʂ

օ༷҆͝શʹʂ 3ZVTFJ4BKJLJ!TBKJLJY ܕ

業務に残された「良くない型」で考える「TypeScriptの難しさ」

業務に残された「良くない型」で考える「TypeScriptの難しさ」

More Decks by Saji

Other Decks in Technology

Featured

Transcript