前端面试梳理(一)：基础知识点
原始类型
涉及面试题：基础数据类型有哪些？null是对象？
基础数据类型有哪些？
在js中基础数据类型：
- String
- Number
- Boolean
- undefined
- null
- Symbol
原始数据存储的都是值，是没有方法的，比如undefined.toString().
那为什么会存在“123”.toString呢？
原因：当你对基础数值调用方法的时候，发生了隐式转化,已经被转化成了Number对象了。“123”.toString() == Number("123").toString()
null是对象？
答案：不是。
也许你会反驳到 typeof null 会输出‘Object’。但是这是js设计之初就存在的bug，因为typeof 判断对象的方式是直接变量判断内存的是否是以000开头的，而null在内存中的地址是全为0，所有才会出现这样的问题。
number也是问题大户
0.1+0.2 ！= 0.3 // true
1111111111111111 == 11111111111111112 // true
什么呢？
先说原因，因为 JS 采用 IEEE 754 双精度版本（64位），并且只要采用 IEEE 754 的语言都有该问题。
IEEE754是怎么表示的：
s eeeeeeeeeee fff...ffff
|-1-|- 11 -|- 52 -|
意义
- 1位用来表示符号位
- 11位用来表示指数
- 52位表示尾数
那么0.1在二进制是怎么表示？
// (0011) 表示循环
0.1 >> 0.0001 1001 1001 1001…（1001无限循环）
0.2 >> 0.0011 0011 0011 0011…（0011无限循环）
其实不仅仅0.1,还有0.2，111111111111111111等等很多数字都是以循环体存在的。这本来是没什么问题的，但是js采用的IEEE754双精度浮点（64）标准，输出十进制进行四舍五入了，但是二进制只有 0 和 1 两个，于是变为 0 舍 1 入。这即是计算机中部分浮点数运算时出现误差。
0.100000000000000002 === 0.1 // true
0.200000000000000002 === 0.2 // true
0.1 + 0.2 === 0.30000000000000004 // true
但是你可能又会问：console.log("0.1") 为什么不会输出 “0.100000000000000002”?
因为在输入内容的时候，二进制被转换为了十进制，十进制又被转换为了字符串，在这个转换的过程中发生了取近似值的过程.
// 所以输出 0.1
console.log(0.100000000000000002) // 0.1
那么如何处理这个问题呢？
// 小数用toFixed
parseFloat((0.1 + 0.2).toFixed(10)) === 0.3 // true
// 大整数用BigInt
BigInt("11111111111111111") + 0n // 11111111111111111n
对象类型
涉及面试题：对象类型和基础类型的不同？函数参数是对象会发生什么问题？
对象类型和基础类型的区别
-
内存的分配不同
- 基本数据类型存储在栈中。
- 复杂数据类型存储在堆中，栈中存储的变量，是指向堆中的引用地址。
-
访问机制不同
- 基本数据类型是按值访问
- 复杂数据类型按引用访问，JS不允许直接访问保存在堆内存中的对象，在访问一个对象时，首先得到的是这个对象在栈内存中的地址，然后再按照这个地址去获得这个对象中的值。
-
复制变量时不同(a=b)
- 基本数据类型：a=b;是将b中保存的原始值的副本赋值给新变量a，a和b完全独立，互不影响
- 复杂数据类型：a=b;将b保存的对象内存的引用地址赋值给了新变量a;a和b指向了同一个堆内存地址，其中一个值发生了改变，另一个也会改变。
下面的输出结果：
var a = {n: 1};
var b = a;
a.x = a = {n: 2};
a.x // 输出？
b.x // 输出
答案： a.x // --> undefined b.x // --> {n: 2}
- 1、优先级。.的优先级高于=，所以先执行a.x，堆内存中的{n: 1}就会变成{n: 1, x: undefined}，改变之后相应的b.x也变化了，因为指向的是同一个对象。
- 2、赋值操作是从右到左，所以先执行a = {n: 2}，a的引用就被改变了，然后这个返回值又赋值给了a.x，需要注意的是这时候a.x是第一步中的{n: 1, x: undefined}那个对象，其实就是b.x，相当于b.x = {n: 2}
typeof vs instanceof
涉及面试题：typeof 是否能正确判断类型？instanceof 能正确判断对象的原理是什么？
- typeof 对于基础类型来说，除了 null 都可以显示正确的类型
typeof 1 // 'number'
typeof '1' // 'string'
typeof undefined // 'undefined'
typeof true // 'boolean'
typeof Symbol() // 'symbol'
typeOf对于对象类型就无法起到作用了：
typeof {} // object
typeof [] // object
typeof String // function
- instanceof 可以正确的判断对象的类型，因为内部机制是通过判断对象的原型链中是不是能找到类型的 prototype
function myInstanceof(left, right) {
let prototype = right.prototype
left = left.__proto__
while (true) {
if (left === null || left === undefined)
return false
if (prototype === left)
return true
left = left.__proto__
}
}
原理：
- 首先获取类型的原型
- 然后获得对象的隐式原型
- 然后一直循环判断对象的隐式原型是否等于类型的原型，直到对象隐式原型为 null，因为原型链最终为 null
那么如何靠谱的区分对象呢？
Object.prototype.toString.call([]) // "[object Array]"
Object.prototype.toString.call({}) //"[object Object]"
Object.prototype.toString.call(/\./) // "[object RegExp]"
类型转换
涉及面试题：该知识点常在笔试题
常见的隐式转化有三种：
- 转化为String
- 转化为Number
- 装化为Boolean
转Boolean：
undefined，null，“”，0，+0，-0，NaN转化为发垃圾，其余都是true
对象转原始类型
- 1.对象在转换类型的时候，会调用内置的 [[ToPrimitive]] 函数，对于该函数来说，算法逻辑一般来说如下：
- 2.是否为原始类型了，如果是就无需转化，如果不是就往下
- 3.调用valueOf()，如果转换为基础类型，就返回转换的值，如果不是就往下
- 4.调用 x.toString()，如果转换为基础类型，就返回转换的值，如果不是就往下
- 5.如果都没有返回原始类型，就会报错
当然你也可以重写 Symbol.toPrimitive ，该方法在转原始类型时调用优先级最高。
let a = {
valueOf() {
return 0
},
toString() {
return '1'
},
[Symbol.toPrimitive]() {
return 2
}
}
1 + a // => 3
常见面试题：
a==1 && a==2 && a==3 ?
// 1.利用隐式类型转换
const a = {
[Symbol.toPrimitive]: (() => {
let i =1;
return () => i++;
})()
}
const a = {
i: 1,
valueOf: () => {
return a.i++;
}
}
// 2.利用数据劫持(Proxy/Object.defineProperty)
let i = 1;
let a = new Proxy({}, {
i:1,
get: function () {
return () => this++
}
})
// 使用数组， 数组的同toString默认调用的join
let a = [1,2,3]
a.join = a.shift
四则运算符转化
- 运算中其中一方为字符串，那么就会把另一方也转换为字符串
- 如果一方不是字符串或者数字，那么会将它转换为数字或者字符串
- ```js
1 + '1' // '11'
true + true // 2
4 + [1,2,3] // "41,2,3"
```
-
面试题：'a' + + 'b' // 输出什么
因为 + 'b' 等于 NaN，所以结果为 "aNaN"，你可能也会在一些代码中看到过 + '1' 的形式来快速获取 number 类型。
或者转化为 “a” + （+“b”）
"a" + + "1" => "a1"
那么对于除了加法的运算符来说,只要其中以一方为数字，那么另一方也会被转化成数字。
4 * '3' // 12
4 * [] // 0
4 * [1, 2] // NaN
比较运算符
- 如果是对象，就通过 toPrimitive 转换对象
- 如果是字符串，就通过 unicode 字符索引来比较
let a = {
valueOf() {
return 0
},
toString() {
return '1'
}
}
a > -1 // true'
