数据类型及转换

发表于 | 分类于

一、基本数据类型

Null、Undefined、Boolean、String、Number、symbol

其中 JS 的数字类型是浮点类型的，没有整型。并且浮点类型基于 IEEE 754标准实现，在使用中会遇到某些 Bug。

NaN 也属于 number 类型，并且 NaN 不等于自身。

基本类型和引用类型的区别

基本数据时按值访问的，可以操作保存在变量中实际的值。引用类型的值保存在内存的对象中。JS不能直接操作对象的内存空间，实际上是在操作对象的引用而不是实际的对象，引用类型的值是按引用访问的。

  1. 动态的属性：不能给基本类型的值添加属性，只能给引用类型值动态的添加属性
  2. 复制变量值
  • 从一个变量向另一个变量复制基本类型的值时，会在变量对象上创建一个新值，然后把该值复制到为新变量分配的位置上。两者完全独立互不影响，后者只是前者的一个副本
  • 复制引用类型的值时，放入的值是一个指针，指向存储在堆中的一个对象。复制完后，两个变量实际上引用同一个对象。会互相影响
  1. 传递参数：所有函数的参数都是按值传递的

    按值传递时，参数传入的是对象也会按引用来访问同一个对象

    1
    2
    3
    4
    5
    6
    7
    8
    9
    function setName(obj){
        obj.name= 'fr'
        obj= new Object()
        obj.name= 'after'
    }

    const person= new Object()
    setName(person)
    console.log(person.name) // 'fr'

当函数内部重写obj时，这个变量引用的就是一个局部对象，在函数执行完后立即被销毁

二、检测数据类型

  1. typeof
  2. Object.prototype.toString.call()
  3. instanceof

1. typeof

number、string、boolean、undefined、object、function、symbol

  • typeof 对于基本类型，除了 null 都可以显示正确的类型
  • 没有声明的变量和没有初始化的变量，都会显示 undefined
  • typeof NaN=== number
  • typeof 对于对象除了函数都会显示 object。另外null也返回object

因为在 JS 的最初版本中，使用的是 32 位系统，为了性能考虑使用低位存储了变量的类型信息，000 开头代表是对象，然而 null 表示为全零，所以将它错误的判断为 object 。虽然现在的内部类型判断代码已经改变了，但是对于这个 Bug 却是一直流传下来。

空的对象的引用/空对象指针

function（函数）也是 JS 的一个内置类型？它实际上是 object 的一个子类型。具体来说，函数是“可调用对象”，它内部有一个 [[Call]] 属性，可以使其被调用。所以用 typeof 区分函数和其他对象是有必要的。

2. Object.prototype.toString.call

获得类似 [object Type] 的字符串，14种

3. instanceof：

用来判断一个构造函数的prototype是否在要检查对象的原型链上

1
obj instanceof constructor // Object.prototype是否在obj的原型链上

所用引用类型的值都是Object的实例，所以第二个参数为Object的时候都返回true。当使用instanceof检测基本类型的时候总是返回false

三、null 和 undefined

1. 区别

  • null：表示没有对象，即该处不应该有值
  • undefined：表示缺少值，没有定义
    （变量声明未赋值、调用函数时参数没有提供）

    2. 关于检测 undefined 和null

  1. 检测undefined：typeof(exp) === ‘undefined’
  2. 检测null: 
1
if(!exp && typeof(exp)!=='undefined' && exp!== 0 )
  • nudefined == null //true
  • 隐式转换：undefined——false、null——0
  • Number(undefined) //NaN
  • Number(null) //0
1
2
3
4
5
6
7
8
9
10
let a
// 我们也可以这样判断 undefined
a === undefined
// 但是 undefined 不是保留字，能够在低版本浏览器被赋值
let undefined = 1
// 这样判断就会出错
// 所以可以用下面的方式来判断，并且代码量更少
// 因为 void 后面随便跟上一个组成表达式
// 返回就是 undefined
a === void 0

四、类型转换

1. 转Boolean

在条件判断时，除了 undefined， null， false， NaN， ‘’， 0， -0，其他所有值都转为 true，包括所有对象。

可以对任何数据类型的值调用Boolean()，总会返回一个Boolean值。或者if语句

== 和 ===

  • == 在做比较时，会先做一定的类型转换
  1. String、Boolean与Number比较时，会转换成Number
  2. 若引用类型与基本类型比较时，引用类型会转换成基本数据类型。
  • === 严格相等，类型相同，值相同
  • 引用类型之间做比较时，== 与=== 相同，看是否指向同一个对象

