資料結構
網路
關係型資料庫管理系統
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
時尚研究
法律研究如何使用 JavaScript 將字元轉換為 ASCII 碼？
ASCII 代表美國資訊交換標準程式碼，這是一種透過將字元分配給特定的數值來對字元進行編碼的方法。這些分配的數值稱為 ASCII 碼，廣泛用於計算機系統中表示各種字元，包括字母、數字、標點符號和特殊控制字元。
示例 1：使用 charCodeAt()
以下程式碼演示了一個程式，該程式使用 'charCodeAt()' 函式接收使用者輸入的字元，然後顯示該字元對應的 ASCII 碼。
語法
string.charCodeAt(index)
演算法
步驟 1：開始宣告 HTML 標籤。
步驟 2：使用內部 CSS 為網頁新增一些 UI 功能。
步驟 3：建立一個輸入欄位，允許使用者輸入字元。
步驟 4：建立一個按鈕，該按鈕將觸發一個函式將字元轉換為 ASCII。
步驟 5：建立一個指令碼標籤。
步驟 6：在 <script> 標籤內宣告一個轉換函式。
步驟 7：宣告輸入變數以接收使用者輸入。
步驟 8：使用 charCodeAt() 函式將字元轉換為 ASCII 值。
示例
<!DOCTYPE html>
<html>
<head>
<title>Character to ASCII Converter</title>
//CSS Styling from here
<style>
body {
font-family: Arial, sans-serif;
background-color: #f5f5f5;
margin: 0;
padding: 20px;
text-align: center;
}
h1 {
color: #333;
}
.container {
max-width: 400px;
margin: 0 auto;
background-color: #fff;
padding: 20px;
border-radius: 5px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
input[type="text"] {
width: 100%;
padding: 10px;
margin-bottom: 10px;
border: 1px solid #ccc;
border-radius: 3px;
box-sizing: border-box;
font-size: 16px;
}
button {
width: 100%;
padding: 10px;
background-color: #4caf50;
color: #fff;
border: none;
border-radius: 3px;
cursor: pointer;
font-size: 16px;
}
p {
margin-top: 10px;
font-size: 18px;
}
</style>
</head>
<body>
<div class="container">
<h1>Character to ASCII Converter</h1>
//Designing input area for user
<input type="text" id="inputText" placeholder="Enter a character">
//creating button that convert the value
<button onclick="convert()">Convert</button>
<p id="output"></p>
</div>
<script>
//Javascript code for converting characters to ASCII code
//creating function that will invoke as the user click on the button
function convert() {
const input = document.getElementById("inputText").value;
const asciiCode = input.charCodeAt(0);
document.getElementById("output").textContent = `ASCII code: ${asciiCode}`;
}
</script>
</body>
</html>
這個內建函式以字串和索引作為引數，並返回該索引處字元的 ASCII 碼。在 HTML 示例中，使用者在輸入欄位中輸入一個字元。當單擊“轉換”按鈕時，JavaScript 程式碼檢索字元，應用 charCodeAt() 函式，並在網頁上顯示 ASCII 碼。
示例 2 - 使用 codePointAt()
codePointAt() 函式是 JavaScript 中字串的固有方法。它準確地獲取指定索引處字元的 Unicode 碼點值。
在此特定程式碼中，它用於從使用者輸入中檢索第一個字元的 Unicode 碼點值並將其作為輸出顯示。
語法
const codePoint = input.codePointAt(0);
示例
<!DOCTYPE html>
<html>
<head>
<title>Character to ASCII Converter Using charPointAt()</title>
//CSS Styling from here
<style>
body {
font-family: Arial, sans-serif;
background-color: #f5f5f5;
margin: 0;
padding: 20px;
text-align: center;
}
h1 {
color: #333;
}
.container {
max-width: 400px;
margin: 0 auto;
background-color: #fff;
padding: 20px;
border-radius: 5px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
input[type="text"] {
width: 100%;
padding: 10px;
margin-bottom: 10px;
border: 1px solid #ccc;
border-radius: 3px;
box-sizing: border-box;
font-size: 16px;
}
button {
width: 100%;
padding: 10px;
background-color: #4caf50;
color: #fff;
border: none;
border-radius: 3px;
cursor: pointer;
font-size: 16px;
}
p {
margin-top: 10px;
font-size: 18px;
}
</style>
</head>
<body>
<div class="container">
<h1>Character to ASCII Converter Using charPointAt()</h1>
//Designing input area for user
<input type="text" id="inputText" placeholder="Enter a character">
<button onclick="convert()">Convert</button>
<p id="output"></p>
</div>
//Javascript code for converting characters to ASCII code
<script>
//creating function that will invoke as the user click on the button
function convert() {
const input = document.getElementById("inputText").value;
const codePoint = input.codePointAt(0);
document.getElementById("output").textContent = `Unicode code point: ${codePoint}`;
}
</script>
</body>
</html>
提供的程式碼使用一個名為“codePointAt()”的 JavaScript 函式將字元轉換為其對應的 Unicode 碼點。它包含一個輸入欄位，您可以在其中鍵入一個字元。單擊“轉換”按鈕後，程式碼計算並顯示輸入字元的 Unicode 碼點。輸出顯示在 id 為“output”的段落元素中。此功能方便您獲取字元的 Unicode 碼點值。
結論
在 JavaScript 中將字元轉換為 ASCII 碼是基本操作，在各種程式設計場景中都有實際應用。透過使用 charCodeAt() 和 charPointAt() 等方法，開發人員可以輕鬆獲取字元的 ASCII 碼或 Unicode 碼點值。無論您需要專門處理 ASCII 碼還是處理更廣泛的字元，JavaScript 都提供了這些多功能方法來幫助您高效準確地執行字元到 ASCII 的轉換。
2K+ 次檢視
