米哈游web前端面试题Js/Vue/浏览器原理等_米哈游前端面试题

岗位职责：

1、负责游戏社区产品的前端开发;
2、负责游戏运营类中台系统的前端开发;
3、负责游戏各类网页活动的前端开发;

面试环节（视频面试-腾讯会议）：

一、首先是做自我介绍，主要是描述一下你的工作经历以及工作中所扮演的角色和所担任的职责，所运用到的技术。只要沉着冷静描述清楚一般问题不大，但是必须如实描述，大厂面试通过后还会做一些第三方背调，那时候出问题大家都会很尴尬。

二、开始技术面试（第一轮20分钟不到）

1、什么是事件委托

答：核心：事件冒泡，父节点来统筹响应子节点的事件，为dom树最高层添加事件即可理解成事件委托。优点：节省内存开销，提高性能，可以从性能优化角度来概述，缺点：应当根据实际情况来使用，容易造成事件误判。

2、说一下this关键字

答：1、在函数体中，非显式或隐式地调用函数时，在严格模式下，函数内的this会被绑定到 undefined 上，在非严格模式下则会绑定到全局对象 window/global 上
       2、一般使用 new 方法调用构造函数时，构造函数内的 this 会绑定到实例对象上
       3、一般通过 call/apply/bind 方法显式调用函数时，函数体内的 this 会被绑定到 call/apply/bind 方法指定参数的对象上
       4、一般通过执行上下文对象调用函数时，this会指向最后调用它的对象
       5、在箭头函数中，this的指向是由外层（函数或全局）作用域决定的

3、浏览器的存储方式有哪些

答：cookie、local storage、session storage、web sql、indexedDB

4、session，在浏览器崩溃后，点击“恢复”按钮是否还会存在

答：存在于浏览器上的唯一标识符JSESSIONID（sessionid）消失了，但是服务器中存放的sessionid并没有立马销毁。

5、cookie的存储大小，这个存储大小限制，是作用于每条cookie还是整个域名

答：根据不同浏览器有所不同大约每条4kb，数量限制也是根据不同的浏览器来决定的

6、说一下http only

答：http-only的设置主要是用来防御xss攻击，即跨站点脚本攻击，js无法读取和修改http-only中的cookie，从而保护用户cookie信息免遭攻击者窃取

7、页面是如何渲染的

1. 处理HTML标记并构建DOM树
2. 处理CSS标记并构建CSSOM树
3. 将DOM和CSSOM合并成一个渲染树
4. 根据渲染树来布局，以计算每个节点的几何信息
5. 将各个节点绘制到屏幕上

8、路由的几种模式，携带参数的方式

答：hash、history、abstract，携带参数方式：1、利用“router-link”路由导航来传递；2、调用“$router.push”实现路由传参数值；3、通过路由属性中的name匹配路由，再根据params传递参数值；4、通过query来传递参数值。

9、浏览器是如何加载资源来呈现页面的

答：浏览器通过Loader形成两条资源加载路径：主资源加载路径和派生资源加载路径，后对数据进行解码、解析、排版、绘制等操作

10、cookie是怎么创建的

答：1.在servlet程序里面创建一个cookie对象，注意是键值对形式，键和值都是字符串。
       2.将cookie添加到浏览器

11、双向绑定的实现原理

答：老生常谈的问题了，注意不要和v-model混淆就好，这里不再多作赘述。

参考文献：Vue中双向绑定的实现原理_ムラサキ的博客-CSDN博客_双向绑定的实现原理

12、在路由之间进行页面切换，这时候页面是如何进行渲染的

答：需要注意是否使用keep-alive，进行组件缓存。

1.无论如何肯定访问的都是 index.html
2.main.js作为项目的入口 把 App.vue 的虚拟dom渲染到了index.html的真实dom上了
3.在App.vue里面的会渲染当前访问的路由所对应的组件

ps：不一定是标准答案哦～很显然这个岗位对http和浏览器原理和安全的考察比较多，因为主要是游戏活动页面的岗位。