基本概念

  1. 区分大小写
  2. 标识符：变量、函数、属性的名字或函数的参数

    第一个字符必须是字母/下划线/美元符号$。其他字符可以是字母、下划线、$或数字。
    字母也可以包含拓展的ASC2或Unicode字母字符。标识符一般采用驼峰的格式

  3. 严格模式 strict mode：为JS定义了一种不同的解析和执行模型
1
2
// 在整个脚本启用严格模式，在顶部添加
"use strict"

1）Number类型

1. 八进制

第一位必须是0，然后是0-7，如果字面值中的数值超出了范围，那么前导零会被忽略，后面的数值被当作十进制数值解析

2. 十六进制

前两位必须是0x，后面为0-9及A-F（字母大写、小写都可以）

3. 浮点数值：

数值中必须包含一个小数点，并且小数点后面必须有一位数字。小数点前面可以没有整数，但不推荐。

保存浮点数值需要的内存空间是保存整数值的两倍，因此JS会不失时机的将浮点数值转换为整数。如果小数点后面没有跟任何数字，那么这个数值就可以作为整数来保存。如果浮点数值本身就是一个整数(1.0)，那么也会被转换为整数

1
2
const num1= 1. //小数点后面没有数字，解析为1
const num2= 10.0 //整数，解析为10

对于极大/极小的数值，可以用e表示法（科学计数法）表示的浮点数值表示。默认情况下，JS会将那些小数点和面带有6个0以上的浮点数值转换为e表示法表示的数值

1
2
const num= 3.125e7 //3125000
// 其那面是一个数值。中间是小写/小写的e，后面是10的幂中的指数

浮点数值最高精度是17位小数，但在进行算术计算时精度远远不如整数。使用基于IEE754数值的浮点计算的通病。

1
0.1+0.2 // 0.3000 0000 0000 00004

4. 数值范围

  • js能够与表示的最小数值保存在Number.MIN_VALUE中，大多浏览器中是5e-324(-Infinity)
  • 表示的最大数值保存在Number.MAX_VALUE中，大多浏览器中是1.79769348623157e+308(Infinity)
  • 如果计算的结果超出的JS的数值范围，那么将自动转换成特殊的Infinity值。负数转为-Infinity（负无穷），整数转为Infinity（正无穷）

5. NaN

NaN非数值，是一个特殊的数值。这个数值用来表示一个本来要返回数值的操作数未返回数值的情况（这样就不会抛出错误了）

  1. 任何涉及NaN的操作，都会返回NaN（注意在多步计算中可能导致的问题）
  2. NaN与任何值都不相等，包括本身
  3. isNaN()：判断参数是否 ‘不是数值’

    isNaN()在接收到一个值时，会尝试将这个值转换为数值。在基于对象调用isNaN()会先调用对象的valueOf()方法，然后确定该方法返回的值是否可以转换为数值。如果不能，则基于这个返回值再调用toString()方法，再测试返回值

6. 数值转换

有3个函数可以把非数值转换为数值：Number()，转型函数，可以用于任何类型；parseInt()、parseFloat()，专门用于把字符串转为数值

Number()
  1. 数字值：简单的传入和传出
  2. Boolean：true——1、false——0
  3. null——0
  4. undefined——NaN
  5. 字符串（除了空字符串，其他都会忽略字符富川前面的空格）
  • 空字符串’’——0
  • 字符串只包含数字（包括前面带正号/负号），转换为10进制，前导零会忽略（’011’变成11）
  • 字符串中包含有效的浮点格式，将其转换成对应的浮点数值（前导零会被忽略）
  • 字符串中包含有效的十六进制格式，将其转换为相同大小的十进制整数（’0x10变成16’）
  • 其余——NaN（’0b’——NaN）
  1. 对象

    先调用对象的valueOf()方法，然后用上面的方法确定该方法返回的值是否可以转换为数值。如果不能，则基于这个返回值再调用toString()方法，再用上面的方法

一元加++、–、+（正）、-（负） 操作符的操作与Number相同

paresInt()

parseInt 函数将其第一个参数转换为字符串，解析它，并返回一个整数或NaN。如果不是NaN，返回的值将是作为指定基数（基数）中的数字的第一个参数的整数。

忽略字符串前面的空格，直到找到第一个非空格字符。如果第一个字符不是数字字符或者负号，返回NaN。如果第一个字符是数字字符，会继续解析第二个字符，直到解析完所有后续字符或者遇到了一个非数字字符（遇到非数字字符时忽略后面的）。

  • parseInt()将空字符串’’转为NaN，而Number()转为0
