JS数据类型

Posted 2020-11-21 sukiy

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了JS数据类型相关的知识，希望对你有一定的参考价值。

什么是数据类型？
数据类型有哪些？
如何查看数据类型？
undefined 和 null 的区别？
布尔类型

什么是数据类型？

计算机的本质是计算，计算的本质是对值进行操作，无论是参与计算的值，还是通过计算得到的值，在计算机中都统一称为数据。计算机的语言其实就是对各种数据进行处理，为了更好地处理数据，所以就把数据分门别类地归纳好，这个分类结果，叫数据类型。

数据类型有哪些？

JS 中一共有 5+1 种数据类型：数字、字符串、布尔、undefined、null、object。

前5种是基础数据类型，也叫简单数据类型或原始数据类型，而除了这5种数据类型，其他数据统一称为object（对象）。对象其实就是由不同属性组成的一个无顺序合集。例如，有一个对象 student，这个对象包含了 name, age, famous, boyfriend, hobbies 5个属性，这些属性对应的值的类型分别是字符串、数字、布尔值、undefined 和 object。其中 hobbies 是 student 对象的一个属性，而它本身也是一个对象，包含了三个数据类型为字符串的值。对象的属性值可以是任意一种数据类型，而且这些属性都是没有顺序的，可以任意调换它们的位置。

var student = {
    name: “suki”,
    age: 21,
    famous: false,
    boyfriend: undefined,
    hobbies: [“tennis”, “guitar”, “drawing”]
};

JS 非常灵活，在 JS 中，除了5种基础数据类型以外，其他所有东西都可以用对象来表示。

比如一支笔，它有长度、颜色、价格等属性，另外，笔还可以写字。“可以写字”这个属性是笔可以做的事情，在 JS 中，这种属性有一个特殊的名字，叫“方法”。本质上，只有对象拥有方法，其他基础数据类型是没有方法的。下面的例子说明了基础数据类型不能拥有属性。

var a = “abcd”;  // 声明一个变量a并赋值为”abcd”

a.len = 4;  // 为属于基础数据类型的a添加属性len

alert(a.len);  // undefined

当我们给基础数据a设置属性的时候，之所以没有报错，是因为 JS 解释器在这里把a转换成了对象，而在属性设置这一步结束之后，这个对象马上就被销毁了，所以在下一步我们尝试获取这个属性时失败了。同样的，基础数据类型也是没有方法的，即使我们在对 a 使用了toUpperCase 方法，但之后再去查看时，a 仍然是小写的”abcd”。

a.toUpperCase();

alert(a);  // abcd

当运行 a.toUpperCase() 时，JS 先把 a 转换成了对象，再去调用这个对象的方法，返回运行结果，但是这个结果是不会自动保存的，除非手动地把这个结果赋值给一个变量，例如 a = a.toUpperCase();（这里把方法调用的结果保存到变量 a 中，其实就相当于重新给 a 赋值了），之后这个对象就被销毁了。

这里引出了 JS 中另外一种数据分类方法。JS 中的数据还可以分为可变的和不可变的两种，在 JS 中，所有基础数据类型都是不可变的，只有对象是可以改变的。

var a = “abcd”;

a = “abcdef”;  // 并不是对“abcd”这个字符串进行了修改，而是把一个新的字符串“abcdef”重新赋值给 a

如果要对数据进行比较，基础数据类型比较的是两个“值”是否相等，而对象比较的是两个“引用”是否相等。在 JS 中任何两个独立的对象都是不相等的，即使它们的内容完全一样。

var a = 123;
var b = 123;

alert(a === b);  // true


var obj1 = {
    name: “suki”,
    age: 21
};

var obj2 = obj1;

alert(obj1 === obj2);  // true  obj1和obj2引用的是同一个对象


var obj1 = {
    name: “suki”,
    age: 21
};

var obj2 = {
    name: “suki”,
    age: 21
};

