JavaScript如何判斷是否為數字？

法1：使用isNaN()函數

isNaN()函數是js自帶的全局函數，isNaN() 函數用于檢查其參數是否是非數字值。

如果值x 是特殊的非數字值 NaN（或者能被轉換為這樣的值），返回的值就是 true；如果值x 是其他值，則返回 false。

isNaN()的缺點就在于 null、空格以及空串會被按照0來處理

NaN: Not a Number

<script>
document.write(isNaN(123));  //數字      ----false
document.write(isNaN(-1.23));  //數字    ----false
document.write(isNaN(5-2));  //數字      ----false
document.write(isNaN(0));  //數字        ----false
document.write(isNaN("Hello"));  //字符串 ----true
document.write(isNaN("2005/12/12"));  //字符串----true
</script>
12345678

缺點：isNaN()會將 null、空格以及空串按照0來處理，所以檢查不嚴謹。

所以用加工一下，和typeof運算符一起使用。

示例：

// true:數值型的，false：非數值型
function myIsNaN(value) {
   return (typeof value === 'number' && !isNaN(value));
}
myIsNaN(10);      ----true
myIsNaN(null);    ----false
myIsNaN( );      ----false
myIsNaN();       ----false
12345678

注意:如果是 ‘36.3’，typeof value === ‘number’，會返回false，如果想字符串類型的數字也返回true，可以用下面的方法3

方法2：使用正則表達式

(1)、校驗只要是數字（包含正負整數，0以及正負浮點數）就返回true

/**
* 校驗只要是數字（包含正負整數，0以及正負浮點數）就返回true
**/

function isNumber(val){

    var regPos = /^[0-9]+.?[0-9]*/; //判斷是否是數字。
  
    if(regPos.test(val) ){
        return true;
    }else{
        return false;
    }
}
1234567891011121314

(2)、校驗正負正數就返回true

/**
* 校驗正負正數就返回true
**/

function isIntNum(val){
    var regPos = / ^\d+$/; // 非負整數 
    var regNeg = /^\-[1-9][0-9]*$/; // 負整數
    if(regPos.test(val) && regNeg.test(val)){
        return true;
    }else{
        return false;
    } 
}
12345678910111213

方法3：利用parseFloat()的返回值

parseFloat() 函數可解析一個字符串，并返回一個浮點數。

該函數指定字符串中的首個字符是否是數字。如果是，則對字符串進行解析，直到到達數字的末端為止，然后以數字返回該數字，而不是作為字符串。

用法：將參數中指定的字符串解析成為一個浮點數字并返回。

/**
* 驗證數據 是數字：返回true；不是數字：返回false
**/

function Number(val) {
　　if (parseFloat(val).toString() == "NaN") {
　　　　
　　　　return false;
　　} else {
　　　　return true;
　　}
}


isNaN(val)不能判斷空串或一個空格
如果是一個空串、空格或null，而isNaN是做為數字0進行處理的，
而parseInt與parseFloat是返回一個錯誤消息，這個isNaN檢查不嚴密而導致的。

以上就是JavaScript如何判斷是否為數字？的詳細內容，更多請關注html中文網其它相關文章！

參考
https://m.html.cn/qa/javascript/11966.html

https://www.cnblogs.com/lguow/p/11572273.html

解如何在 JavaScript 中輕松檢查字符串是否僅包含數字。匹配包含由字符分隔的數字的字符串。

要檢查字符串是否僅包含 JavaScript 中的數字，請在此正則表達式上調用 test() 方法：^\d+$。如果字符串僅包含數字，則 test() 方法將返回 true。否則，它將返回 false。

例如：

function containsOnlyNumbers(str) {
  return /^\d+$/.test(str);
}console.log(containsOnlyNumbers('HTML5')); // false
console.log(containsOnlyNumbers('1234')); // true
console.log(containsOnlyNumbers('3 bananas')); // false

RegExp test() 方法搜索正則表達式和字符串之間的匹配項。

/ 和 / 字符用于開始和結束正則表達式。

^ 字符標記字符串輸入的開始，$ 字符標記字符串的結束。

\d 模式匹配字符串中的任何數字 (0 - 9)。

在 \d 之后添加 + 字符會使正則表達式匹配一次或多次出現的 \d 模式。

因此，正則表達式匹配一個以連續數字序列開頭和結尾的字符串。

我們可以使用 [0-9] 模式來匹配數字。此模式匹配 0 到 9 之間的任何數字字符。

function containsOnlyNumbers(str) {
  return /^[0-9]+$/.test(str);
}console.log(containsOnlyNumbers('HTML5')); // false
console.log(containsOnlyNumbers('1234')); // true
console.log(containsOnlyNumbers('3 bananas')); // false

