javascript数据类型(一)

153 阅读5分钟

javascript数据类型(一)

hello大家好,我是角落,这阵子终于结束了期末考试放假了,可以继续愉快地读书啦!今天我们看的是js的数据类型。由于基础不是很牢固,所以想认真看一遍书并用文章记录下自己的思考。本系列文章是我看红宝书之后上网查找资料并结合自己的思考写的,难免会有错漏,欢迎大家指正、给出建议和讨论。

js是一门动态语言,它在创建变量时只是简单的赋值,并没有确定值的类型,只有在值参与运算时才会动态地去获取它的数据类型。

不考虑ES6新增的Symbol数据类型,javascript共有5+1种数据类型,包括5种简单数据类型和1种复杂数据类型

简单数据类型又叫原始数据类型,包括以下5个数据类型:

  1. Number
  2. String
  3. Boolean
  4. null
  5. undefined

复杂数据类型只有一个:Object

那么,简单数据类型和复杂数据类型有什么区别呢?

1、简单数据类型和原始数据类型的区别

  1. 默认情况下,简单数据类型的值是不可变的,而复杂数据类型的值是可变的。

简单数据类型是不可变的,例如:

var a = 'abcd'
a.name = 'haha'
console.log(a); // 输出结果为'abcd',a没有被修改
console.log(a.name);  // undefined

复杂类型是可变的,例如我们可以修改对象的属性,增加删除属性方法等。

  1. 两者作为变量时存储的方式不同。

简单数据类型存储在内存栈中,例如有以下几个简单数据类型的变量

var name = 'William'
var age = 23
var c = true

它们在内存中的栈区按如下方式存储,存储的是变量的标识符和它们的值

image-20220115110538165

复杂数据类型或者说对象同时保存在栈内存和堆内存中,在栈内存中存放的是变量的标识符和对象的的引用,或者说是它在堆内存中的地址。假设有以下几个对象

var apple = {color:'red'}
var banana = {color: 'yellow'}
var watermalon = {color: 'red'}

它们的存储情况如下图所示

image-20220115112623928
  1. 两者在比较时有所不同。

简单数据类型是值的比较,复杂数据类型是引用的比较。

例如:

var a = '{}'
var b = '{}'
console.log(a == b) //结果为true

而复杂数据类型是引用的比较

var obj1 = {}
var obj2 = {}
console.log(obj1 == obj2) //结果输出false,虽然这两个对象长得一样,但是比较时是比较它们在栈中保存的堆内存的地址,地址不同,自然输出false

2、typeof操作符

typeof是js中一个用于确定数据类型的操作符,它所有的返回值都是字符串。它返回的值有以下7个:

  1. 'number'
  2. 'string'
  3. 'boolean'
  4. 'undefined'
  5. 'object'
  6. 'function'
  7. 'symbol'

前面说过js有5+1种数据类型(除了Symbol外),而这里的数据类型少了null,这是因为null本质其实是一个空对象指针,属于 object类型,即

console.log( (typeof null) );	//'object'

可以注意到这里我在typeof外面加了括号,这是为了避免有些情况下的优先级问题,增加代码可读性,例如

var a = true
var b = true
console.log( typeof a == b )

上面输出结果是什么呢,答案是 false,因为先计算的是typeof a结果是 'boolean' ,然后 'boolean' == b结果自然为 false。所以我们在使用typeof操作符时最好加上括号 console.log( (typeof a) == b )

3、Boolean

js中的布尔类型只有两个,一个是true,一个是false。需要注意js是区分大小写的,因此像True和False并不是布尔值。

首先要记住的是,在js中,所有的数据类型都可以转换为布尔值,将其他数据类型转换为布尔值最简单的两种方式如下:

  1. 使用js内置方法Boolean()
  2. 使用双感叹号

例如

var str = 'abc'
console.log(Boolean(str))	//true
console.log(!!str)	//true

在js中只有6个数据会被转换成false,它们分别是:

  1. 数字0、-0、NAN
  2. 空字符串
  3. 布尔值false
  4. undefined
  5. null

4、 null和undefined的异同

异:

nullundefined
是否为关键字不是
本质空对象指针window对象的一个属性
作为变量是否已初始化已初始化未初始化
typeof操作符返回值'object''undefined'
转为数字类型后的值0NaN

由于undefined不是一个关键字,因此我们可以定义一个名为undefined的变量且不会报错

var undefined = 1 //不报错
var null = 1 //报错 Uncaught SyntaxError: Unexpected token 'null'

undefined是window对象的一个属性,其属性值也为undefined。当拿一个值与undefined去比较时,js解释器会到window对象众多的属性中去找undefined这个属性,因此会存在一定的性能开销。

同:

null和undefined
该类型有几个值都只有一个值
参与判断时的返回值false
有没有方法都没有方法

那么,由null和undefined的异同点我们可以得到它们的常见用法:

  1. 定义一个变量但不确定它的值时可以初始化为null , 避免为一个变量赋值undefined
  2. 用全等检测值是否存在用null
  3. 用全等检测值是否为空用undefined
  4. 一般情况下,判断后台返回的数据可以用 null==