[TypeScript] 関数の引数を必須ではなくオプションにする

2024.4.22

INDEX

はじめに

初めてのTypeScriptを読みました。
その学習を記録します。

結論

型アノテーションの中で「:」の前に「?」を追加する
オプションパラメーターにした引数は、「 | undefined」が追加された合併型になる

const add = (x:number, y?: number) => x + y

使い方

オプションパラメーターは、常に暗黙で「undefined」になる可能性がある

const announceSong = (song:string, singer?: string) => {
    console.log(`Song: ${song}`)

    if (singer){
        console.log(`Singer: ${singer}`)
    }
}

オプションパラメーターに文字列の引数を渡す

指定した文字列に文字列を引数として渡したので、問題がない

announceSong('Have fun !', 'ayaka')

"Song: Have fun !" 
"Singer: ayaka"

オプションパラメーターにundefinedの引数を渡す

singerは「undefined」が追加された合併型になるので、Errorにならない

announceSong('Have fun !', undefined)

"Song: Have fun !"

オプションパラメーターは、必ず最後であること

オプションパラメーターを先頭に持ってくると、下記のようなErrorが発生する

const announceSong = (song?:string, singer: string) => {
    console.log(`Song: ${song}`)

    if (singer){
        console.log(`Singer: ${singer}`)
    }
}

A required parameter cannot follow an optional parameter.

よかったらシェアしてね！

URLをコピーしました！

この記事を書いた人

naoki-furuta

Born in 1994
Engineer's career is from 2020.10
Skill: Next.js, TypeScript, Django, Python, HTML, CSS

この著者の記事一覧へ