JavaScript 類型轉換和強制轉換

注留言點贊，帶你了解最流行的軟件開發知識與最新科技行業趨勢。

JavaScript 中變量的類型轉換既可以手動進行也可以顯式進行；我們只需要手動編寫函數名稱或方法。閱讀更多。

JavaScript 中變量的類型轉換既可以手動進行也可以顯式進行；我們只需要手動編寫函數名稱或方法。這被稱為顯式類型轉換，而 JavaScript 中的類型強制是 JavaScript 中變量數據類型隱式轉換的過程。

TypeScript 中的類型轉換可以是隱式的（這是在代碼執行期間自動完成的）或顯式的（這是由開發人員完成的）。TypeScript 文件將在將代碼從JavaScript轉換為 TypeScript 后檢查錯誤，因為TypeScript具有嚴格的類型檢查。

我們知道，JavaScript中的類型轉換是指JavaScript中顯式類型轉換的過程；我們知道JavaScript中有五種數據類型，分別是String、number、boolean、object和function。但是我們只能在其中三個中使用類型轉換，它們是數字、字符串和布爾值。

在 TypeScript 中，既有雙重相等運算符（==，稱為松散相等運算符），也有三重相等運算符（===，稱為嚴格相等運算符）。我們使用這兩個運算符來比較值的相等性。

現在讓我們看看在 TypeScript 中閱讀不同的過程及其各自的方法。

轉換為字符串

在這個方法中，數字類型被轉換為 JavaScript 中的字符串數據類型。

讓我們借助一個示例來了解這一點：

String()：無論我們在String()中寫入什么，無論數據類型如何，數據類型都會轉換為字符串類型。
讓我們先看看語法，然后是示例：

String(n)

這里括號內的n是指要轉換成字符串的值。

現在讓我們在示例中實現語法：

String(1520)

String(1234)

輸出

"1520"

"1234"

在上面的代碼中，我們通過在字符串語法中寫入值，將值從數字轉換為字符串。在你的編輯器中運行上面的代碼以獲得更好更清晰的解釋。

在字符串轉換中，有一些方法。它們是：

toexponential()
toprecison()
tofixed()

現在讓我們借助示例詳細了解每種方法的使用：

toexponential()

此 JavaScript 方法將數值轉換為四舍五入的字符串符號。

讓我們先看看語法，然后是示例：

n.toExponential()

這里的.toEponential 方法是用來轉換成字符串指數形式(e+number)...

您可以在此處了解更多信息。

現在讓我們在示例中實現語法：

let n=12.654;

console.log(n.toExponential());

輸出

let n=12.654;

console.log(n.toExponential());

在上面的示例中，我們輸入了一個數字，然后以指數形式打印它，其數據類型為字符串。

toFixed()

此方法將數字轉換為固定長度的字符串，我們提供：

讓我們先看看語法，然后是示例：

n.toFixed()

這里的 . toEponential方法用于將數字轉換為其字符串固定形式。

現在讓我們在示例中實現語法：

let n=152.9054;

console.log(n.toFixed());

let n1=69.156;

console.log(n1.toFixed(2));

輸出

152

69.15

在上面的例子中，我們將上面的數字轉換成字符串，通過使用.toFixed方法，我們剛剛提到了我們要打印小數點后的位數；也就是說，如果我們不提及任何內容，那么默認情況下，用戶會將其視為零，并且不會在小數點后打印任何內容。在你的編輯器中運行上面的代碼以獲得更好更清晰的解釋。

toPrecison()

用于打印小數點后的數字，數據類型為字符串。

讓我們先看看語法，然后是示例：

n.toExponential()

這里的 .toEponential方法是用來轉換成字符串指數形式(e+number)...

現在讓我們在示例中實現語法：

let n=12.654;

console.log(n.toFixed());

let n1=18.124;

console.log(n1.toFixed(1));

輸出

12.654

18.12

在上面的示例中，我們首先將數字 (n) 作為輸入，然后使用該 .toFixed()函數，我們將數字從字符串中固定打印出來。在固定函數中，如果我們在可選參數中沒有提及任何內容，那么它會將其視為零并打印整個值。如果我們在可選參數括號中提到任何數字，那么它只會從小數部分中排除值的計數，并將打印轉換后的字符串的其余部分。

到數字類型轉換

在這個方法中，我們將看到如何借助各種內置類型將字符串轉換為數字數據類型。

數字轉換方法如下：

number()
parseFloat()
parseInt()

現在讓我們詳細了解它們中的每一個：

1.number()

在此方法中，我們只是將字符串值和布爾值轉換為數字數據類型。

讓我們先看看語法，然后是示例：

Number(n)

這里使用 Number 方法將 (n) 可以是字符串或布爾值轉換為數字數據類型。

現在讓我們在示例中實現語法：

Number('123');

Number('1520');