您可能會發現 [0-9] 比 \d 更具可讀性，尤其是在您對正則表達式中的特殊字符不是很熟悉的情況下。

匹配包含由字符分隔的數字的字符串

有時我們希望匹配數字可能由特定字符（例如空格或逗號）分隔的字符串。

function containsOnlyNumbers(str) {
  return /^(\d+,)*(\d+)$/.test(str);
}console.log(containsOnlyNumbers('123456789')); // true (separator not required)
console.log(containsOnlyNumbers('123,456,789')); // true
console.log(containsOnlyNumbers('123-456-789')); // false

我們使用這種格式的正則表達式來做到這一點：^(\d+{ch})*(\d+)$，其中 {ch} 是分隔數字的字符。

所以我們可以使用一個非常相似的正則表達式來匹配一個只包含用連字符分隔的數字的字符串：

function containsOnlyNumbers(str) {
  return /^(\d+-)*(\d+)$/.test(str);
}console.log(containsOnlyNumbers('123456789')); // true
console.log(containsOnlyNumbers('123,456,789')); // false
console.log(containsOnlyNumbers('123-456-789')); // true

或空格：

function containsOnlyNumbers(str) {
  return /^(\d+ )*(\d+)$/.test(str);
}console.log(containsOnlyNumbers('123456789')); // true
console.log(containsOnlyNumbers('123 456 789')); // true
console.log(containsOnlyNumbers('123-456-789')); // false

提示：如果您遇到過帶有難以理解的模式的正則表達式，來自 MDN 文檔的正則表達式備忘單可能會有所幫助。

像以前一樣，我們可以使用 [0-9] 代替 \d 來表示正則表達式：

function containsOnlyNumbers(str) {
  return /^([0-9]+-)*([0-9]+)$/.test(str);
}console.log(containsOnlyNumbers('123456789')); // true
console.log(containsOnlyNumbers('123,456,789')); // false
console.log(containsOnlyNumbers('123-456-789')); // true

關注七爪網，獲取更多APP/小程序/網站源碼資源！

ntroduction 介紹

人工智能和機器學習是軟件開發的一個令人興奮的新前沿。雖然新的工具，網站和其他資源不斷涌現，但其中大多數都是用Python（或者R）編寫的。如果你是一個前端開發人員（他最喜歡的語言可能是JavaScript），你可能會想知道你是否有可能探索這個新世界。

幸運的是，這個問題的答案是肯定的。有一些庫可以讓你在不了解Python一行的情況下練習機器學習。在本教程中，我們將探討其中之一 - 大腦.js - 并展示如何構建，訓練和使用只有JavaScript的深度神經網絡（DNN）。

Learning objectives 學習目標

我們將逐步完成一個預構建的 DNN。我們將展示它如何從 UI 中工作，深入研究將 UI 連接到 DNN 的代碼，然后解釋實際創建和訓練 DNN 的代碼。然后，我們將回過頭來解釋 DNN 是什么、它們如何工作以及人們如何創建和改進它們的一些基本概念。在此過程中，我們將發現DNN如何使我們能夠以令人驚訝的少代碼獲得令人印象深刻的結果。

Prerequisites 前置條件準備

本文假定您之前沒有 DNN 或機器學習方面的經驗

For the tutorial, you will need:

Basic familiarity with JavaScript 對腳本的基本熟悉程度
Basic familiarity with Git and GitHub 對 Git 和 GitHub 的基本熟悉程度

步驟1. Draw and predict

克隆存儲庫后，在所選瀏覽器中打開數字計算器.html文件。加載時，您應該會看到以下內容。

這是數字預測應用程序的 UI，該應用程序使用 DNN 來猜測您在其網格中繪制的內容。

嘗試在網格中繪制一個數字;它可以是 0 到 9 之間的任何值（僅限一位數字）。您可以通過單擊網格中的正方形，按住鼠標左鍵并拖動它來繪制數字，完成后釋放。

繪制完某些內容后，單擊“獲取評估”按鈕。這樣做應該會產生如圖 2 所示的反饋。

若要進行其他預測，請單擊“清除輸入”按鈕并在網格中繪制另一個數字，然后再次單擊“獲取評估”。

Here's what just happened 這是剛剛發生的事情

希望到現在為止，您已經對此程序的工作原理很感興趣。到目前為止，您已經與預先訓練的 DNN 進行了交互。

在非常基本的層面上，您正在創建輸入 - 您繪制的數字 - 并將其饋送到DNN。反過來，DNN正在使用它以前教授的內容（稍后會詳細介紹）來進行有根據的猜測或預測。代碼在 UI 中顯示此預測，并添加了一些詳細信息，例如黃色突出顯示，以使網絡的選擇更加明顯。

