如何在 JavaScript 中建立貨幣轉換器?
在本教程中,我們將討論如何在 JavaScript 中建立貨幣轉換器。我們將討論建立此類轉換器涉及的各個步驟。
什麼是貨幣轉換器?
貨幣轉換器是一種幫助您將一種貨幣轉換為另一種貨幣的工具。例如,如果您來自美國並且要前往歐洲旅行,則需要使用貨幣轉換器將您的美元轉換為歐元。
為什麼使用 JavaScript 建立貨幣轉換器?
JavaScript 是一種用途廣泛的程式語言,可用於建立各種應用程式,包括基於 Web 的應用程式。在建立貨幣轉換器方面,JavaScript 提供了許多優勢,例如
易用性 − 與其他程式語言相比,JavaScript 相對易於學習和使用。這使其成為建立貨幣轉換器應用程式的理想選擇。
跨平臺相容性 − JavaScript 程式碼可以在不同的平臺上執行,例如 Windows、Mac 和 Linux。這使得可以建立可在不同平臺上使用的貨幣轉換器。
流行度 − JavaScript 是世界上最流行的程式語言之一。這意味著有一個龐大的開發者社群可以根據需要提供支援和幫助。
示例 1
現在我們已經討論了一些使用 JavaScript 建立貨幣轉換器的理由,讓我們看一下建立貨幣轉換器的程式碼。
以下是完整的可執行程式碼。
<!doctype html> <HTML> <head> <title>How to Create a Currency Converter in JavaScript</title> </head> <body> <h1>Currency Converter</h1> <p> Select Currency and enter Amount to convert.</p> <form> <label>From:</label> <select id="from"> <option value="USD">USD</option> <option value="EUR">EUR</option> <option value="GBP">GBP</option> <option value="INR">INR</option> </select> <label>To:</label> <select id="to"> <option value="USD">USD</option> <option value="EUR">EUR</option> <option value="GBP">GBP</option> <option value="INR">INR</option> </select> <label>Amount:</label> <input type="text" id="amount" /> <button type="button" id="convert">Convert</button> <p id="result"></p> </form> <script> const convert = document.getElementById("convert"); const result = document.getElementById("result"); const from = document.getElementById("from"); const to = document.getElementById("to"); const amount = document.getElementById("amount"); convert.addEventListener("click", function() { let fromCurrency = from.value; let toCurrency = to.value; let amt = amount.value; fetch(`https://api.exchangerate-api.com/v4/latest/${fromCurrency}`) .then(response => { return response.json(); }) .then(data => { let rate = data.rates[toCurrency]; let total = rate * amt; result.innerHTML = `${amt} ${fromCurrency} = ${total} ${toCurrency}`; }); }); </script> </body> </html>
在上面的程式碼中,我們建立了一個可以將 USD 轉換為 EUR、GBP 和 INR 的貨幣轉換器。
注意 − 您也可以輕鬆修改程式碼以支援其他貨幣。
結論
在 JavaScript 中建立貨幣轉換器是一項相對簡單的任務。您只需使用 JavaScript 程式語言建立基於 Web 的應用程式即可。您可以使用本教程中提供的程式碼建立可以將 USD 轉換為 EUR、GBP 和 INR 的貨幣轉換器。
廣告