JavaScript 数据类型转换与类型判断详解

内置类型

JavaScript 中有 7 中内置类型,分为基本类型引用类型

(1)基本类型

  • null
  • undefined
  • boolean
  • number
  • string
  • symbol ES6新增
  • bigint(ES6+新增)

其中NaN属于number,但是NaN !== NaN

基本类型变量都保存在栈内存中。

BigInt

为了能准确表示最大精度以外的数,es6新增了BigInt类型,直译过来就是大整数

BigInt的写法是数字后面再加上n。它的数据类型是bigint

注意:只有整数才能加n。小数会报错。同时不能直接带+

var num = 123n
typeof num // 'bigint'
console.log(BigInt(123)) // 123n
console.log(BigInt(true)) // 1n
String(1n) // "1"
Number(1n) // 1
 
(2)引用类型
  • Object
  • Array
  • Function
  • Date

函数、对象、数组,都属于object

引用类型变量保存在栈内存中,保存在堆内存中,通过指针来指向堆内存中对应的值。

js内存分为栈内存(stack)和堆内存(heap)

栈内存:是一种特殊的线性表,它具有后进先出的特性,存放基本类型。

堆内存:存放引用类型(在栈内存中存一个基本类型值保存对象在堆内存中的地址,用于引用这个对象)。

类型判断

typeof

(1)基本类型

除了null显示object,其他的类型都能正常显示自身的数据类型。

console.log(typeof null); // object
console.log(typeof undefined); // undefined
console.log(typeof true); // boolean
console.log(typeof 1); // number
console.log(typeof 'abc'); // string
console.log(typeof Symbol()); // symbol

(2)引用类型

除了函数显示function,其他的都能显示object

console.log(typeof console.log); // function
console.log(typeof {}); // object
console.log(typeof []); // object

instanceof运算符

判断一个变量是数组还是对象

instance运算符用于通过查找原型链来检测某个变量是否为某个类型数据的实例

        const a = [0, 1, 2];
        console.log(a instanceof Array); // true
        console.log(a instanceof Object); // true

Object.prototype.toString 函数

每种引用类型都会直接或者间接继承自Object类型,因此它们都包含toString()函数。不同数据类型的toString()类型返回值也不一样

  • 对于 number 类型,结果是 [object Number]
  • 对于 boolean 类型,结果是 [object Boolean]
  • 对于 null:[object Null]
  • 对于 undefined:[object Undefined]
  • 对于数组:[object Array]
总结

 

基本的类型检测用typeof,引用类型检测用instanceof,还有专门用于检查是不是数组的Array.isArray()

let a = "b" 
let b = true 
let c = '123'
let d = 123 
function e(){} 
let f = undefined
let g = null
let h = /[a-z]/
let i = {}
let k = [1,2,3]

typeof 运行结果

typeof a    'string'
typeof b    'boolean'
typeof c    'string'
typeof d    'number'
typeof e    'function'
typeof f    'undefined'
typeof g    'object'
typeof h    'object'
typeof i    'object'
typeof k    'object'

instanceof

e instanceof Function        true
h instanceof RegExp          true
i instanceof Object          true
k instanceof Array           true
Array.isArray(k)             true
Array.isArray(i)             false

Object.prototype.toString.call()

Object.prototype.toString.call(a)   '[object String]'
Object.prototype.toString.call(b)   '[object Boolean]'
Object.prototype.toString.call(c)   '[object String]'
Object.prototype.toString.call(d)   '[object Number]'
Object.prototype.toString.call(e)   '[object Function]'
Object.prototype.toString.call(f)   '[object Undefined]'
Object.prototype.toString.call(g)   '[object Null]'
Object.prototype.toString.call(h)   '[object RegExp]'
Object.prototype.toString.call(i)   '[object Object]'
Object.prototype.toString.call(k)   '[object Array]'

类型转换

在 JavaScript 中,只有3种类型转换:

  • 转为boolean
  • 转为string
  • 转为number
 

显式类型强制转换是指当开发人员通过编写适当的代码用于在类型之间进行转换,比如:Number(value)

隐式类型转换是指在对不同类型的值使用运算符时,值可以在类型之间自动的转换,比如 1 == null

原始值 转换目标 结果
number boolean 0+0-0NaNfalse,其余为true
string boolean ''false,其余为true
nullundefined boolean false
引用类型 boolean true
number string 2 => '2'
boolean string true => 'true'
数组 string [1, 2] => '1,2'
对象 string '[object Object]'
string number '1' => 1'a' => NaN
数组 number [] => 0、只有一个数[2] => 2、其余NaN
null number 0
除了数组引用类型 number NaN
symbol number Cannot convert a Symbol value to a numbe
 
 
 
 
例题:
let result = 100 + true + 21.2 + null + undefined + "Tencent" + [] + null + 9 + false;
// result应该是?

1.首先100 + true
+连接符两边存在Number类型,true转number为1,进行加法运算,结果为:101
2.101 + 21.2
+连接符两边均为Number类型,进行加法运算,结果为:122.2
3.122.2 + null
+连接符两边存在Number类型,null转number为0,进行加法运算,结果为:122.2
4.122.2 + undefined
+连接符两边存在Number类型,undefined转number为NaN,NaN与任何数据类型计算都为NaN,结果为:NaN
5.NaN + "Tencent"
+连接符两边存在String类型,NaN转string为"NaN",进行字符串拼接,结果为:"NaNTencent"
6."NaNTencent" + []
+连接符两边存在String类型,[]转string为"",进行字符串拼接,结果为:"NaNTencent"
7."NaNTencent" + null
+连接符两边存在String类型,null转string为"null",进行字符串拼接,结果为:"NaNTencentnull"
8."NaNTencentnull" + 9
+连接符存在String类型,9转string为"9",进行字符串拼接,结果为:"NaNTencentnull9"
9."NaNTencentnull9" + false
+连接符存在String类型,false转string为"false",进行字符串拼接,结果为:"NaNTencentnull9false"
阅读剩余
THE END