步驟2. 使用Brain.js 庫構建DNN訓練

我們現在將演練代碼，以便您可以看到使用大腦.js庫在JavaScript中實現DNN是什么樣的。完成此操作后，我們將退后一步，更廣泛地討論 DNN 的工作原理，并回顧我們看到的代碼，以將其全部聯系在一起。

當我們單擊“獲取評估”按鈕時，我們可以看到它調用了一個名為getAssessment():

<button onclick="getAssessment()" style="width:49%;">
    Get Assessment
</button>

當我們在數字計算器.html文件中向下滾動時，我們可以看到 getAssessment（）的定義：

function getAssessment() {
    const inputArray = captureAndTransformInput()
    let ourNetwork = ourNeuralNetwork
    const result = arrayToHTML(resultToArray(ourNetwork.run(inputArray)))

    document.getElementById('assessment').innerHTML = result
}

getAssessment（）函數是我們創建的，因此我們的 UI 可以與大腦.js庫創建的 DNN 對象進行通信（稍后會詳細介紹）。

如果要使用 DNN，我們需要做的第一件事就是獲取有關我們在屏幕上繪制的內容的數據。我們需要給 DNN 一些要檢查的東西。我們使用為演示創建的另一個函數來執行此操作，該函數稱為捕獲和轉換輸入（）。此函數循環訪問我們網頁上的網格，并檢查哪些框被涂成紅色，哪些框沒有。然后，它采用所有這些數組，并將整體轉換為 1 和 0 的數組，并返回結果：

function captureAndTransformInput() {
    const boxes = Array.from(document.getElementsByClassName('cell'))
    const toOnesOrZeros = box => box.style.backgroundColor === 'red' ? 1 : 0
    return boxes.map(toOnesOrZeros)
}

我們需要執行此轉換，因為 Brain.js 庫提供給我們的 DNN 將不知道如何處理原始數據（來自 HTML 頁面的顏色信息）。我們的 DNN 只知道如何處理 1 和 0 的列表。

使用深度學習術語，我們正在使用捕獲和轉換輸入函數為我們的 DNN 創建一個輸入向量。

步驟 3. 使用DNN 來判斷準確度

所有 DNN 都需要一個輸入向量來完成其工作。即使是你可能聽說過的神經網絡示例，例如那些處理照片以確定它們是否包含貓或狗的示例，也不能直接處理照片。

相反，腳本（通常是Python）從照片中獲取像素信息并將其解卷成一長串值，這些值通常是表示照片中每個像素的每個RGB值的不同部分的數字。結果稱為輸入向量，對于照片，它可以包含許多值。我們正在對捕獲和轉換輸入（）執行類似的操作，盡管更簡單。

現在我們有了輸入向量，我們可以使用 DNN 對剛剛繪制的內容進行分類，并確定其準確性。

使用 Brain.js庫時，將創建一個包含有關 DNN 的信息的對象。此對象的一個方面是名為 run（）的方法。這就是實際生成的預測，最終在我們看到的網頁上結束：

ourNeuralNetwork.run(...)

但在我們實際使用我們的 DNN 對象之前，我們必須先訓練它并設置一些參數。我們很快就會解釋這一點，但現在我們將繼續看到網絡的預測如何將其返回到網頁。

brain.js run（）方法將輸入向量作為參數并返回結果。此結果是一個 JSON 有效負載，其中包含有關 DNN 對我們繪制的數字的有根據的猜測的信息。在我們的教程中，我們將captureAndTransformInput（）函數的輸出提供給run（）方法：

const inputArray = captureAndTransformInput()
const result = arrayToHTML(resultToArray(ourNeuralNetwork.run(inputArray)))
The output of the run() method - i.e., our network’s prediction - is then passed to another “transformer” function we have created called resultToArray():

