[JavaScript知识库]【前端学习 - JS （2）】

?数据类型的分类：

1-1 基本类型：

• string（字符串）--原始类型
• boolean（布尔值）--原始类型
• number（数字）--原始类型
• symbol（符号）--原始类型
• null（空值）
• undefined（未定义）
• BigInt（BigInt数据类型的目的是比Number数据类型支持的范围更大的整数值，精度在(2^53-1)范围内，BigInt(10) 值为：10n） ES2020新出的

其中 Symbol 和 BigInt 是ES6 中新增的数据类型：

• Symbol 代表创建后独一无二且不可变的数据类型，它主要是为了解决可能出现的全局变量冲突的问题。
• BigInt 是一种数字类型的数据，它可以表示任意精度格式的整数，使用 BigInt 可以安全地存储和操作大整数，即使这个数已经超出了 Number 能够表示的安全整数范围。

注意:NaN不是数据类型

typeof NaN === 'number' //true
NaN==NaN  //false

1-2 对象类型(引用类型)，有以下3种：

A.内置对象/原生对象

String、Number、Boolean、Array、Date、RegExp、Math、 Error、 Object、Function、 Global

B.宿主对象

• （1）BOM对象： Window、Navigator、Screen、History、Location
• （2）DOM对象：Document、Body、Button、Canvas等

C.自定义对象--(指由用户创建的对象，兼容性问题需要由编写者注意)

创建自定义对象几种方式：

(1)对象直接量:

var obj1 = {}；
var obj2 = {x:0，y:0}；
var obj3 = {name：‘Mary’，age：18}

（2）工厂模式--用函数来封装以特定接口创建对象的细节：

function createPerson(name,age,job){
    var o = new Object();
    o.name = name;
    o.age = age;
    o.job = job;
    return o;
}
var person1 = createPerson('zhang',30,'java');

（3）构造函数模式：

function Person(name,age,job){
    this.name= name;
    this.age = age;
    this.job = job;
}
var person1 = new Person('zhang',30,'java');

（4）原型模式：

function Person(){}
Person.prototype.name = 'zhang';
Person.prototype.age = '22';
Person.prototype.job = 'html5';
var person1 = new Person();

1-3 数据类型的判断：

1-3-1: typeof

一般通过 typeof 操作符来判断一个值属于哪种基本类型。

缺点：无法分辨对象类型

typeof 'seymoe'    // 'string'
typeof true        // 'boolean'
typeof 10          // 'number'
typeof Symbol()    // 'symbol'
typeof null        // 'object' 无法判定是否为 null
typeof undefined   // 'undefined'
typeof {}           // 'object'
typeof []           // 'object'
typeof(() => {})    // 'function'

为什么typeof null为object:

js 在底层存储变量的时候，会在变量的机器码的低位1-3位存储其类型信息

• 000：对象
• 010：浮点数
• 100：字符串
• 110: 布尔值
• 1：整数

但是, 对于 undefined 和 null 来说，这两个值的信息存储是有点特殊的。

• null：所有机器码均为0
• undefined：用 ?2^30 整数来表示

所以，typeof 在判断 null 的时候就出现问题了，由于null 的所有机器码均为0，因此直接被当做了对象来看待。

1-3-2：instanceof

判断对象类型：测试构造函数的 prototype 是否出现在被检测对象的原型链上。

缺点：无法判断一个值到底属于数组还是普通对象

[] instanceof Array            // true
({}) instanceof Object         // true
(()=>{}) instanceof Function   // true
let arr = []
let obj = {}
arr instanceof Array    // true
arr instanceof Object   // true
obj instanceof Object   // true

在这个例子中，arr 数组相当于 new Array() 出的一个实例，
所以 arr.__proto__ === Array.prototype，
又因为 Array 属于 Object 子类型，
即 Array.prototype.__proto__ === Object.prototype，
所以 Object 构造函数在 arr 的原型链上

判断不了原始类型

console.log(true instanceof Boolean);// false
console.log(undefined instanceof Object); // false
console.log(arr instanceof Array);  // true
console.log(null instanceof Object); // false
console.log({} instanceof Object); // true
console.log(function(){} instanceof Function);// true

1-3-3: Object.prototype.toString.call()

全能型，几乎都能判断

Object.prototype.toString.call({})// '[object Object]'
Object.prototype.toString.call([])// '[object Array]'
Object.prototype.toString.call(() => {})// '[object Function]'
Object.prototype.toString.call('abc')// '[object String]'

传入原始类型却能够判定出结果是因为对值进行了包装。

「那么，什么是包装对象：」

所谓“包装对象”，指的是与数值、字符串、布尔值分别相对应的Number、String、Boolean三个原生对象。这三个原生对象可以把原始类型的值变成（包装成）对象。