TypeScript で文字列を数値に変換する

Rana Hasnain Khan 2024年2月15日
  1. TypeScript で単項プラス (+) 演算子を使用して文字列を数値に変換する
  2. TypeScript で parseInt() 関数を使用して文字列を数値に変換する
  3. TypeScript で parseFloat() 関数を使用して文字列を数値に変換する
  4. TypeScript でグローバル Number() 関数を使用して文字列を数値に変換する
  5. TypeScript で文字列を数値に変換した後に NaN をチェックする
TypeScript で文字列を数値に変換する

この記事では、TypeScript のさまざまなメソッドを使用して文字列を数値に変換する方法について、例を挙げて説明します。 TypeScript では、いくつかの方法で文字列を数値に変換できます。

単項プラス (+) 演算子とグローバルな Number() 関数は、TypeScript で非常に役立ちます。 parseInt() および parseFloat() 関数も利用できます。

これらの機能の使用例をいくつかご紹介します。

TypeScript で単項プラス (+) 演算子を使用して文字列を数値に変換する

単項プラス (+) 演算子は、数値、ブール値 (true および false)、および null のすべての文字列表現を数値に変更します。 オペランドを数値に変更できない場合、単項プラス演算子は NaN になります。

以下に示すように、いくつかの例を見てみましょう。

コード例:

# TypeScript

console.log(+"111")
console.log(+"112.5175")
console.log(+"10AA0.5165")
console.log(+"")
console.log(+" ")
console.log(+null)
console.log(+undefined)
console.log(+Infinity)
console.log(+true)
console.log(+false)
console.log(+"0x44")
console.log(+"0066")
console.log(+"0o21")
console.log(+"3.98e7")
console.log(+"71 35")
console.log(+"BA 35")

出力:

TypeScript の単項プラス (1)

TypeScript の単項プラス (2)

任意の文字列を数値に変換できます。 空の文字列または Null0 に変換します。 ご覧のとおり、true1 になり、false0 になりました。

8 進数/16 進数を 10 進数に変換することもできます。 科学表記法で正確に作業する必要があります。 数値への変換に失敗した場合、NaN を返します。

TypeScript で parseInt() 関数を使用して文字列を数値に変換する

parseInt() 関数は、文字列を分析して数値に変換します。 以下は parseInt() 関数の構文です。

基数を指定しない場合は、16 進数と見なされます。

構文:

# Typescript

parseInt(string, radix)

以下に示すように、例を見て、さまざまな方法を使用してみましょう。

コード例:

# TypeScript

console.log(parseInt("120"))
console.log(parseInt("100.5225"))
console.log(parseInt("10AA0.3375"))
console.log(parseInt(""))
console.log(parseInt(null))
console.log(parseInt(Infinity)
console.log(parseInt(true))
console.log(parseInt(false))
console.log(parseInt("0x12"))
console.log(parseInt("0042"))
console.log(parseInt("0o56"))
console.log(parseInt("3.285e7"))
console.log(parseInt("95 35"))
console.log(parseInt("CA 35"))

出力:

TypeScript の parseInt (1)

TypeScript の parseInt (2)

ご覧のとおり、任意の文字列を数値に変換できます。 空の文字列、nullinfinitytruefalseNaN に変換できます。

文字列が 0x で始まる場合、それは 16 進数です。 parseInt()0o で始まる 8 進数を認識しないことに注意してください。 古いブラウザは 8 進数として 0 で始まります。

主要なスペースと末尾のスペースは無視されます。 文字列の先頭が数値の場合は、数値に変換して残りを回避します。

基数を利用できます。 基数は 2 から 36 までです。

  • 2 はバイナリに使用されます
  • 8 は 8 進数に使用されます
  • 10 は 10 進数に使用されます
    ・16進数は16を使用

コード例:

# TypeScript

console.log(parseInt("22"));
console.log(parseInt("56",8));
console.log(parseInt("54",19));

console.log(parseInt("021"));
console.log(parseInt("061",9));
console.log(parseInt("011",11));

console.log(parseInt("0x21"));
console.log(parseInt("0x41",3));
console.log(parseInt("0x11",19));

console.log(parseInt("0o21"));
console.log(parseInt("0o41",3));
console.log(parseInt("0o11",26));

出力:

TypeScript の parseInt (3)

TypeScript で parseFloat() 関数を使用して文字列を数値に変換する

このトピックについて、もう 1つの関数について説明します。 parseFloat() は文字列を数値に変換する関数です。

コード例:

# TypeScript

console.log(parseFloat("200"))
console.log(parseFloat("223.5535"))
console.log(parseFloat("11AA0.5225"))
console.log(parseFloat(""))
console.log(parseFloat(null))
console.log(parseFloat(Infinity))
console.log(parseFloat(true))
console.log(parseFloat(false))
console.log(parseFloat("0x77"))
console.log(parseFloat("0042"))
console.log(parseFloat("0o11"))
console.log(parseFloat("3.228e7"))
console.log(parseFloat("45 85"))
console.log(parseFloat("FA 95"))

出力:

TypeScript の parseFloat (1)

TypeScript の parseFloat (2)

文字列を小数または数値に変換できます。 空の文字列、nulltrue、および falseNaN に変換しました。

この関数は、infinity をそのまま返します。 0x または 0o で始まる文字列は、0 に変更されます。 16 進数または 8 進数は認識されません。

主要なスペースと末尾のスペースは無視されます。 文字列の先頭文字が数字の場合、数字に変換して残りを回避します。

TypeScript でグローバル Number() 関数を使用して文字列を数値に変換する

グローバル Number() 関数を使用できます。 これは、単項プラス (+) 演算子のようなものです。

コード例:

# TypeScript

console.log(Number("320"))
console.log(Number("120.5225"))
console.log(Number("15AA0.5245"))
console.log(Number(""))
console.log(Number(" "))
console.log(Number(null))
console.log(Number(undefined))
console.log(Number(Infinity))
console.log(Number(true))
console.log(Number(false))
console.log(Number("0x43"))
console.log(Number("0052"))
console.log(Number("0o11"))
console.log(Number("3.435e7"))
console.log(Number("15 99"))
console.log(Number("DE 25"))

出力:

TypeScript の Global Number() 関数 (1)

TypeScript の Global Number() 関数 (2)

出力で、文字列を数値に正常に変換したことがわかります。 null0 に変換しました。

true ブール値は 1 に変換され、false0 になります。 8 進数/16 進数を 10 進数に変換することもできます。

科学表記法の数値を正しく処理できます。 変換に失敗すると、NaN が返されます。

TypeScript で文字列を数値に変換した後に NaN をチェックする

NaN は Not a Number の略です。 これは数値演算の出力ですが、数値ではありません。

変換後、isNaN() メソッドを使用して、値が NaN かどうかを確認できます。

コード例:

# TypeScript

strToNum("AB 35")
strToNum("35")

function strToNum(Valnum) {
    if (isNaN(+Valnum)) {
        console.log("This is not a number")
    } else  {
        console.log(+Valnum)
    }
}

出力:

TypeScript で NaN をチェック

Rana Hasnain Khan avatar Rana Hasnain Khan avatar

Rana is a computer science graduate passionate about helping people to build and diagnose scalable web application problems and problems developers face across the full-stack.

LinkedIn

関連記事 - TypeScript String