Number('5969');

Number(actual);// true in numeric form is 1 while false in numeric form is 0

輸出

123

1520

5969

1

Number() 我們已經通過編寫函數將值從字符串或布爾數據類型顯式轉換為數字數據類型。在你的編輯器中運行上面的代碼以獲得更好更清晰的解釋。

2.parseInt()

它用于僅將數字字符串值轉換為字符串，條件是第一部分必須是數字類型。

句法：：

parseInt(numeric_stringpart,radixpart)

例子：

parseInt(1520nlcdj)

parseInt('qwer@12222')

輸出

1520

Nan

在第二個輸出行中，輸出將是 Nan，因為它不滿足第一部分必須是數字類型的條件。

3.parseFloat()

它用于將字符串轉換為其浮點數。

讓我們看看下面的語法，然后是一個例子：

parseFloat(n)

這里 n 是將被轉換為數字數據類型的變量。

例子：

parseFloat('126.7655')

輸出

126.7655

在上面的示例中，我們已將字符串轉換為其父數字形式。

類型Boolean轉換

在此，我們將值從數字類型轉換為布爾類型。

句法：

Boolean(n)

這里括號內的 n 值將被轉換為 boolean 類型。

現在讓我們看一個例子：

Boolean(1520)

Boolean(' ')

Boolean('yash')

Boolean(null)

輸出

true

true

true

在你的編輯器中運行上面的代碼以獲得更好更清晰的解釋。

JavaScript 中的類型強制

類型強制本身就是類型轉換，但這里完成的類型轉換是隱式的；轉換和強制轉換是相同的，唯一的區別是隱式和顯式類型轉換。

類型強制也用于相同的數據類型：數字、字符串和布爾值。眾所周知，TypeScript 是 JavaScript 本身的超集，因此任何有效的 JavaScript 代碼都是有效的 TypeScript 代碼。

TypeScript 中的類型強制僅強制轉換為字符串、數字和布爾基本類型，就像在類型轉換中一樣。在 TypeScript 中，我們無法將值類型強制轉換為對象或函數。

TypeScript 有兩種典型的強制轉換形式，即隱式強制轉換和顯式強制轉換。

現在讓我們看看如何在每種類型中執行類型強制轉換：

字符串強制

它用于將非字符串值轉換為字符串類型。

讓我們借助一個例子來理解這一點：

console.log('15'+20);

console.log('29'+null);

console.log(50+'45'+null)

輸出

'1520'

'29null'

'5045null'

字符串強制轉換是使用JavaScript中的+ 運算符執行的。因此，如果我們對任何字符串使用 + 運算符，它將被轉換為字符串類型。

數字強制

然后使用帶有變量的數學運算符，我們可以將任何非數字類型轉換為數字類型。但是，我們不能在數字強制轉換中使用 + 運算符。

讓我們借助一個例子來理解這一點：

console.log('34'-34);

console.log('6'*8);

console.log('45'/45);

console.log('15'%5);

輸出

0

48

1

0

在這里，我們使用數學運算符將非數值轉換為數值；我們可以不使用 + 運算符。在你的編輯器中運行上面的代碼以獲得更好更清晰的解釋。

布爾強制

在這種類型的連接中，布爾值被轉換為數學值。

讓我們借助一個例子來理解這一點：

console.log(false-5);

console.log(true+5);

輸出

-5

6

因為我們知道在數值上true的值為1，false在數值上的值為0，所以我們可以根據它來計算。

結論

類型轉換和類型強制只是一回事。但是，隱式類型轉換和顯式類型轉換之間存在差異。
類型轉換和類型強制僅適用于數字、字符串和布爾數據類型。
類型轉換在 javascript 中非常重要，因為它可以幫助我們在需要時轉換類型。
TypeScript 中的類型轉換和強制轉換，簡單來說就是將一個值的數據類型轉換為另一種數據類型，如整數類型轉換為字符串類型、布爾類型轉換為字符串類型等。
隱式類型轉換和顯式類型轉換之間的主要區別在于，隱式轉換由 JavaScript 編譯器在幕后自動完成，而顯式轉換則由我們手動完成。

將網頁轉換為圖片，您可以使用一些庫和工具來實現。在前端開發中，常用的庫包括html2canvas和dom-to-image。這些庫允許您將HTML元素轉換為圖像。

下面是使用html2canvas庫將網頁轉換為圖像的示例代碼：

<!DOCTYPE html>  
<html>  
<head>  
  <title>Convert Webpage to Image</title>  
  <script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.3.2/html2canvas.min.js"></script>  
