前端进阶之路饥人谷技术博客

你真的了解JS的数据类型？

2018-11-03  本文已影响1人  xyyojl
JavaScript的数据类型.png

数值（number）：整数和小数（比如1和3.14）
字符串（string）：文本（比如Hello World）。
布尔值（boolean）：表示真伪的两个特殊值，即true（真）和false（假）
undefined：表示“未定义”或不存在，即由于目前没有定义，所以此处暂时没有任何值
null：表示空值，即此处的值为空。
Symbol：es6新增的类型的值
对象（object）：各种值组成的集合。狭义的对象（object）,数组（array）,函数（function）

object是复杂数据类型，是由简单的数据类型组成的，除object外均为基础数据类型/简单数据类型

typeof运算符

JavaScript有三种方法，可以确定一个值到底是什么类型。

typeof 123 //"number"
typeof "123" //"string"
typeof true //"boolean"
typeof undefined //"undefined"
typeof null //"object"
typeof function f(){} //"object"
typeof [] //"object"
typeof {} //"object"

从上面的例子的结果，你会发现为什么null的类型不是null，而是object等等的问题

JS的Bug小汇总

null的类型是object，这是由于历史原因造成的。1995年的 JavaScript 语言第一版，只设计了五种数据类型（对象、整数、浮点数、字符串和布尔值），没考虑null，只把它当作object的一种特殊值。后来null独立出来，作为一种单独的数据类型，为了兼容以前的代码，typeof null返回object就没法改变了

number

1.1 整数和浮点数

JavaScript 语言的底层根本没有整数，所有数字都是小数（64位浮点数）由于浮点数不是精确的值，所以涉及小数的比较和运算要特别小心
1.2 数值精度
根据国际标准 IEEE 754，JavaScript 浮点数的64个二进制位，从最左边开始，是这样组成的。

根据标准，64位浮点数的指数部分的长度是11个二进制位，意味着指数部分的最大值是2047（2的11次方减1）。也就是说，64位浮点数的指数部分的值最大为2047，分出一半表示负数，则 JavaScript 能够表示的数值范围为21024到2-1023（开区间），超出这个范围的数无法表示。
2.表示的方式
就是直接表示和科学计数法两种方式,特殊情况，JavaScript 会自动将数值转为科学计数法表示，其他情况都采用字面形式直接表示。

//小数点前的数字多于21位
1234567890123456789012
// 1.2345678901234568e+21

//小数点后的零多于5个，就自动转为科学计数法
0.0000003 // 3e-7

3.数值的进制
直接表示的时候也是可以输入十进制之外的进制数的，比如二进制、八进制、十六进制。

255 //255
0xff // 255
0377 // 255
0b11 // 3

4.特殊的值

Infinity的四则运算，符合无穷的数学计算规则。
0乘以Infinity，返回NaN；0除以Infinity，返回0；Infinity除以0，返回Infinity。
Infinity加上或乘以Infinity，返回的还是Infinity。
Infinity减去或除以Infinity，得到NaN。
Infinity与null计算时，null会转成0，等同于与0的计算。
Infinity与undefined计算，返回的都是NaN。

5.与数值相关的全局方法

parseInt方法还可以接受第二个参数（2到36之间），表示被解析的值的进制，返回该值对应的十进制数。默认情况下，parseInt的第二个参数为10，即默认是十进制转十进制。

parseInt('   81') // 81
parseInt('15px') // 15
parseInt('1000', 2) // 8
parseFloat('3.14more non-digit characters') // 3.14
isNaN('Hello') // true
isFinite(null) // true

string

字符串就是零个或多个排在一起的字符，放在单引号或双引号之中。
奇葩需求1：

'Did she say \'Hello\'?'
// "Did she say 'Hello'?"

"Did she say \"Hello\"?"
// "Did she say "Hello"?"

奇葩需求2：长字符串必须分成多行
解决方法：

//方法1（坑人语法），但是使用不小心会出bug，记得反斜杠的后面必须是换行符，而不能有其他字符（比如空格），否则会报错，不信，你可以试一下
var s1 = '12345\
67890'

//方法2（好读语法）
var s2 = '12345'+
'67890'

//方法3（ES6新出的），使用反引号（1左边的符号）
var s3 = `12345
67890`
s3.length //11,会包含回车

boolean

布尔值相当于是一个开关，布尔值代表“真”和“假”两个状态。“真”用关键字true表示，“假”用关键字false表示。布尔值只有这两个值。
例子：

var a = true;
if(a){
    console.log("条件为真");
}else{
    console.log("条件为假");
}

下列运算符会返回布尔值：

undefined & null

null与undefined都可以表示“没有”，含义非常相似。将一个变量赋值为undefined或null，老实说，语法效果几乎没区别。

object

对象就是一组“键值对”（key-value）的集合，是一种无序的复合数据集合。key代表键名，value代表键值

  1. key
    对象的所有键名都是字符串。如果键名是数值，会被自动转为字符串。如果键名不符合标识名的条件（比如第一个字符为数字，或者含有空格或运算符），且也不是数字，则必须加上引号，否则会报错。
    2.value
    value的值可以是任意的数据类型
    3.属性的读取
    读取对象的属性，有两种方法，一种是使用点运算符，还有一种是使用方括号运算符。
var obj = {
  123: 'hello world'
};

obj.123 // 报错
obj[123] // "hello world"

4.属性的赋值
点运算符和方括号运算符，不仅可以用来读取值，还可以用来赋值。
5.属性的查看
查看一个对象本身的所有属性，可以使用Object.keys方法。

var obj = {
  key1: 1,
  key2: 2
};

Object.keys(obj);
// ['key1', 'key2']

6.属性的删除：delete 命令
delete命令用于删除对象的属性（删除键名和键值），删除成功后返回true。
delete命令会返回false，那就是该属性存在，且不得删除。
7.属性是否存在：in 运算符
in运算符用于检查对象是否包含某个属性（注意，检查的是键名，不是键值），如果包含就返回true，否则返回false。它的左边是一个字符串，表示属性名，右边是一个对象。

var obj = { p: 1 };
'p' in obj // true
'toString' in obj // true

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

var obj = {a: 1, b: 2, c: 3};

for (var i in obj) {
  console.log('键名：', i);
  console.log('键值：', obj[i]);
}
上一篇下一篇

猜你喜欢

热点阅读