动画:《大前端吊打面试官系列》 之原生 JavaScript 精华篇

更新日志
文中所有修改或补充内容,会在日志中实时更新 。
接上篇文章《大前端吊打面试官系列》之备战面试篇,【传送门~】
本系列仓库 [传送门~] 目录闭包原型和原型链继承垃圾回收机制深拷贝和浅拷贝异步编程数据类型
面试官:说说中的基本类型有哪些?以及各个数据类型是如何存储的?
的数据类型包括原始类型和引用类型(对象类型) 。
原始类型包括以下 6 个:
引用类型统称为类型,如果细分的话,分为以下 5 个:
1、数据类型的存储形式
栈(Stack)和堆(Heap),是两种基本的数据结构 。Stack 在内存中自动分配内存空间的;Heap 在内存中动态分配内存空间的,不一定会自动释放 。一般我们在项目中将对象类型手动置为 null 原因,减少无用内存消耗 。

动画:《大前端吊打面试官系列》 之原生 JavaScript 精华篇

文章插图
原始类型是按值形式存放在栈中的数据段,内存空间可以自由分配,同时可以按值直接访问 。
var a = 10;var b = a;b = 30;console.log(a); // 10值console.log(b); // 30值
过程图示:
动画:《大前端吊打面试官系列》 之原生 JavaScript 精华篇

文章插图
引用类型是存放在堆内存中,每个对象在堆内存中有一个引用地址,就像是每个房间都有一个房间号一样 。引用类型在栈中保存的就是这个对象在堆内存的引用地址,我们所说的“房间号” 。通过“房间号”可以快速查找到保存在堆内存的对象 。
var obj1 = new Object();var obj2 = obj1;obj2.name = "小鹿";console.log(obj1.name); // 小鹿
过程图示:
动画:《大前端吊打面试官系列》 之原生 JavaScript 精华篇

文章插图
2、Null
面试官:为什么null 等于 ?
不同的对象在底层原理的存储是用二进制表示的,在 中,如果二进制的前三位都为 0 的话,系统会判定为是 类型 。null的存储二进制是 000,也是前三位,所以系统判定 null为 类型 。
扩展:
这个 bug 个第一版的 留下来的 。俺也进行扩展一下其他的几个类型标志位:
3、数据类型的判断
面试官: 与有什么区别?
是一元运算符,同样返回一个字符串类型 。一般用来判断一个变量是否为空或者是什么类型 。
除了 null 类型以及类型不能准确判断外,其他数据类型都可能返回正确的类型 。
typeof undefined // 'undefined'typeof '10'// 'String'typeof 10// 'Number'typeof false// 'Boolean'typeof Symbol()// 'Symbol'typeof Function// ‘function'typeof null// ‘Object’typeof []// 'Object'typeof {}// 'Object'
既然对对象类型都返回类型情况的局限性,我们可以使用来进行判断某个对象是不是另一个对象的实例 。返回值的是一个布尔类型 。
var a = [];console.log(a instanceof Array) // true
运算符用来测试一个对象在其原型链中是否存在一个构造函数的属性,如果对原型链不怎能了解,后边俺会具体的写到,这里大体记一下就 OK 。
我们再测一下 ES6 中的 class 语法糖是什么类型 。
class A{}console.log(A instanceof Function) // true
注意:原型链中的 随时可以被改动的,改变后的值可能不存在于 的原型链上,返回的值可能就返回 false 。
4、类型转换
类型转换通常在面试笔试中出现的比较多,对于类型转换的一些细节应聘者也是很容易忽略的,所以俺整理的尽量系统一些 。是一种弱类型语言,变量不受类型限制,所以在特定情况下我们需要对类型进行转换 。