</head>  
<body>  
  <div id="capture">  
    <!-- 在這里放置您想要轉換為圖像的HTML內容 -->  
    <h1>Hello, World!</h1>  
    <p>This is an example of converting a webpage to an image.</p>  
  </div>  
  
  <button onclick="convertToImage()">Convert to Image</button>  
  
  <script>  
    function convertToImage() {  
      html2canvas(document.getElementById("capture")).then(canvas => {  
        var img = canvas.toDataURL("image/png");  
        var link = document.createElement("a");  
        link.href = img;  
        link.download = "webpage.png";  
        link.click();  
      });  
    }  
  </script>  
</body>  
</html>

上述代碼使用html2canvas庫來將id為"capture"的div元素轉換為圖像。當用戶點擊"Convert to Image"按鈕時，convertToImage()函數會被調用。該函數使用html2canvas對指定的HTML元素進行截圖，并將結果轉換為一個包含圖像數據的URL。然后，創建一個隱藏的鏈接元素，將圖像數據URL設置為鏈接的href屬性，并模擬點擊該鏈接以下載圖像。最后，圖像將以PNG格式下載到用戶的設備上。

請注意，html2canvas庫有一些限制和局限性，例如跨域圖像的限制、CSS樣式的復雜性等。確保在使用這些庫時仔細測試和驗證您的代碼，并查閱相關文檔以了解更多細節和選項。

者：前端小智來源：大遷世界

.md文件是markdown的一種標記語言，和html比較起來，更簡單快捷，主要體現在：標記符的數量和書寫上。

標記符的數量：html文檔需要用到數量繁多的標記符，再輔以css來控制樣式和排版，而markdown文檔只需要四個基本的標記符號就能完成同樣的事。
標記符的書寫：HTML文檔內容需要同時標記開始和結束這是一個網頁，而markdown文檔則只要在開始位置標記即可# 這是一個md文檔。下面介紹如何實現將.md文件轉換成.html文件。

方式一：使用i5ting_toc插件

需要先安裝npm(安裝node.js后會自帶npm)，然后才能安裝i5ting插件：

npm install i5ting_toc -g

執行命令行生成html文件，在輸入前要進入到對應根目錄下：

i5ting_toc -f **.md

需要注意的是：寫md文檔的特殊符號時記得添加空格。小技巧：如何快速在當前目錄打開cmd?選擇當前目錄，按住shift，然后鼠標右鍵在此處打開命令窗口(在此處打開powerShell窗口)。

方式二：使用gitbook

同樣先需要安裝node，然后運行：

npm i gitbook gitbook-cli -g

生成md文件,這個命令會生成相應的md的文件，然后在相應的文件里寫你的內容即可：

gitbook init

md轉html,生成一個_doc目錄，打開就可以看到你html文件了。

gitbook build

方式三：利用前端代碼

實現原理是采用node.js搭建服務器，讀取md文件轉化為html片斷。瀏覽器發送ajax請求獲取片段后再渲染生成html網頁。

node代碼：

var express = require('express');
var http = require('http');
var fs = require('fs');
var bodyParser = require('body-parser');
var marked = require('marked'); // 將md轉化為html的js包
var app = express();

app.use(express.static('src')); //加載靜態文件
var urlencodedParser = bodyParser.urlencoded({ extended: false });

app.get('/getMdFile',urlencodedParser, function(req, res) {
var data = fs.readFileSync('src/test.md', 'utf-8'); //讀取本地的md文件
res.end(JSON.stringify({
body : marked(data)
}));
} );

//啟動端口監聽
var server = app.listen(8088, function () {
var host = server.address().address;
var port = server.address().port;
console.log("應用實例，訪問地址為 http://%s:%s", host, port)
});

前端html：

<div id="content"> <h1 class="title">md-to-HTML web app</h1> <div id="article"> </div></div><script type="text/JavaScript" src="js/jquery-1.11.3.min.js"></script><script> var article = document.getElementById('article'); $.ajax({ url: "/getMdFile", success: function(result) { console.log('數據獲取成功'); article.innerHTML = JSON.parse(result).body; }, error: function (err) { console.log(err); article.innerHTML = '<p>獲取數據失敗</p>'; } });</script>

在線咨詢

上一篇：CSS簡史：從1.0到3.0，最終又將走向哪里？
下一篇：今天起床第一句，速查四六級成績！

您的項目需求

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

整合營銷服務商

JavaScript 類型轉換和強制轉換

注留言點贊，帶你了解最流行的軟件開發知識與最新科技行業趨勢。

JavaScript 中變量的類型轉換既可以手動進行也可以顯式進行；我們只需要手動編寫函數名稱或方法。閱讀更多。

轉換為字符串

輸出

toexponential()

輸出

toFixed()

輸出

toPrecison()

輸出

到數字類型轉換

1.number()

輸出

2.parseInt()

輸出

3.parseFloat()

例子：

輸出

類型Boolean轉換

句法：

輸出

JavaScript 中的類型強制

字符串強制

輸出

數字強制

輸出

布爾強制

輸出

結論

您的項目需求