1
2
3
4
'' —— NaN
'123blue' —— 123
'22.5' —— 22
// 小数点不是有效的数字字符

parseInt()能够识别出各种整数格式（十进制/八进制/十六进制），如果字符串以’0x’开头且后面跟着数字字符，就会当做一个十六进制数来解析

‘0’开头当做八进制数解析，但是在JS5中不具有解析八进制的能力，前导零会被忽略，当做一个十进制数来解析

1
'0xf' —— 15

第二个参数，指定基数

一个介于2和36之间的整数(数学系统的基础)，表示上述字符串的基数。
默认基数是10

返回值

返回解析后的整数值。 如果被解析参数的第一个字符无法被转化成数值类型，则返回 NaN。

1
2
parseInt(字符串,进制)
// 字符串前面可以不带'0x'

1
2
parseInt('af') // NaN
parseInt('af', 16) // 175

如果 parseInt 遇到了不属于radix参数所指定的基数中的字符那么该字符和其后的字符都将被忽略。接着返回已经解析的整数部分。parseInt 将截取整数部分。开头和结尾的空白符允许存在，会被忽略。

在基数为 undefined，或者基数为 0 或者没有指定的情况下，JavaScript 作如下处理：

  • 如果字符串 string 以”0x”或者”0X”开头, 则基数是16 (16进制).
  • 如果字符串 string 以”0”开头, 基数是8（八进制）或者10（十进制），那么具体是哪个基数由实现环境决定。ECMAScript 5 规定使用10，但是并不是所有的浏览器都遵循这个规定。因此，永远都要明确给出radix参数的值。
  • 如果字符串 string 以其它任何值开头，则基数是10 (十进制)。
    如果第一个字符不能被转换成数字，parseInt返回NaN。

paresFloat()

  • 字符串中的第一个小数点是有效的。
  • 十六进制格式的字符串始终会被转换成0
  • 因为parseFloat值解析十进制值，因此没有用第二个参数指定基数的用法
1
2
3
4
5
6
7
8
9
10
11
parseFloat('0xf') //0
parseFloat('0908.5') //908.5
parseFloat('3.125e7') //31250000


['1','2','3'].map(parseInt)
//  parseInt('1', 0) -> 1
//  parseInt('2', 1) -> NaN
//  parseInt('3', 2) -> NaN

// 后面两个不在范围内

2）String类型

String类型用于表示由0或多个16位Unicode字符组成的字符序列

  1. 字符字面量：转义字符，用于非打印字符
1
2
3
4
5
6
7
8
9
10
11
12
\n 换行     \b 退格
\t 制表     \r 回车
\f 进纸     \\ 斜杠
\' 单引号，在用单引号表示的字符串中使用
\" 双引号，在用双引号表示的字符串中使用
\xnn 以十六进制代码nn表示的一个字符(0-f)
\unnnn 以十六进制代码nnnn表示的一个Unicode字符(0-f)

'he said, \'hey.\''
"he said, \"hey.\""
\x41 表示A
\u03a3 表示希腊字符Σ
  1. str.length

    如果字符串中包含双字节字符，length可能不会精确的返回字符串中的字符数目

  2. 转换为字符串

    value.toString()

    返回相应值的字符串表现，数值、布尔、对象、字符串都有toString()方法，但null、undefined没有toString()方法
  3. 也可以传入一个参数：输出数值的基数。默认情况下，toSting()以十进制格式返回数值的字符串表示。
    1
    2
    3
    4
    5
    const num=10
    num.toString()  //10  num.toString(10)
    num.toString(2)  //1010
    num.toString(8)  //12
    num.toString(16)  //a

String(value)

  • 如果值有toString方法，则调用该方法（没有参数），并返回结果
  • 如果值是null，返回’null’
  • 如果值是undefined，返回’undefined’

3）Object类型

Object的每个势力的属性和方法

  1. constructor：保存着创建当前对象的构造函数
  2. hasOwnProperty(propertyName)：检查给定的属性在当前实例中是否存在，而不是在实例的原型中
  3. isPrototypeOf(object)：检查传入的对象是否是当前对象的原型
  4. propertyIsEnumerable(propertyName)：检查给定的属性是否能够使用for-in来枚举
  5. toLocaleString()：返回对象的字符串表示，该字符串与执行环境的地区对应
  6. toString()：返回对象的字符串
  7. valueOf()：返回对象的字符串、数值或布尔值表示。通常与toString()方法的返回值相同