js 数据类型

2024-01-11 14:04:52

js 数据类型

javascript中数据类型有：

Undefined 未定义；
Null 空对象；
Boolean 布尔类型；
Number 数字；
String 字符串；
Symbol 符号 es6新增；
Object 对象。

typeof操作符

typeof是一种用于判断数据类型的操作符。

使用方式如下：

let num = 10
let str = 'hello, JS'
let person = {
  name: 'JS'
}

console.log(typeof num) // number
console.log(typeof str) // string
console.log(typeof person) // object

typeof操作符返回一个表示数据类型的字符串：

undefined 未定义数据；
number 数值；
boolean 布尔值；
string 字符串；
object 对象，null也是对象的一种；
function 函数，虽然函数也是对象的一种，但是函数在js中有着不同寻常的作用，所以有必要单独设置一个function类型；
symbol 符号。

Undefined

Undefined是一种未定义数据类型的数据类型，这种类型的数据只有一个值undefined，表示还没有定义的数据。

一般不会显式的去使用Undefined，大多用于判断一个变量是否未定义。

let und // 默认设置为undefined
if (und === undefined) {
  console.log(`und 还没有定义`) // und 还没有定义
}

当一个Undefined类型的变量用于判断的时候，会自动转为false。

所以上面的栗子也可以这样吃：

let und // 默认设置为undefined
if (!und) {
  console.log(`und 还没有定义`) // und 还没有定义
}

注意：判断为false的数据不一定就是Undefined类型的，比如boolean类型数据本身就是false或者null类型都会判断为false

Null

Null类型跟Undefined有点像，Null表示引用空对象的数据，只有一个值null

使用场景：当定义一个变量时，确定这个变量为对象类型但暂时没有确定哪个对象，这个时候可以暂时定义这个变量为null

let obj = null
let a=3,b=4
if (a < b) {
  obj = {
    result: 'a小于b'
  }
}

if (obj === null) { // 'obj === null' 可以使用'!obj'替代
  console.log('obj is null')
}else {
  console.log(obj.result) // a小于b
}

Boolean

Boolean有两个值true真和false假。

一般用于做条件判断

let b = true
if (b) {
  console.log(`b=true`) // b=true
}else {
  console.log(`b=false`)
}

另外true和false有大小，可转为数字

if (true > false) {
  console.log(`true: ${Number(true)}, false: ${Number(false)}`) // true: 1, false: 0
}else {
  console.log('不可能的事情')
}

其他类型的数据也可以转为Boolean类型

true:

非0数字；
非空字符串(除了"")；
非空对象(除了null)。

false:

数字0和NaN；
空字符串：""；
对象null；
undefined。

Number

Number，顾名思义就是数字，js里面数字有整数和浮点型（也就是小数，也叫做双精度值）。

字面量格式

同一个数值的数字可以有不同的字面量格式。

比如十进制数字10

八进制显示：0o12或者0O12，es6以后八进制标准的显示格式为数字0后面加一个大小或小写的字母o/O；
十六进制显示：0xa或者0XA 以显示就是0xa。

let n = 10
let no = 0o12
let nx = 0xa

console.log(n === no) // true
console.log(n === nx) // true

NaN

NaN（Not a Number）是一个不是数字的数字。

使用typeof判断NaN的类型:

console.log(typeof NaN) // number

出现场景：

0/0，0除以0等于NaN
其他类型数据转换为Number失败时会返回NaN，比如parseInt(“hello”)返回NaN

NaN不与任何数据相等，如何判断一个数字是否为NaN？

Number中提供了一个方法isNaN()

console.log(Number.isNaN(11)) // false
console.log(Number.isNaN(parseInt('qaa'))) // true
console.log(Number.isNaN(parseInt('0xaa'))) // false
console.log(Number.isNaN(parseInt(false))) // true
console.log(Number.isNaN(parseInt('hello'))) // true

其他数据类型转换为Number

其他数据类型转换为Number有三种方式：Number()、parseInt()、parseFloat()

Number()

使用方式

console.log(Number(true)); // 1

转换规则如下：

undefined转为NaN
Boolean类型：false转为0，true转为1
null转为0
字符串：
- 如果是数字字符串会直接转为数字，忽略前面的0，并带符号
- 如果是八进制或十六禁止的数字字符串，会转为十进制数字
- 空字符串（""）转为0
- 其他字符串转为NaN
对象：首先转换对象valueOf()函数返回的值，如果转换为NaN，再转换toString()函数返回的值

吃几个栗子消化一下：