function resultToArray(resultToConvert) {
    let arrayToReturn = []

    arrayToReturn.push({ label: 'Zero', likelihood: resultToConvert.Zero, topChoice: 0, ordinal: 0 })
    arrayToReturn.push({ label: 'One', likelihood: resultToConvert.One, topChoice: 0, ordinal: 1 })
    arrayToReturn.push({ label: 'Two', likelihood: resultToConvert.Two, topChoice: 0, ordinal: 2 })
    arrayToReturn.push({ label: 'Three', likelihood: resultToConvert.Three, topChoice: 0, ordinal: 3 })
    arrayToReturn.push({ label: 'Four', likelihood: resultToConvert.Four, topChoice: 0, ordinal: 4 })
    arrayToReturn.push({ label: 'Five', likelihood: resultToConvert.Five, topChoice: 0, ordinal: 5 })
    arrayToReturn.push({ label: 'Six', likelihood: resultToConvert.Six, topChoice: 0, ordinal: 6 })
    arrayToReturn.push({ label: 'Seven', likelihood: resultToConvert.Seven, topChoice: 0, ordinal: 7 })
    arrayToReturn.push({ label: 'Eight', likelihood: resultToConvert.Eight, topChoice: 0, ordinal: 8 })
    arrayToReturn.push({ label: 'Nine', likelihood: resultToConvert.Nine, topChoice: 0, ordinal: 9 })

    const byLikelihood = (x, y) => x.likelihood < y.likelihood ? 1 : -1
    const byOrdinal = (x, y) => x.ordinal < y.ordinal ? -1 : 1

    const topChoiceDesignation = (e, i, a) => {
        e.topChoice = i === 0 ? 1 : 0  // mark the first entry (index 0) as the top choice - we can do this because we've already sorted them to ensure that the top choice is the first item 
        return e
    }

    return arrayToReturn.sort(byLikelihood)
        .map(topChoiceDesignation)
        .sort(byOrdinal)
}

此函數接收預測數據（結果到轉換）并創建一個新數組（數組 ToReturn），其中包含可用于在 UI 中顯示結果的信息。我們的 DNN 返回的輸出將是一個具有 10 個屬性（零、一、二、三、四、五、六、七、八、九）的對象，每個屬性都有映射到它的概率（介于 0 和 1 之間）。

因此，例如，來自 DNN（結果到轉換參數）的預測有效負載可能如下所示（我們的 DNN 非常確信，無論它所看到的是什么，都是數字 4）：

// a possible payload for resultToConvert - this data came from the DNN
{
    Zero: 0.1927014673128724,
    One: 1.588071696460247,
    Two: 0.09038684074766934,
    Three: 0.0014367527001013514,
    Four: 94.81642246246338,
    Five: 0.8259298279881477,
    Six: 0.10091685689985752,
    Seven: 0.46726344153285027,
    Eight: 0.30299206264317036,
    Nine: 41.01988673210144
}

我們使用此輸出來構建一個新數組，其中每個項目都有一個標簽屬性（我們創建并分配單詞值，如“Zero”，“One”等），一個可能性屬性（存儲從該項的神經網絡接收的概率），一個topChoice屬性（我們計算）和一個序號屬性（我們為其賦值，如 0， 1， 2-9）。

我們按可能性對數組進行排序，以確定 DNN 的首選，然后使用此信息用 1（真）或 0（假）標記該項目的 topChoice 屬性。作為最后一步，我們采用新構造的數組并將其饋送到最終函數 - arrayToHTML（） - 該函數將此信息包裝在HTML標記中：

function arrayToHTML(arr) {
    let htmlToReturn = ''
    htmlToReturn = arr.map(x => {
        let styleToUse = x.topChoice === 1 ? 'background-color: yellow;' : ''
        return `<div style="${styleToUse}">${x.label} Confidence: ${x.likelihood * 100}%</div>`
    }).join('')

    return htmlToReturn;
}

除其他操作外，此函數還對它收到的每個項目執行檢查，以確定其 topChoice 屬性是否為 1。如果是，則用黃色標記包裝項目。這是我們在網頁上看到的突出顯示。

有了這個，我們已經看到了從UI到DNN（作為用戶輸入）和再次返回（作為中繼到UI的DNN輸出）的完整往返。

步驟4. 建立 Brain.js 神經網絡對象Set up Brain.js neural-network object

早些時候，我們指出，Brain.js庫使我們能夠創建的DNN對象需要一些設置才能使用它。我們將在這里詳細討論這個問題。

在number-evaluator.html文件中，我們創建了一個名為 activate（）的函數。當 HTML 文檔最初加載時，這將觸發，并且我們在此函數中定義、創建和訓練 DNN。

我們通過調用 Brain.js庫中的 NeuralNetwork（）方法來做到這一點，就像這樣（brain是我們從 Brain.js 庫的本地副本中可用的變量，存儲在本地brain.js文件中）：

// setting up a BrainJS DNN object with two specified hyper parameters
ourNeuralNetwork = new brain.NeuralNetwork({
    activation: 'sigmoid',
    learningRate: 0.1
})

Hyper parameters 初始參數

當數據科學家和機器學習工程師創建神經網絡時，他們通常需要提供一組初始值，用于說明網絡在訓練時的運行方式。這些初始值或參數稱為超參數。

