目錄
了解機器學習
JavaScript 機器學習函式庫
第 1 步:安裝 Node.js
第 2 步:設定項目
第 3 步:初始化 Node.js 專案
第 4 步:安裝 TensorFlow.js
第 5 步:開始建立機器學習模型
範例 1:線性迴歸
說明
輸出
範例 2:情緒分析
首頁 web前端 js教程 JavaScript 機器學習:在瀏覽器中建立 ML 模型

JavaScript 機器學習:在瀏覽器中建立 ML 模型

Sep 10, 2023 am 09:45 AM

JavaScript 机器学习:在浏览器中构建 ML 模型

機器學習 (ML) 徹底改變了各個行業,使電腦能夠根據模式和資料進行學習和預測。傳統上,機器學習模型是在伺服器或高效能機器上建置和執行的。然而,隨著 Web 技術的進步,現在可以使用 JavaScript 直接在瀏覽器中建置和部署 ML 模型。

在本文中,我們將探索 JavaScript 機器學習的令人興奮的世界,並學習如何建立可以在瀏覽器中運行的 ML 模型。

了解機器學習

機器學習是人工智慧 (AI) 的一個子集,專注於創建能夠從資料中學習並做出預測或決策的模型。機器學習主要有兩種類型:監督學習和無監督學習。

監督學習涉及在標記資料上訓練模型,其中輸入特徵和相應的輸出值是已知的。該模型從標記資料中學習模式,以對新的、未見過的資料進行預測。

另一方面,無監督學習處理未標記的資料。此模型無需任何預定義標籤即可發現資料中隱藏的模式和結構。

JavaScript 機器學習函式庫

要開始使用 JavaScript 機器學習,請依照下列步驟操作 -

第 1 步:安裝 Node.js

Node.js 是一個 JavaScript 執行時間環境,允許我們在 Web 瀏覽器之外執行 JavaScript 程式碼。它提供了使用 TensorFlow.js 所需的工具和函式庫。

第 2 步:設定項目

安裝 Node.js 後,打開您的首選程式碼編輯器並為您的 ML 專案建立新目錄。使用命令列或終端導航到專案目錄。

第 3 步:初始化 Node.js 專案

在命令列或終端機中,執行以下命令來初始化新的 Node.js 專案 -

npm init -y
登入後複製

此指令建立一個新的 package.json 文件,用於管理專案依賴項和配置。

第 4 步:安裝 TensorFlow.js

要安裝 TensorFlow.js,請在命令列或終端機中執行下列命令 -

npm install @tensorflow/tfjs
登入後複製

第 5 步:開始建立機器學習模型

現在您的專案已設定完畢並安裝了 TensorFlow.js,您可以開始在瀏覽器中建立機器學習模型了。您可以建立一個新的 JavaScript 文件,匯入 TensorFlow.js,並使用其 API 來定義、訓練 ML 模型並進行預測。

讓我們深入研究一些程式碼範例,以了解如何使用 TensorFlow.js 並在 JavaScript 中建立機器學習模型。

範例 1:線性迴歸

線性迴歸是一種監督學習演算法,用於根據輸入特徵預測連續輸出值。

讓我們看看如何使用 TensorFlow.js 實作線性迴歸。

// Import TensorFlow.js library
import * as tf from '@tensorflow/tfjs';

// Define input features and output values
const inputFeatures = tf.tensor2d([[1], [2], [3], [4], [5]], [5, 1]);
const outputValues = tf.tensor2d([[2], [4], [6], [8], [10]], [5, 1]);

// Define the model architecture
const model = tf.sequential();
model.add(tf.layers.dense({ units: 1, inputShape: [1] }));

// Compile the model
model.compile({ optimizer: 'sgd', loss: 'meanSquaredError' });

// Train the model
model.fit(inputFeatures, outputValues, { epochs: 100 }).then(() => {
   // Make predictions
   const predictions = model.predict(inputFeatures);

   // Print predictions
   predictions.print();
});
登入後複製

說明

