前端基礎整理-JS數據類型轉換

前言

JavaScript 是一種弱類型或者說動態語言。這意味著你不用提前聲明變量的類型,在程序運行過程中,類型會被自動確定。這也意味著你可以使用同一個變量保存不同類型的數據,本文主要介紹有關數據類型的轉換

JS數據類型

  • 基礎類型:string number boolean null undefined symbol
  • 引用類型:object

顯式類型轉換

指的是主動調用函數實現數據類型的轉換,隱式轉換主要是基于以下三種方式進行:

Number函數

  • number -> number
Number(666) // 666
  • string -> number
Number('123') // 123
Number('') // 0
Number('123sd') // NaN
  • boolean -> number
Number(true) // 1
Number(false) // 0
  • null -> number
Number(null) // 0
  • undefined -> number
Number(undefined) // NaN
  • object -> number
  1. 第一步先調用對象的valueOf方法,如果返回值為基本類型則不執行第二步
  2. 第二部調用對象的toString方法,如果返回值為符合類型則報錯
var a = {a: 1}
Number(a) // NaN
/** 內部執行流程 **/
var tmp1 = a.valeOf() // {a: 1}
var tmp2 = tmp.toString() // "[object Object]"
Number(tmp2) // NaN

String函數

  • number -> string
String(123) // '123'
  • string -> string
String('123') // '123'
  • boolean -> string
String(true) // 'true'
String(false) // 'false'
  • null -> string
String(null) // 'null'
  • undefined -> string
String(undefined) // 'undefined'
  • object -> string
  1. 第一步先調toString方法,如果返回值不是基礎類型執行第二步
  2. 第二步調用valueOf方法,如果返回值不是基礎類型,報錯
var a = {a: 1}
String(a) // '[object Object]'
驗證工作原理
a.toString = function () { return 'hi' }
String(a) // 'hi'
a.toString = function () { return [] }
a.valueOf = function () { return 'hello world' }
String(a) // 'hello world'
a.valueOf = function () { return {b: 1} }
String(a) // 報錯
Error: Uncaught TypeError: Cannot convert object to primitive value
        at String ()
        at :10:1

Boolean函數

Boolean(+0)
Boolean(-0)
Boolean(NaN)
Boolean('')
Boolean(false)
Boolean(undefined)
Boolean(null)
// 都為false其余都為true

隱式類型轉換

隱式轉換的基石就是js引擎自動調用顯示類型轉換的方法,在以下三種情況下發生:

四則運算

+ 轉String類型
1 + 'asd123' // '1asd123'
- * / 轉Number類型
1 - 'asd123' // NaN
1 / 'asd123' // NaN
1 * 'asd123' // NaN

判斷語句

轉Boolean類型
1 - 'asd' || true // true
if ( 1 - 'asd') { ... } // false

native調用

按上述規則進行隱式轉換
console.log(1-'asd123') // NaN
console.log(1 + 'asd123') // '1asd123'
...

類型檢測typeof

參考資料

  • MDN
  • MKW

你可能感興趣的

广东25选5开奖结果