alert(obj1 === obj2);  // false  虽然obj1和obj2拥有完全相同的属性，但它们是两个独立的对象

如何查看数据类型？

ECMAScript 数据类型具有动态性，JS 定义一个变量仅仅是给它赋值了，并没有确定这个变量的数据类型，只有在参与计算的时候，JS 才会动态地去取对应的数据类型。在 JS 中我们可以使用typeof 去查看数据的类型。需要注意的是，typeof 的所有返回值都是字符串。

按理说，对应 JS 的6种数据类型，typeof 也应该有对应的6种返回值，事实上虽然 typeof 有6种返回值，但它们与 JS 的6种数据类型并非一一对应。typeof 的6种返回值分别是：

“undefined”, “boolean”, “string”, “number”, “object”, “function”。

没有”null”，却多了一个”function”。

如果使用 typeof 去查看 null 的值，会返回“object”，但这其实是个小错误，因为 JS 底层把二进制前三位为0的数据判断为 object，而 null 的二进制全部是0，所以被判断为 object，但其实它是一种基础数据类型，所以判断数据类型的时候使用 typeof 并非完全靠谱。

typeof 其实是一个操作符，虽然可以写成 typeof (123)这种格式，但是不要误以为它是一个函数。关于要不要加括号以及在哪里加：

var a = true;
var b = true;

alert(typeof a == b);  // 是 (typeof a) == b ? 还是 typeof (a == b) ?

// 运行时其实是这种情况
alert((typeof a) == b);  // “boolean” == true ? fals

这个结果可能会与预期有出入，建议使用 typeof 时可以加上括号，

// 不是建议像这样写成像函数的样子
alert(typeof （a == b));  // “boolean”

// 而是建议在整个表达式外面加一对括号
alert((typeof a == b));  // “boolean”

（如果是特别简单的可以不加括号，但如果是比较复杂的情况可以加上括号避免误解或出错）

undefined 和 null 的区别？

相同点：

1，这两种数据类型都只有一个值，undefined数据类型只有一个值就是undefined，null数据类型也只有一个值就是null;

2，两者参与判断都返回 false;

3，两者都没有方法;

不同点：

1，在 JS 中，null 是一个关键字，而 undefined 不是;

var null = 123;  // 报错
var undefined = 123;  // 不会报错

2，undefined 除了是一种数据类型，它还是 window 对象的一个属性，这个属性的值就是 undefined。如果使用 a === undefined 去判断一个 a 是不是 undefined，JS 首先会获取a，然后把它拿到 window 里面去，逐个与 window 的属性比较，直到比较到 undefined 为止。因为 window 里有很多属性，这种查找方法特别消耗性能，所以不建议使用这种方法;

3，undefined 代表的是未初始化，例如声明一个变量而不给它赋值，这个变量的默认值 undefined，虽然 undefined 的字面意思是“未定义”，但这个变量是已经定义了的，只是还没有初始化。但是 null 不一样，当你给一个变量赋值 null 的时候，这个变量已经经过初始化了，它的值就是空;

4，使用 typeof 查看数据类型的时候，null 会返回 “object”，undefined 会返回 “undefined”;

4， Number(undefined) 会返回 NaN，Number(null) 会返回0;

用法：

1，当你声明一个变量的时候，可以不给它赋值，但如果你必须给它赋值又不知道用什么值得时候，可以把 null 赋值给它;

2，当你一定要用全等（===）来检测某一个值是否存在的时候，使用 undefined;

3，当你要用全等（===）来检测一个值是否为空的时候，使用 null;

新手建议：

1，不要在给变量赋值的时候使用 undefined ;

2，判断某个值是否存在或者为空的时候，可以使用 a == null（但存在性能问题）;

3，如果明确知道需要判断某个值为undefined或者null时，使用全等，a === undefined 或 a === null;

布尔类型

可能会在一些代码中看到它的简写形式： bool;