[JavaScript]変数に値（string型の数値）がある場合のみ表示させる

3377 ワード
テキストリンク

APIなどで、受け取った値（string型の数値）がnullでない場合のみ表示させるサンプルコード（という名の覚書き）

前提条件

  • 変数の値は基本string型
    → 送信元でコントールされているものとする
  • 対象の変数に値が入る場合は数値（string型）のみで、値なしの場合は空文字、null、undefined（定義がない場合を想定）が入るものとする

コード

サーバから受け取った多次元連想配列のageに入力値があれば「歳」を付けて表示、なければ表示なしとする場合（前提として0歳はありえないものとする）


Object.keys(data).forEach((key) => {
	・・・（前の処理）
	// 数値に変換
	let age = Number(`${data[key]['age']}`);
	// 非数もしくは0の場合は表示しない
	age = isNaN(age) || age == 0 ? "" : age + "歳";
	(処理の続き) ・・・
}

ポイント

  • Number()関数での変換結果が
    • undefined、文字列の場合: NaN
    • 空文字、null（あとスペースも）の場合: 0

となることを活用

終わりに

あくまでうまくいった内容の覚書きです
当方JavaScript初級者のため、よりよい書き方があればぜひご教授ください

参考

訪問者の手を煩わせないメールフォームのSPAM対策（Nuxt 3 実装例付き）
gorilla/muxを使って特定のURLパスにだけミドルウェアを機能させる方法