JS里的数据类型

发表于 | 分类于

数据类型

JS一共有7中数据类型，其中分为两类：基本类型 和 引用类型。

概述

  • 基本类型：
    number
    string
    boolean
    undefined
    null
    symbol

  • 引用类型：
    object (array和function都属于object类型)

typeof 运算符

typeof运算符可以返回一个值的数据类型，用来确定一个值到底是什么类型。。

1
2
3
4
5
6
7
typeof 123  // "number"
typeof '123'  // "string"
typeof false  // "boolean"

通过这个运算符可以发现两个bug
typeof null //object
typeof Function //function

number 数值

表示数字类型

  • 整数和小数：1 1.1 .1
  • 科学记数法：1.23e2

  • 二进制：
    var n = ob11 // 3

  • 八进制：
    var n = 011 // 9

  • 十六进制：
    var n = 0x11 // 17

string 字符串

表示字符串类型

1
var s = 'hello'

可以使用””表示空字符串

1
2
var s = ""
// ""

如何输入多行字符串

1
2
3
var s = '12345 \
67890'    
// "12345 67890" 含回车符号

也可以使用+来连接

1
2
3
var s = 'hello' + 
'world!'
// "helloworld!" 无回车符号

转义符： \

1
2
3
var s = '123\n456'  // \n换行
// 123
// 456

ES6语法：

1
2
3
var s = `12345
67890`   //length包含回车
s.length //11

boolean 布尔值

boolean只有两个值：true和false，通常用于条件判断

下列运算符会返回布尔值：
前置逻辑运算符： ! (Not)
相等运算符：===，!==，==，!=
比较运算符：>，>=，<，<=

逻辑判断
&&与||
&&表示逻辑与，例如 a && b表示a和b。常用来做逻辑判断

1
2
3
true && true  // true
true && false  // false
false && false  // false

||表示逻辑或，比例a || b表示a或b。

1
2
3
true || true  // true
true || false  // true
false || false  // false

null和undefined

null和undefined都表示空值，但是为什么在JS里会有两个表示空的值呢？
可以理解为这个JS之父设计的一个bug，具体差异如下：

  • 声明一个变量但没赋值，默认为undefined

    1
    2
    var a
    a // undefined

  • 声明一个对象但此时不想赋值，则赋值为null

    1
    2
    var a = null
    a // null

  • 声明一个变量但没想好给什么值，使用undefined

    1
    var a = undefined

后面两点算是惯例。

object 对象

object（对象），是一组key-value（键值对）的集合，也可看作是哈希表，是一种无序的复合数据集合。
在命名key时，如果不加引号，则需要遵守命名规则，加上引号可以随意命名。

1
2
3
4
5
6
7
8
var obj = {
  name: 'Allen',
  age: 23,
  gender: 'male',
}
obj.name  // 'Allen'
obj.age  // 20
obj.gender  // 'male'

读取对象中的属性有两种方式：

1
2
3
4
5
6
7
obj.name //'Allen'
obj['name'] //'Allen'
这两种方式是正确的，使用方括号运算符时参数必须是字符串，否则
obj[name] //undefined，这里的参数其实是变量name

var name = 'age'
obj[name]  // 23  所以在访问对象本身的属性时不要使用这种方式，容易造成混乱。

当key是数字时：

1
2
3
4
5
6
7
8
9
10
var obj = {
  1: 'Allen',
  2: 23,
  3: 'male'
}
此时再使用obj.1是无法访问到属性的值的
obj.1   // 报错
obj[1]   // 'Allen'
obj['1']   // 'Allen'
数字1会自动被转换为字符串'1'

对象当中还可以添加对象，key也可以是空字符串

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
var parent = {
  name: 'Chris',
  age: 35,
  gender: 'male',
  '': '我的key是空字符串',
  child: {
    name: 'Alice',
    age: '5',
    gender: 'female'
  }
}
parent.child.name   // 'Alice'
parent.child.age   // 5
parent.child.gender   // 'female'
parent['']  // '我的key是空字符串'

delete和in

delete命令用于删除对象的属性，删除成功后返回true。
in运算符用于检查对象是否包含某个属性，如果包含就返回true，否则返回false。

1
2
3
4
5
6
7
8
9
10
var obj = {
  name: 'Allen',
  age: 23,
  gender: 'male'
}
delete obj.name  // true
obj //{age: 23, gender: "male"}

'name' in obj  // false
'age' in obj  // true

但in运算符不能识别哪些属性是对象自身的，哪些是继承的。

1
2
3
4
var obj = {
  p: 1
}
'toString' in obj //true

上面代码中toString是继承而来而不是自身的。
这时，可以使用对象的hasOwnProperty方法判断一下，是否为对象自身的属性。

1
2
3
4
var obj = {};
if ('toString' in obj) {
  console.log(obj.hasOwnProperty('toString')) // false
}

for…in 循环

for…in循环用来遍历一个对象的全部属性。

1
2
3
4
5
6
7
8
9
10
var obj = {
  name: 'Allen',
  age: 23,
  gender: 'male'
}
for(var key in obj){
  console.log(key)   // name age gender
  console.log(obj[key])   // 'Allen' 23 'male'
}
打印出的值的排列顺序并不一定，因为对象本身是无序的复合数据集合。