console.log(Number(true)); // 1
console.log(Number('0o11')); // 9
console.log(Number('hello')); // NaN
console.log(Number('-0011.23')); // -11.23
console.log(Number('111hello')); // NaN
console.log(Number(undefined)); // NaN
console.log(Number(null)); // 0
console.log(Number({valueOf:function (){return 11}})); // 11

parseInt()

parseInt()用于将字符串转换为Number，如果传入的第一个参数不是字符串，自动转为字符串再进行转Number操作

转换流程：

忽略字符串前面的空格字符；
如果第一个非空格字符不是数字字符、加号或减号，直接返回NaN；
如果第一个非控股字符没问题，就依次判断后面的字符，直到碰到与整数无关的字符；
如果字符串以0x或0X开头，会被当作十六进制数字转换；
无法转换科学计数法的字符串，例如’1e3’会转为1，可使用Math.floor()转换科学计数法的字符串；
可接收第二个参数，设置进制数。
举例说明：

console.log(parseInt(true)); // NaN，默认先转为'true'再转数字
console.log(parseInt('011')); // 11，以0开头不会使用八进制进行转换
console.log(parseInt('0x11')); // 17
console.log(parseInt('hello')); // NaN
console.log(parseInt('-0011.23')); // -11，忽略小数点及后面的字符
console.log(parseInt('111hello')); // 111
console.log(parseInt(undefined)); // NaN
console.log(parseInt(null)); // NaN
console.log(parseInt('')); // NaN
console.log(parseInt('aa', 16)); // 170
console.log(parseInt('0xaa', 16)); // 170
console.log(parseInt('12', 8)); // 10
console.log(parseInt('012', 8)); // 10
console.log(parseInt('1010', 2)); // 10
console.log(parseInt({toString:function (){return 11}})); // 11

parseFloat()

与parseInt()转换规则类似

只是parseFloat()只接收一个参数

可以识别一个小数点

并且不能转换除十进制的数字字符串

可以转换科学计数法字符串
上栗子：

console.log(parseFloat('0XA')); // 0
console.log(parseFloat('11.2.1')); // 11.2
console.log(parseFloat(' -0011.2')); // -11.2
console.log(parseFloat('1.34e5')); // 134000

String

字符串，一串字符，可以使用for-of或者forEach遍历字符串中的每个字符。

显示形式为单引号、双引号和反引号。

严格意义上反引号字符串属于一种js的表达式，只是这种表达式返回一个字符串。

另外字符串创建之后是无法修改的，只能创建新的空间用来存储修改后的字符串。

let a = 'hello'

for (const aElement of a) {
  console.log(aElement);
}

控制台输出：

// h
// e
// l
// l
// o

其他类型转为String

转换规则：

null转为’null’
undefined转为’undefined’
boolean转为’true’或’false’

number默认直接转为相应数字的字符串，如111转为’111’，也可转换为指定进制的数字字符串

let num = 222
console.log(num.toString(2)); // 1010
console.log(num.toString(8)); // 12
console.log(num.toString(16)); // a

object调用toString()方法返回字符串

Symbol

符号，es6新增的数据类型。

主要用于确保对象属性的唯一性。

创建一个Symbol

let sym = Symbol()
console.log(typeof sym); // symbol
console.log(sym); // Symbol()

传入一个描述字符串，主要用于调试的时候用

let sym1 = Symbol('foo'),
   sym2 = Symbol('foo')
console.log(sym1 === sym2); // false

在全局注册表中查找key为foo的Symbol，如果有则返回，否则创建一个新的Symbol并返回

let sym1 = Symbol.for('foo'),
  sym2 = Symbol.for('foo')
console.log(sym1 === sym2); // true
console.log(Symbol.keyFor(sym1)); // foo

使用方式

Symbol主要用做对象的属性

其最主要的用途就是用来重新定义Symbol属性，详细用法请查看es6中的迭代器和生成器

let sym = Symbol.for('say')
let person = {
  name: '阿黄',
  [sym]: function () {
    console.log('hello，我是' + this.name) // hello，我是阿黄
  }
}
person[sym]()

Object

对象，属性和功能的集合，是一种高级数据类型

let person = {
  name: '阿黄',
  say: function () {
    console.log('hello')
  }
}

person.say() // hello
console.log(person.valueOf()); // { name: '阿黄', say: [Function: say] }
console.log(person.toString()); // [object Object]

码农公寓

js 数据类型

typeof操作符

Undefined

Null

Boolean

Number

字面量格式

NaN

其他数据类型转换为Number

Number()

parseInt()

parseFloat()

String

其他类型转为String

Symbol

创建一个Symbol

使用方式

Object

相关文章