js數據類型顯隱式轉換

在JavaScript中,數據類型的轉換可以分為兩種主要類型:顯式類型轉換(Explicit Type Conversion)和隱式類型轉換(Implicit Type Conversion 或 Type Coercion)。

顯式類型轉換(Explicit Type Conversion)

顯式類型轉換是程序員明確指定的類型轉換,通常通過調用特定的函數或方法來實現。JavaScript提供了以下幾種顯式類型轉換的方法:

  1. Number():將值轉換為數字類型(如果轉換失敗則返回NaN)。
    let num = Number("123"); // 123  
    let notNum = Number("hello"); // NaN
    
  2. String()?或?toString():將值轉換為字符串類型。
    let str = String(123); // "123"  
    let obj = { toString: function() { return "myObject"; } };  
    let objStr = String(obj); // "myObject"

    注意:不是所有的對象都有toString方法,如果對象沒有該方法,JavaScript會調用Object.prototype.toString方法。

  3. Boolean():將值轉換為布爾類型。
    let bool = Boolean(1); // true  
    let falsyBool = Boolean(0); // false
    
  4. parseInt()?和?parseFloat():將字符串轉換為整數或浮點數。
    let intNum = parseInt("123"); // 123  
    let floatNum = parseFloat("123.45"); // 123.45
    

    隱式類型轉換(Implicit Type Conversion 或 Type Coercion)

    隱式類型轉換是JavaScript在運行時自動進行的類型轉換,通常發生在運算符操作、函數參數傳遞或比較表達式中。

  1. 算術運算符:當算術運算符(+、-、*、/、%)用于非數字類型時,JavaScript會嘗試將它們轉換為數字。
    let result = 5 + "10"; // "510"(因為字符串連接優先于加法)  
    let numResult = 5 + (+"10"); // 15(通過一元+運算符將字符串"10"轉換為數字)
    
  2. 比較運算符:在比較操作中,如果比較的是不同類型的值,JavaScript會嘗試將它們轉換為相同的類型,通常是數字或字符串。
    let compare = 5 == "5"; // true(因為字符串"5"被轉換為數字5)
    
  3. 邏輯運算符:邏輯運算符(&&、||、!)期望它們的操作數是布爾值,但會接受任何類型的值,并嘗試將它們轉換為布爾值。
    let truthy = !!"hello"; // true(因為字符串"hello"在布爾上下文中被視為true)
    
  4. if 語句:在?if?語句中,如果測試條件不是布爾值,JavaScript會嘗試將其轉換為布爾值。
    if ("hello") {  console.log("This will be logged."); // 字符串"hello"在if語句中被轉換為true  
    }
  5. == 和 != 運算符:這兩個運算符在比較時會進行類型轉換以嘗試匹配它們的操作數。通常建議使用?===?和?!==?來避免不必要的類型轉換和潛在的錯誤。

1. 隱式轉換的規則

隱式類型轉換(Implicit Type Conversion 或 Type Coercion)在JavaScript中是一個自動發生的過程,當運算符在運算時,如果兩端的數據類型不統一,編譯器會自動嘗試將它們轉換為相同的類型,以便執行運算。這個過程在不需要顯式調用轉換函數(如Number()、String()、Boolean()等)的情況下進行。

  • Object => String => Number:當對象參與非對象到對象的比較或運算時,會首先嘗試將其轉換為字符串(如果對象具有toString()方法,則優先使用;否則,嘗試使用valueOf()方法),然后再根據需要轉換為數字。
  • Boolean => Number:布爾值在參與數值運算時會被轉換為數字,其中true轉換為1,false轉換為0。
  • undefined/null => Number:undefined和null在參與數值運算時會被轉換為NaN(非數字)或0。

2. 隱式轉換的場景

2.1 數值運算
  • 數字與字符串的加法:數字與字符串相加時,數字會被轉換為字符串,然后進行字符串拼接。例如:"5" + 3?結果為?"53"
  • 數字與字符串的減法、乘法、除法:字符串會嘗試被轉換為數字,如果轉換成功則進行數值運算;否則,結果為NaN。例如:"5" - 3?結果為?2,但?"hello" - 3?結果為 NaN。