它們控制神經網絡調整學習方式的速度，在其隱藏層中使用哪種操作，以及許多其他方面。在其他語言和設置中，我們通常需要提供許多超參數來訓練神經網絡。然而，有了Brain.js，我們根本不需要提供任何東西。如果省略任何超參數，該庫將提供默認值。

在上面的示例中，我們指定了兩個超參數。第一個是一個名為激活的參數，我們已將其設置為 sigmoid。激活函數是神經網絡在其隱藏層中執行的東西，用于處理從一層到下一層的輸入。它們對于幫助神經網絡學習至關重要，因為它們有助于控制哪些節點應該繼續觸發，哪些節點應該在每一層中保持沉默。乙狀體是一種激活函數。我們可以使用許多品種（ReLU，譚等）。每個激活函數都有自己的優點和缺點。使用 sigmoid 對于分類之類的事情特別有用，這是我們在本教程中要實現的目標。

我們指定的另一個超參數是學習速率。學習速率決定了神經網絡在嘗試創建有用的預測模型時（即，當它試圖學習如何區分3和7時）調整其值的速度（或速度）。

指定學習速率，就像指定其他超參數一樣，既是藝術，也是科學：如果將速率設置得太低，您的網絡可能需要不可接受的時間來訓練，例如，如果您在云服務上租用GPU，這可能會產生真正的財務后果;如果您將速率設置得太高，您的網絡可能永遠不會收斂到所謂的“全局最小值”（解決方案）。

時間和實踐將使您能夠掌握良好的初始值是什么樣子的。

步驟5.訓練神經網絡 Training our neural network

我們一直在談論神經網絡的學習以及我們必須如何訓練它，但這意味著什么，它看起來是什么樣子的？在我們的教程應用程序的上下文中，培訓如下所示：

const ourTrainingData = getTrainingData()
ourNeuralNetwork.train(ourTrainingData)

訓練是 DNN 工作原理的基礎。通常，它的完成方式是使用監督學習方法：我們提供一個數據集，其中包含示例輸入和答案（或標簽，有時也稱為真實標簽），用于描述該數據行的正確分類。當我們訓練一個DNN（大腦.js允許我們從有用的命名train（）方法開始，它使用這些標簽來幫助它學習。

步驟 6. 準備訓練數據Train the data

查看 getTrainingData() 函數，我們可以知道DNN具體是如何工作的。

Brain.js允許我們通過訓練數據來指定我們的輸入數據將是什么樣子的，以及我們希望從神經網絡中看到什么樣的輸出。它的主要要求是我們提供輸入和輸出屬性。有關詳細信息，請參閱“訓練選項”下的“大腦.js GitHub 存儲庫”。

下面是訓練數據樣例

{ "input": [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0, 1, 0, 0, 0, 1, 1, 0, 0, 0, 1, 1, 0, 0, 0, 0, 1, 0, 0, 0, 1, 0, 0, 0, 0, 0, 1, 0, 0, 0, 1, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 1, 0, 1, 1, 1, 0, 0, 0, 0, 0, 1, 1, 1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0], 
    "output": { 
        Zero: 1, 
        One: 0, 
        Two: 0, 
        Three: 0, 
        Four: 0, 
        Five: 0, 
        Six: 0, 
        Seven: 0, 
        Eight: 0, 
        Nine: 0 
        } 
    }

訓練識別概率

{
    Zero: 0.1927014673128724,
    One: 1.588071696460247,
    Two: 0.09038684074766934,
    Three: 0.0014367527001013514,
    Four: 94.81642246246338,
    Five: 0.8259298279881477,
    Six: 0.10091685689985752,
    Seven: 0.46726344153285027,
    Eight: 0.30299206264317036,
    Nine: 41.01988673210144
}

自己創建訓練數據

通過手寫板準備數據，

Summary 總結

本文中，我們展示了如何使用 JavaScript 實現和訓練 DNN，這要歸功于brain.js庫 - 通常需要 Python 和 Keras、Pytorch 或 TensorFlow 等庫的任務。

我們證明了一個有效的數字識別器可以用令人驚訝的少代碼創建。我們學習了機器學習的一些基本構建塊和實踐，例如為DNN指定學習速率和激活函數（以及其他超參數）。

希望本文已經向您展示，在沒有經驗的情況下開始使用AI和機器學習不僅是可能的，而且在像JavaScript這樣的熟悉語言中也是可行的。

在線咨詢

上一篇：你別說，3000元開發的企業員工宿舍智慧管理系統還真能用！
下一篇：JavaScript嵌入HTML中的3種方式

您的項目需求

*請認真填寫需求信息，我們會在24小時內與您取得聯系。

整合營銷服務商