一篇文章帶你了解JavaScript類型轉(zhuǎn)換
一、運(yùn)算符的類型
typeof運(yùn)算符可以幫助你找到你的變量的類型。typeof運(yùn)算符返回一個變量或表達(dá)式的類型。
例：
- <!DOCTYPE html>
- <html>
- <title>項(xiàng)目</title>
- <body style="background-color: aqua;">
- <h1> JavaScript typeof運(yùn)算符</h1>
- <p> typeof運(yùn)算符返回變量或表達(dá)式的類型：</p>
- <script>
- document.write(
- typeof "" + "<br>" +
- typeof "Json" + "<br>" +
- typeof "42" + "<br>" +
- typeof 42 + "<br>" +
- typeof true + "<br>" +
- typeof false + "<br>" +
- typeof undefined + "<br>" +
- typeof null + "<br>" +
- typeof {
- name: "Json",
- age: 22
- } + "<br>" +
- typeof [2, 4, 6, 8] + "<br>" +
- typeof
- function myFunc() {}
- );
- </script>
- <p> <b>注意：</b> <b> typeof </b>
- 運(yùn)算符為數(shù)組返回"object"，因?yàn)樵贘avaScript數(shù)組中是對象。</p>
- </body>
- </html>
可以使用typeof運(yùn)算符查找JavaScript變量的數(shù)據(jù)類型。
二、類型轉(zhuǎn)換
1. 將值轉(zhuǎn)換為字符串
通過調(diào)用String()函數(shù) 或 x.toString()方法將值顯式轉(zhuǎn)換為字符串。通過該String()函數(shù)，將值true傳遞給參數(shù)，從而將布爾值轉(zhuǎn)換為字符串。
- String(true);// 返回 "true"
數(shù)字傳遞給函數(shù)。
- String(108);// 返回 "108"
使用typeof運(yùn)算符檢查類型。
- typeof String(true); // 返回 "string"
- typeof String(108); // 返回 "string"
x.toString()以類似的方式使用方法。可以將x替換為變量。
- <script>
- let temp = 108;
- document.querySelector("#output").innerHTML = temp.toString();
- </script>
或者，可以將值放在括號內(nèi)，而不是使用x.toString()進(jìn)行變量設(shè)置。
- (9048).toString();// 返回 "9048"
- (false).toString(); // 返回 "false"
- (50 + 20).toString(); // 返回 "70"
通過使用String()或，x.toString()可以將Boolean或number數(shù)據(jù)類型的值顯式轉(zhuǎn)換為字符串值，以確保的代碼按預(yù)期運(yùn)行。
2. 將值轉(zhuǎn)換為布爾值
將數(shù)字或字符串轉(zhuǎn)換為布爾值，使用該Boolean()函數(shù)。任何被解釋為空的值(例如數(shù)字0，空字符串或未定義或NaN或null的值)都將轉(zhuǎn)換為false。
- <script>
- document.write(
- Boolean(0) + "<br>" +
- Boolean("") + "<br>" +
- Boolean(undefined) + "<br>" +
- Boolean(NaN) + "<br>" +
- Boolean(null)
- );
- </script>
其他值將轉(zhuǎn)換為true，包括由空格組成的字符串文字。
- <script>
- document.write(
- Boolean(50) + "<br>" +
- Boolean(-50) + "<br>" +
- Boolean(3.14) + "<br>" +
- Boolean("false") + "<br>" +
- Boolean("Hello World")
- );
- </script>
注意：
“ 0”作為字符串文字將轉(zhuǎn)換為true，因?yàn)樗且粋€非空的字符串值。
- Boolean("0"); // 返回 true
將數(shù)字和字符串轉(zhuǎn)換為布爾值可以使能夠評估二進(jìn)制內(nèi)的數(shù)據(jù)，并且可以利用它來指定程序中的指定流。
3. 將數(shù)組轉(zhuǎn)換為字符串
該toString()方法將數(shù)組轉(zhuǎn)換為(逗號分隔)數(shù)組值的字符串。
- var months = ["Jan", "Feb", "Mar", "Apr", "May"];
- document.getElementById("result").innerHTML = months.toString();
該join()方法還將數(shù)組的所有元素轉(zhuǎn)換為新的字符串。
此方法的行為類似于toString()，還可以指定分隔符。
- <script>
- var fruits = ["Banana", "Apple", "Mango"];
- var result = document.getElementById("result");
- result.innerHTML = fruits.join("") + "<br>";
- result.innerHTML += fruits.join(" ") + "<br>";
- result.innerHTML += fruits.join(" + ") + "<br>";
- result.innerHTML += fruits.join(" / ") + "<br>";
- result.innerHTML += fruits.join(" © ");
- </script>
4. 將字符串轉(zhuǎn)換為數(shù)組
該split()方法將字符串拆分為子字符串?dāng)?shù)組，然后返回新數(shù)組，使用該split()方法通過以表示的空格字符分隔數(shù)組 " "。
- var str = 'Helow World is an Amfhyeaadehe.';
- var arr = str.split(" ");
arr變量中有了一個新數(shù)組，可以使用索引號訪問每個元素。
- arr[0]; // Air
- arr[2]; // is
使用“ i”作為分隔符。
- <script>
- function myFunc() {
- var str = 'Air Pollution is introduction of chemicals to the atmosphere.';
- var arr = str.split("i");
- document.getElementById('x').innerHTML = arr;
- }
- </scrip
如果將空字符串("")用作分隔符，則該字符串將轉(zhuǎn)換為字符數(shù)組。
- <script>
- function myFunc() {
- var str = 'Air Pollution is introduction of chemicals to the atmosphere.';
- var arr = str.split("");
- document.getElementById('x').innerHTML = arr;
- }
- </script>
三、總結(jié)
本文基于JavaScript 基礎(chǔ)。介紹了JavaScript 類型轉(zhuǎn)換，對于每一種類型轉(zhuǎn)換，對于每一種轉(zhuǎn)換需要注意的點(diǎn)，在實(shí)際項(xiàng)目遇到的難點(diǎn)，提供了有效的解決方案。
通過案例的分析，希望能夠幫助讀者更好的理解JavaScript 。