2.2 邏輯運算
  • if語句中的條件判斷:如果條件不是布爾值,JavaScript會嘗試將其轉換為布爾值。例如:if ("hello") { ... }?中,"hello"會被轉換為true。
2.3 比較運算
  • == 和 != 運算符:這兩個運算符在比較時會嘗試將操作數轉換為相同的類型。如果操作數之一是字符串,另一個是數字,字符串會嘗試被轉換為數字。如果轉換失敗,結果取決于瀏覽器的具體實現,但通常比較的是字符串的字符Unicode編碼。
2.4 對象與字符串的相加
  • 當對象與字符串相加時,會嘗試調用對象的toString()方法(如果存在)將對象轉換為字符串。例如:{name: "John"} + " Doe"?可能會得到?[object Object] Doe(取決于對象的toString()方法實現)。

3. 注意事項

  • 隱式類型轉換可能會導致一些不易察覺的錯誤,特別是在使用==!=運算符時。因此,建議盡可能使用===!==來避免隱式類型轉換。
  • 當不確定一個變量是否會被隱式轉換時,最好使用顯式類型轉換來明確你的意圖。

綜上所述,隱式類型轉換是JavaScript在運行時為了簡化開發過程而提供的一個功能。然而,由于它的自動性和不確定性,可能會導致一些難以追蹤的錯誤。因此,在使用時需要謹慎,并盡量使用顯式類型轉換來明確你的意圖。

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/bicheng/17856.shtml
繁體地址,請注明出處:http://hk.pswp.cn/bicheng/17856.shtml
英文地址,請注明出處:http://en.pswp.cn/bicheng/17856.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

React18+TypeScript搭建通用中后臺項目實戰02 整合 antd 和 axios