在此範例中,我們首先匯入 TensorFlow.js 函式庫。然後,我們將輸入特徵和輸出值定義為張量。接下來,我們建立一個順序模型並新增一個具有一個單元的密集層。我們使用“sgd”優化器和“meanSquaredError”損失函數編譯模型。最後,我們訓練模型 100 個 epoch,並對輸入特徵進行預測。預測的輸出值將會列印到控制台。

輸出

Tensor
   [2.2019906],
   [4.124609 ],
   [6.0472274],
   [7.9698458],
   [9.8924646]]
登入後複製

範例 2:情緒分析

情緒分析是機器學習的一種流行應用,涉及分析文字資料以確定文本中表達的情緒或情緒基調。我們可以使用 TensorFlow.js 建立情緒分析模型,預測給定文字是否具有正面或負面情緒。

考慮下面所示的程式碼。

// Import TensorFlow.js library
import * as tf from '@tensorflow/tfjs';
import '@tensorflow/tfjs-node'; // Required for Node.js environment

// Define training data
const trainingData = [
   { text: 'I love this product!', sentiment: 'positive' },
   { text: 'This is a terrible experience.', sentiment: 'negative' },
   { text: 'The movie was amazing!', sentiment: 'positive' },
   // Add more training data...
];

// Prepare training data
const texts = trainingData.map(item => item.text);
const labels = trainingData.map(item => (item.sentiment === 'positive' ? 1 : 0));

// Tokenize and preprocess the texts
const tokenizedTexts = texts.map(text => text.toLowerCase().split(' '));
const wordIndex = new Map();
let currentIndex = 1;
const sequences = tokenizedTexts.map(tokens => {
   return tokens.map(token => {
      if (!wordIndex.has(token)) {
         wordIndex.set(token, currentIndex);
         currentIndex++;
      }
      return wordIndex.get(token);
   });
});

// Pad sequences
const maxLength = sequences.reduce((max, seq) => Math.max(max, seq.length), 0);
const paddedSequences = sequences.map(seq => {
   if (seq.length < maxLength) {
      return seq.concat(new Array(maxLength - seq.length).fill(0));
   }
   return seq;
});

// Convert to tensors
const paddedSequencesTensor = tf.tensor2d(paddedSequences);
const labelsTensor = tf.tensor1d(labels);

// Define the model architecture
const model = tf.sequential();
model.add(tf.layers.embedding({ inputDim: currentIndex, outputDim: 16, inputLength: maxLength }));
model.add(tf.layers.flatten());
model.add(tf.layers.dense({ units: 1, activation: 'sigmoid' }));

// Compile the model
model.compile({ optimizer: 'adam', loss: 'binaryCrossentropy', metrics: ['accuracy'] });

// Train the model
model.fit(paddedSequencesTensor, labelsTensor, { epochs: 10 }).then(() => {
   // Make predictions
   const testText = 'This product exceeded my expectations!';
   const testTokens = testText.toLowerCase().split(' ');
   const testSequence = testTokens.map(token => {
      if (wordIndex.has(token)) {
         return wordIndex.get(token);
      }
      return 0;
   });
   const paddedTestSequence = testSequence.length < maxLength ? testSequence.concat(new Array(maxLength - testSequence.length).fill(0)) : testSequence;
   const testSequenceTensor = tf.tensor2d([paddedTestSequence]);
   const prediction = model.predict(testSequenceTensor);
   const sentiment = prediction.dataSync()[0] > 0.5 ?  'positive' : 'negative';

   // Print the sentiment prediction
   console.log(`The sentiment of "${testText}" is ${sentiment}.`);
});
登入後複製

輸出

