学习笔记:JS数据类型及转换

125 阅读4分钟

一、堆栈内存

  • 栈(Stack ):存放变量;在内存中自动分配内存空间。 

  • 堆(Heap):存放复杂对象;在内存中动态分配内存空间的,不一定会自动释放,用完后一般将对象手动置为null。 

原始类型是按值形式存放在栈中的数据。

引用类型是存放在堆内存中,每个对象在堆内存中有一个引用地址。

二、数据类型

javaScript 的数据类型包括原始类型和引用类型(对象类型) 。 

原始数据类型:

  • String 字符串

  • Number 数值

  • Boolean 布尔值

  • Null 空值

  • Undefined 未定义

  • BigInt 数字类型

  • Symbol(ES6)

引用数据类型:

  • Object 对象

三、类型转换

0.1+0.2>0.3

原因:JS 采用的是双精度版本,这个版本就存在精度问题,计算机的信息全部转化为二进制进行存储的,那么 0.1 的二进制表示的是一个无限循环小数,该版本的 JS 采用的是浮点数标准需要对这种无限循环的二进制进行截取,从而导致了精度丢失,造成了 0.1不再是 0.1 ,截取之后 0.1 变成了 0.100...001 , 0.2 变成了 0.200...002 。所以两者相加的数大于 0.3 。

1、字符串类型转换

  • toString()

  • String()

  • 数据和 +""/'' 连接到一起都会转换为字符串;

    let a=111;

    a.toString() //"111"

    String(a) //"111"

    a+'' //"111"

2、数字类型转换:

2.1、Number()

  • 字符串转为数值:

    //如果是纯数字的字符串,则直接将其转换为数字;

    Number('123');//123

    //如果字符串中有非数字的内容,则转换为NaN;

    Number("123aaa");//NaN

    //如果字符串是一个空串或者是一个全是空格的字符串,则转换为0;

    Number('');//0

  • 布尔转为数值:

    Number(true);//1

    Number(false); //0

  • null转为数值:

    Number(null) //0

  • undefined转为数值:

    Number(undefined) //NaN

  • 对象转换为数字:先把【对象】转化为【字符串】,再转化为【数字】

2.2、parseInt()、parseFloat()

parseInt()提取字符串中的整数:如果第一位不是有效数字, 什么都提取不到, 会返回NaN

parseInt('12aaa') //12
parseInt('aaa111aaa') //NaN

parseFloat提取字符串中的小数

parseFloat('12.5.2') //12.5
parseFloat('a12.5.2') //NaN

isNaN判断数字类型: 

如果当前为数字类型,则返回 false,否则返回 true。 如果当前传入的是字符串, isNaN() 将字符串通过 Number() 方法转化为数字,然后判 断当前是否为字符串类型。

3、布尔类型转换:Boolean()

除了特殊的几个值 ‘’ 、 undefined 、 NAN 、 null 、 false 、 0 转化为 Boolean 为 false
之外,其他类型值都转化为 true 。  

Boolean("11") //true
Boolean("")//false
Boolean(undefined)//false
Boolean(null)//false
Boolean(NaN) //false

四、检测数据类型方式

  • typeof
  • instance of
  • constructor 
  • Object.prototype.toString.call()

4.1、typeof

会将检查的结果以字符串的形式返回,一般用来判断一个变量是否为空或者是什么类型。除了 null 类型以及 Object 类型不能准确判断外,其他数据类型都可能返回正确的类型。  

typeof '123' //'string'
typeof 123  // "number"  
typeof NaN // "number"  
typeof Function // ‘function'
typeof null // ‘Object’
typeof [] // 'Object'
typeof {} // 'Object'

typeof null 等于 Object?

不同的对象在底层原理的存储是用二进制表示的,在 javaScript 中,如果二进制的前三位都为 0 的话,系统会判定为是 Object 类型。 null 的存储二进制是 000 ,也是前三位,所以系统判定 null 为 Object 类型。

4.2、instance of

用来判断某个对象是不是另一个对象的实例 ,原理是通过判断该对象的原型链中是否可以找到该构造类型的 prototype 类型。

function Foo(){}
var f1 = new Foo();
console.log(f1 instanceof Foo);// true 

f1.__proto__=Foo.prototype

4.3、constructor

对于引用类型,除此之外,还可以使用 xx.constructor.name 构造函数来判断。 

// constructor 构造来判断
function Foo(){}
console.log(Foo.constructor.name) // "Function"

4.4、Object.prototype.toString.call()

一种最好的基本类型检测方式 Object.prototype.toString.call() ;它可以区分 null 、 string 、
boolean 、 number 、 undefined 、 array 、 function 、 object 、 date 、 math 数据类型。  

缺点是不能区分xx是否是yy的实例。

// 判断基本类型
Object.prototype.toString.call(null); // "[object Null]"
Object.prototype.toString.call(undefined); // "[object Undefined]"
Object.prototype.toString.call(“abc”);// "[object String]"
Object.prototype.toString.call(123);// "[object Number]"
Object.prototype.toString.call(true);// "[object Boolean]"

// 判断引用类型
function fn(){
 console.log(“xx”);
} 
var date = new Date();
var arr = [1,2,3];
var reg = /[a]at/g;

Object.prototype.toString.call(fn); // "[object Function]"
Object.prototype.toString.call(date); // "[object Date]"
Object.prototype.toString.call(arr); // "[object Array]" 
Object.prototype.toString.call(reg); // "[object RegExp]"