配置路徑別名 tsconfig.json {"compilerOptions": {"target": "ES2020","useDefineForClassFields": true,"lib": ["ES2020","DOM","DOM.Iterable"],"module": "ESNext&quo…

磁盤分區和掛載

磁盤分區和掛載 一、磁盤 業務層面:滿足一定的需求所是做的特定操作 硬盤是什么以及硬盤的作用 硬盤:計算器的存儲設備,一個或者多個磁性的盤片做成,可以在盤片上進行數據的讀寫 連接方式:內部設備,外…

深度揭秘:藍海創意云渲染農場的五大特色功能

在當今數字化時代,影視制作、效果圖設計等領域對于高質量的渲染需求日益增長。在這個背景下,云渲染平臺成為了行業中不可或缺的一部分,它為用戶提供了高效、靈活的渲染解決方案。藍海創意云渲染農場https://www.vsochina.com/cn/render藍海創…

軟件需求分析和軟件原型開發是一會事情嗎?

軟件需求分析和軟件原型開發是軟件開發過程中的兩個重要環節,它們各自承擔著不同的任務,但又緊密相連,共同影響著軟件項目的成功。下面將詳細解釋這兩個環節的定義、目的以及它們之間的關系。 一、軟件需求分析 定義:軟件需求分析…

C++學習日記 | LAB 6 static library 靜態庫

資料來源:南科大 余仕琪 C/C Program Design LINK:CPP/week06 at main ShiqiYu/CPP GitHub 一、本節內容 本節主要介紹靜態庫和動態庫。 1.1 靜態庫和動態庫的概念 靜態鏈接和靜態庫(也稱為存檔)是鏈接器將所有使用的庫函數復制到可執行文件的結果。靜…

Javascript中的定時器有哪些?他們的區別及用法是什么?

JavaScript 中有幾種常用的定時器函數,它們的區別主要在于執行方式和行為: setTimeout(callback, delay):作用:在指定的延遲時間后執行回調函數一次。用法:通常用于延遲執行某些操作。返回值:一個定時器 ID,可用于取消定時器。setInterval(callback, delay):作用:每隔指定的延…

Linux中 “權限設置修改”

目錄 一、權限 (1)權限三大類: (2)文件的權限: (3)目錄的權限: (4)用戶的角色: 二、文件的權限位 三、修改用戶權限 &#xf…

【flutter 雙端開發】

flutter 雙端開發 開發小細節替換新的logo 開發小細節 替換新的logo 替換雙端logo 尋找三方插件 android 打包流程 android 打包流程2

小程序唯品會Authorization sign

聲明 本文章中所有內容僅供學習交流使用,不用于其他任何目的,抓包內容、敏感網址、數據接口等均已做脫敏處理,嚴禁用于商業用途和非法用途,否則由此產生的一切后果均與作者無關!wx a15018601872 本文章未…

Python---Matplotlib(2萬字總結)【從入門到掌握】

數據可視化 在完成了對數據的透視之后,可以將數據透視的結果通過可視化的方式呈現出來,簡單的說,就是將數據變成漂亮的圖表,因為人類對顏色和形狀會更加敏感,然后再進一步解讀數據背后隱藏的價值。在之前的文章中已經…

nacos安裝與使用

1.nacos簡介與安裝 什么是注冊中心(服務治理) 服務注冊:服務提供者provider,啟動的時候向注冊中心上報自己的網絡信息 服務發現:服務消費者consumer,啟動的時候向注冊中心上報自己的網絡信息,拉…

JavaScript style 樣式屬性操作

JavaScript 中可以使用 style 對象來操作元素的樣式屬性。style 對象是元素的一個屬性,通過它可以訪問和修改元素的內聯樣式屬性。 要訪問元素的樣式屬性,可以使用以下語法: element.style.property 其中,element 是要操作的元…

centos7防火墻入站白名單配置

firewall-cmd --set-default-zonedropfirewall-cmd --get-active-zone記錄下當前激活網卡firewall-cmd --permanent --change-interfaceens33 --zonedrop firewall-cmd --zonedrop --list-all 添加信任的源IP和開放端口 firewall-cmd --permanent --add-source192.168.254.1 -…

【OpenCV】圖形繪制與填充

介紹了繪制、填充圖像的API。也介紹了RNG類用來生成隨機數。相關API: line() rectangle() circle() ellipse() putText() 代碼: #include "iostream" #include "opencv2/opencv.hpp"using namespace std; using namespace cv…

ARM64的KASLR分析

基本概念 加載地址:內核解壓到物理內存上的物理起始地址 鏈接地址:內核編譯鏈接后的虛擬起始地址 我們的這篇 文章,介紹了加載地址可以是自動的,也可以是固定的;一般都是物理內存的起始地址 一個偏移 ;…

pillow學習3

Pillow庫中,圖像的模式代表了圖像的顏色空間。以下是一些常見的圖像模式及其含義: L(灰度圖):L模式表示圖像是灰度圖像,每個像素用8位表示(范圍為0-255),0表示黑色&#…

在flutter initState 方法,觸發 setState導致循環執行

在Flutter中,如果你在initState中調用了一個方法,并且這個方法可能導致狀態更新,這可能會引起無限循環,因為每次狀態更新都會再次調用initState。 為了避免這種情況,你應該檢查調用的方法是否會導致狀態更新&#xff…

圖算法新書發布會圓滿成功,大咖現場都講了啥?

5月24日,嬴圖與機工社攜手舉辦的“《圖算法:行業應用與實踐》新書發布會”圓滿成功。 現場直播在線觀眾達4000人/次左右,點贊數量超7000,直至發布會尾聲,觀看人數仍在持續增長。 通過觀眾們的反饋,我們也對…

Matplotlib 實踐指南:圖形樣式、風格與標記探索

目錄 前言 第一點:導入模塊 第二點:創建二維圖 第三點:創建統計圖 總結 前言 Matplotlib 是一個強大的數據可視化庫,可用于創建各種類型的圖形。在本文中,我們將研究如何在 Matplotlib 中設置圖形的顏色、風格和標記…

【LeetCode算法】第88題:合并兩個有序數組

目錄 一、題目描述 二、初次解答 三、官方解法 四、總結 一、題目描述 二、初次解答 1. 思路:首次想到的解法:定義一個mn長度的輔助數組,從頭遍歷這兩個數組,誰小就放進輔助數組中并且對應往后走,最后使用memcpy函…