Epoch 1 / 10
eta=0.0 ========================================================================> 
14ms 4675us/step - acc=0.00 loss=0.708 
Epoch 2 / 10
eta=0.0 ========================================================================> 
4ms 1428us/step - acc=0.667 loss=0.703 
Epoch 3 / 10
eta=0.0 ========================================================================> 
5ms 1733us/step - acc=0.667 loss=0.697 
Epoch 4 / 10
eta=0.0 ========================================================================> 
4ms 1419us/step - acc=0.667 loss=0.692 
Epoch 5 / 10
eta=0.0 ========================================================================> 
6ms 1944us/step - acc=0.667 loss=0.686 
Epoch 6 / 10
eta=0.0 ========================================================================> 
5ms 1558us/step - acc=0.667 loss=0.681 
Epoch 7 / 10
eta=0.0 ========================================================================> 
5ms 1513us/step - acc=0.667 loss=0.675 
Epoch 8 / 10
eta=0.0 ========================================================================> 
3ms 1057us/step - acc=1.00 loss=0.670 
Epoch 9 / 10
eta=0.0 ========================================================================> 
5ms 1745us/step - acc=1.00 loss=0.665 
Epoch 10 / 10
eta=0.0 ========================================================================> 
4ms 1439us/step - acc=1.00 loss=0.659 
The sentiment of "This product exceeded my expectations!" is positive.
登入後複製

以上是JavaScript 機器學習:在瀏覽器中建立 ML 模型的詳細內容。更多資訊請關注PHP中文網其他相關文章!

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

AI Hentai Generator

AI Hentai Generator

免費產生 AI 無盡。

熱門文章

R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
1 個月前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳圖形設置
1 個月前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.如果您聽不到任何人,如何修復音頻
1 個月前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.聊天命令以及如何使用它們
1 個月前 By 尊渡假赌尊渡假赌尊渡假赌

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

如何創建和發布自己的JavaScript庫? 如何創建和發布自己的JavaScript庫? Mar 18, 2025 pm 03:12 PM

文章討論了創建,發布和維護JavaScript庫,專注於計劃,開發,測試,文檔和促銷策略。

如何在瀏覽器中優化JavaScript代碼以進行性能? 如何在瀏覽器中優化JavaScript代碼以進行性能? Mar 18, 2025 pm 03:14 PM

本文討論了在瀏覽器中優化JavaScript性能的策略,重點是減少執行時間並最大程度地減少對頁面負載速度的影響。

前端熱敏紙小票打印遇到亂碼問題怎麼辦? 前端熱敏紙小票打印遇到亂碼問題怎麼辦? Apr 04, 2025 pm 02:42 PM

前端熱敏紙小票打印的常見問題與解決方案在前端開發中,小票打印是一個常見的需求。然而,很多開發者在實...

如何使用瀏覽器開發人員工具有效調試JavaScript代碼? 如何使用瀏覽器開發人員工具有效調試JavaScript代碼? Mar 18, 2025 pm 03:16 PM

本文討論了使用瀏覽器開發人員工具的有效JavaScript調試,專注於設置斷點,使用控制台和分析性能。

誰得到更多的Python或JavaScript? 誰得到更多的Python或JavaScript? Apr 04, 2025 am 12:09 AM

Python和JavaScript開發者的薪資沒有絕對的高低,具體取決於技能和行業需求。 1.Python在數據科學和機器學習領域可能薪資更高。 2.JavaScript在前端和全棧開發中需求大,薪資也可觀。 3.影響因素包括經驗、地理位置、公司規模和特定技能。

如何使用源地圖調試縮小JavaScript代碼? 如何使用源地圖調試縮小JavaScript代碼? Mar 18, 2025 pm 03:17 PM

本文說明瞭如何使用源地圖通過將其映射回原始代碼來調試JAVASCRIPT。它討論了啟用源地圖,設置斷點以及使用Chrome DevTools和WebPack之類的工具。

如何使用JavaScript將具有相同ID的數組元素合併到一個對像中? 如何使用JavaScript將具有相同ID的數組元素合併到一個對像中? Apr 04, 2025 pm 05:09 PM

如何在JavaScript中將具有相同ID的數組元素合併到一個對像中?在處理數據時,我們常常會遇到需要將具有相同ID�...

console.log輸出結果差異:兩次調用為何不同? console.log輸出結果差異:兩次調用為何不同? Apr 04, 2025 pm 05:12 PM

深入探討console.log輸出差異的根源本文將分析一段代碼中console.log函數輸出結果的差異,並解釋其背後的原因。 �...

See all articles