Skip to content

[JavaScript] 判斷一個字串是否為有效的數字

Last Updated on 2021-12-24 by Clay

在建立網頁時，我們總是會有要讓使用者輸入數字的時候，這個時候，我們可能需要寫下一些判斷式來判斷使用者輸入的字串是否為有效的數字。

下面紀錄幾個典型的判斷方法。

  • isNaN()
  • parseFloat()

使用 isNaN() 函式判斷

這是一個很常見的方法，NaN 代表的是 Not a Number，也就是說回傳 false 的時候正代表這是一個有效數字。

不過這個方法雖然簡單，但存在著一些問題，比方說遇到空白跟空字串時一樣會回傳 false，因為是將其視為數字 0 來處理。

// Init
var num_01 = "100";
var num_02 = "a33";
var num_03 = " ";
var num_04 = "";

// Determined
console.log("100:", isNaN(num_01));
console.log("a33:", isNaN(num_02));
console.log("' ':", isNaN(num_03));
console.log("'':", isNaN(num_04));


Output:

100: false
a33: true
' ': false
'': false

使用 parseFloat() 函式進行判斷

parseFloat() 在判斷不是數字的字串時，會將其作為 NaN 回傳。我們可以依據此特性來寫一個判斷函式。

（註：我寫的函式回傳 true 則代表是數字，跟上方的 isNaN() 剛好相反）

// Init
var num_01 = "100";
var num_02 = "a33";
var num_03 = " ";
var num_04 = "";

// isNumber
function isNumber(inputs) {
    return parseFloat(inputs).toString() != "NaN";
} 


// Determined
console.log("100:", isNumber(num_01));
console.log("a33:", isNumber(num_02));
console.log("' ':", isNumber(num_03));
console.log("'':", isNumber(num_04));


Output:

100: true
a33: false
' ': false
'': false

References

Read More

Tags:

Leave a Reply