记一次前端面试经历

近日去某独角兽公司面试了一波，本以为凭借几年的丰富项目积累能顺风顺水的，结果被面试官‘教育’了一番，着实惭愧。

被连续几个前端知识点问道懵逼，回来后好好补习了一番。以下是对面试问题的思考：

1.let，const定义的变量可以不赋值吗，指向哪里？

答：let 可以不赋值，const不能不赋值 会报 Missing initializer in const declaration 缺少初始化。let不存在变量提升，必须声明后才能使用。const定义常规变量，并不是变量的值不得改动，而是变量指向的那个内存地址所保存的数据不得改动。const定义的对象或数组，变量指向的内存地址，保存的只是一个指向实际数据的指针，const只能保证这个指针是固定的（即总是指向另一个固定的地址），至于它指向的数据结构是不是可变的，就完全不能控制了。

2.png8 和 png24 的图有什么区别？

答：PNG文件格式分为PNG-24和PNG-8，其最大的区别是PNG-24是用24位来保存一个像素值，是真彩色，而PNG-8是用8位索引值来在调色盘中索引一个颜色，因为一个索引值的最大上限为2的8次方既128，故调色盘中颜色数最多为128种，所以该文件格式又被叫做PNG-8128仿色。我当时只答出了精度不同，png24的大小更大，面试官追加了一句 大多少？有什么规律吗？回来后我实际测试了下，同一张图片png24的大小是434.5KB，png8的图片大小是124KB，接近4倍的大小差距。

3.实现一个简单的双向数据绑定，实现调用函数时，返回2.
我知道是运用Object.defineProperty来进行监听，但是细节方面还是遗忘了。

var a = {}
Object.defineProperty(a, 'name', {
set: function(newValue){
console.log(`newValue == ${newValue}`)
},
get: function(){
return 2
}
})
console.log(a.name)


4.http协议与https相关的问题，有什么区别。

5.跨域cors原理（其实就是个白名单）

6.cookie中存储过大会有影响吗？cookie和localstorage的区别?

cookie是塞在请求头里面的，拿php语言来说，当请求一个页面的时候，cookie会通过http协议传到服务端，这也是通过$_COOKIE就能获取到远程客户端中的cookie的原理。所以Cookie太大后，整个HTTP头也会被撑大。

区别：cookie数据始终在同源的http请求中携带（即使不需要），即cookie在浏览器和服务器间来回传递。而sessionStorage和localStorage不会自动把数据发给服务器，仅在本地保存。cookie数据还有路径（path）的概念，可以限制cookie只属于某个路径下。存储大小限制也不同，cookie数据不能超过4k，同时因为每次http请求都会携带cookie，所以cookie只适合保存很小的数据，如会话标识。sessionStorage和localStorage 虽然也有存储大小的限制，但比cookie大得多，可以达到5M或更大。数据有效期不同，sessionStorage：仅在当前浏览器窗口关闭前有效，自然也就不可能持久保持；localStorage：始终有效，窗口或浏览器关闭也一直保存，因此用作持久数据；cookie只在设置的cookie过期时间之前一直有效，即使窗口或浏览器关闭。作用域不同，sessionStorage不在不同的浏览器窗口中共享，即使是同一个页面；localStorage 在所有同源窗口中都是共享的；cookie也是在所有同源窗口中都是共享的。Web Storage 支持事件通知机制，可以将数据更新的通知发送给监听者。Web Storage 的 api 接口使用更方便。

这两年一直在做业务，什么需求来了照做就行，很少去研究它的具体原理。对方技术面试官跟我讲要深入，不然在5 7年后如果没有自己的技术壁垒，是没法跟工作2 3年的小年轻比的。惭愧，以后要多关注原理方面的东西。