前端基础 JavaScript数据类型相关知识

    本人大三最近开始准备明年春招 春招对于我们来说是非常重要的，如果有和本人一样大三学生一定要抓住这次机会，下面是我复习的JavaScript基础的知识

1.JavaScript数据类型

介绍js的基本数据类型

js一共有七种基本数据类型 分别是Undefined、Null、Boolean、Number、String  还有ES6中新增的Symbol 和 Es10中新增的BigInt类型,

Symbol 代表创建后独一无二且不可变的数据类型 它的出现我认为主要是解决可能出现的全局变量冲突的问题

BigInt是一种数字类型的数据 它可以表示任意精度格式的整数 使用BigInt可以安全的储存和操作最大整数 即使这个数已经超出了 Number 能够表示的安全整数范围。

堆栈池内存

• 栈：原始数据类型（Undefined、Null、Boolean、Number、String）

• 堆：引用数据类型（对象、数组和函数）

• 池:  存放常量

Stack 在内存中自动分配内存空间的；Heap在内存中动态分配内存空间的，不一定会自动释放。一般我们在项目中将对象类型手动置 为 null 原因，减少无用内存消耗。

面试官: JavaScript 有几种类型的值？他们的区别是什么?

答:js 可以分为两种类型的值，一种是基本数据类型，一种是复杂数据类型。

基本数据类型....（参考开头）

复杂数据类型指的是 Object 类型，所有其他的如 Array、Date 等数据类型都可以理解为 Object 类型的子类。

两种类型间的主要区别是它们的存储位置不同，基本数据类型的值直接保存在栈中，而复杂数据类型的值保存在堆中，通过使用在栈中
保存对应的指针来获取堆中的值。

面试官:null 和 undefined 的区别？

答：首先Undefined和null都是基本数据类型 这两个基本数据类型都是只有一个值就是undefined和null
undefined代表的含义是未定义 null代表的是空对象 一般变量声明了但还没有定义的时候会返回undefined null主要用于赋值给一些可能会返回对象的变量作为初始化

undefined 代表的含义是未定义，null 代表的含义是空对象。一般变量声明了但还没有定义的时候会返回 undefined，null
主要用于赋值给一些可能会返回对象的变量，作为初始化。用void 0 可以安全的获得undefined

当我们对两种类型使用 typeof 进行判断的时候，Null 类型化会返回 “object”，这是一个历史遗留的问题。当我们使用双等
号对两种类型的值进行比较时会返回 true，使用三个等号时会返回 false。

2.判断变量的数据类型

面试官：一共有几种数据类型检测？
 一共有四种数据类型检测
typeof 
instanceof 
constructor 
Object.prototype.toString.call()

typeof

typeof是一元运算符 同样返回一个字符串类型 一般用来判断一个变量是否为空或者是什么类型，除了null类型以及object类型不能准确判断外 其他数据类型都可能返回正确的类型

面试官：为什么 typeof null 等于 Object?
不同的对象在底层原理的存储是用二进制表示的，在 javaScript 中，如果二进制的前三位都为 0 的
话，系统会判定为是 Object 类型。 null 的存储二进制是 000 ，也是前三位，所以系统判定 null 为 Object 类型。

000 ：对象类型。
1 ：整型，数据是31位带符号整数。
010 ：双精度类型，数据是双精度数字。
100 ：字符串，数据是字符串。
110 ：布尔类型，数据是布尔值。

instanceof

instanceof 运算符用来测试一个对象在其原型链（又是一个很重要的知识点 大家要多看多理解）中是否存在一个构造函数的 prototype 属性。我们可以使用 instanceof 来进行判断某个对象是不是另一个对象的实例。

instanceof 的原理是通过判断该对象的原型链中是否可以找到该构造类型的 prototype 类型。例如:

function Test(){} 

var test = new Test(); 

console.log(test instanceof Test); // true

constructor

对于引用类型，除此之外，还可以使用 xx.constructor.name 构造函数来判断 例如:

// constructor 构造来判断 

console.log(fn.constructor.name) // Function 

console.log(date.constructor.name)// Date 

console.log(arr.constructor.name) // Array 

console.log(reg.constructor.name) // RegExp

Object.prototype.toString.call()

一种最好的基本类型检测方式 Object.prototype.toString.call() ;它可以区分 null 、 string 、 boolean 、 number 、 undefined 、 array 、 function 、 object 、 date 、 math 数据类型。

// 判断基本类型 
Object.prototype.toString.call(null); // "[object Null]" 

Object.prototype.toString.call(undefined); // "[object Undefined]" 

Object.prototype.toString.call(“abc”);// "[object String]" 

Object.prototype.toString.call(123);// "[object Number]" 

Object.prototype.toString.call(true);// "[object Boolean]" 

// 判断引用类型 
function fn(){ 
    console.log(“yyf”); 
}
var date = new Date(); 

var arr = [1,2,3]; 

var reg = /[jyx]at/gi; 

Object.prototype.toString.call(fn); // "[object Function]" 
Object.prototype.toString.call(date); // "[object Date]" 
Object.prototype.toString.call(arr); // "[object Array]"
Object.prototype.toString.call(reg); // "[object RegExp]"

说到Object.prototype.toString.call() 就不得不说一说内部属性[[class]] 例如

// 我们自己创建的类就不会有这份特殊待遇，因为 toString() 找不到 toStringTag 属性时只好返回默认的 Object 标签
// 默认情况类的[[Class]]返回[object Object]
class Class1 {}
Object.prototype.toString.call(new Class1()); // "[object Object]"
// 需要定制[[Class]]
class Class2 {
  get [Symbol.toStringTag]() {
    return "Class2";
  }
}
Object.prototype.toString.call(new Class2()); // "[object Class2]"

比较常考的题:

判断空对象的方法

1.最常见的思路，for...in... 遍历属性，为真则为“非空数组”；否则为“空数组”
for (var i in obj) { // 如果不为空，则会执行到这一步，返回true
    return true
}
return false // 如果为空,返回false

2.通过 JSON 自带的 stringify() 方法来判断:JSON.stringify() 方法用于将 JavaScript 值转换为 JSON 字符串。
if (JSON.stringify(data) === '{}') {
    return false // 如果为空,返回false
}
return true // 如果不为空，则会执行到这一步，返回true

3.ES6 新增的方法 Object.keys()  Object.keys() 方法会返回一个由一个给定对象的自身可枚举属性组成的数组。
function checkNullObj (obj) {
    return Object.keys(obj).length === 0
}

判断数组的方法

1.instanceof 操作符判断 instanceof 主要是用来判断某个实例是否属于某个对象
let arr = [];
console.log(arr instanceof Array); // true

2.对象构造函数的 constructor判断 用法:arr.constructor === Array
let arr = [];
console.log(arr.constructor === Array); // true

3.Array原型链上的 isPrototypeOf 用法:Array.prototype.isPrototypeOf(arr)
let arr= [];
console.log(Array.prototype.isPrototypeOf(arr));//true;

4.Object.getPrototypeOf   用法：Object.getPrototypeOf(arr) === Array.prototype  Object.getPrototypeOf() 方法返回指定对象的原型
let arr = [];
console.log(Object.getPrototypeOf(arr) === Array.prototype); // true

5.Object.prototype.toString.call(arr) === "[object Array]";
let arr = [];
console.log(Object.prototype.toString.call(arr) === "[object Array]"); // true

6.ES5新增的方法Array.isArray(arg) [[Class]] 内部属性值是 "Array", 则返回 true。
let arr = [];
console.log(Array.isArray(arr)); // true

   数据类型的基础知识我总结就这么多了 大家要差缺补漏 复习的时候不能光看 最好自己要敲一下验证一下 加深自己的印象 才能让自己的复习效率提高 大家都加油