面试题目记录
2020.02.27
公司 滴滴
1 vue slot渲染在父组件还是子组件:
普通插槽和作用域插槽的实现，它们有一个很大的差别是数据作用域，普通插槽是在父组件编译和渲染阶段生成 vnodes，所以数据的作用域是父组件实例，子组件渲染的时候直接拿到这些渲染好的 vnodes。而对于作用域插槽，父组件在编译和渲染阶段并不会直接生成 vnodes，而是在父节点 vnode 的 data 中保留一个 scopedSlots 对象，存储着不同名称的插槽以及它们对应的渲染函数，只有在编译和渲染子组件阶段才会执行这个渲染函数生成 vnodes，由于是在子组件环境执行的，所以对应的数据作用域是子组件实例。
简单地说，两种插槽的目的都是让子组件 slot 占位符生成的内容由父组件来决定，但数据的作用域会根据它们 vnodes 渲染时机不同而不同
2 webpack多文件输出怎么配置？
module.exports = {
entry: {
home: 'path/to/my/entry/home.js',
search: 'path/to/my/entry/search.js',
list: 'path/to/my/entry/list.js'
},
output: {
filename: '[name].js',
path: __dirname + '/dist'
}
};
结果:
path/to/my/entry/home.js → dist/home.js
path/to/my/entry/search.js → dist/search.js
path/to/my/entry/list.js → dist/list.js
2020.02.29
公司 明源云：
移动端：
1 为什么会有1px问题
https://juejin.im/post/5d19b729f265da1bb2774865
2 300ms延时解决原理
https://zhuanlan.zhihu.com/p/28052894
3 移动端有哪些事件
4 rem概念
通用问题：
1 前端安全问题：
https://zhuanlan.zhihu.com/p/83865185
2 亲身实践性能优化例子：
可以慕课网的专栏的目录
https://www.imooc.com/read/41
3 设计模式有哪些：
可以看慕课网的这个专栏目录
https://www.imooc.com/read/38
4 谈谈你对es6的理解:
这本书的目录已经描绘的很清晰了
《深入理解ES6》
- 块级作用域绑定
- 字符串和正则表达式
- 函数
- 扩展对象的功能性
- 解构：使数据访问更便捷
- Symbol和Symbol属性
- Set集合与Map集合
- 迭代器（Iterator）和生成器（Generator)
- JavaScript中的类
- 改进的数组功能
- Promise与异步编程
- 代理（Proxy）和反射（Reflection）API
- 用模块封装代码
5 我加一个：谈谈对html5的理解
https://developer.mozilla.org/zh-CN/docs/Web/Guide/HTML/HTML
- 语义：能够让你更恰当地描述你的内容是什么。
- 连通性：能够让你和服务器之间通过创新的新技术方法进行通信。
- 离线 & 存储：能够让网页在客户端本地存储数据以及更高效地离线运行。
- 多媒体：使 video 和 audio 成为了在所有 Web 中的一等公民。
- 2D/3D 绘图 & 效果：提供了一个更加分化范围的呈现选择。
- 性能 & 集成：提供了非常显著的性能优化和更有效的计算机硬件使用。
- 设备访问 Device Access：能够处理各种输入和输出设备。
- 样式设计: 让作者们来创作更加复杂的主题吧！
2020.3.4
公司 欢聚时代（YY）
1 script async defer区别？
- async 模式：
<script async src="index.js"></script>
async 模式下，JS 不会阻塞浏览器做任何其它的事情。它的加载是异步的，当它加载结束，JS 脚本会立即执行。
- defer 模式：
<script defer src="index.js"></script>
defer 模式下，JS 的加载是异步的，执行是被推迟的。等整个文档解析完成、DOMContentLoaded 事件即将被触发时，被标记了 defer 的 JS 文件才会开始依次执行。
从应用的角度来说，一般当我们的脚本与 DOM 元素和其它脚本之间的依赖关系不强时，我们会选用 async；当脚本依赖于 DOM 元素和其它脚本的执行结果时，我们会选用 defer。
2 typescript优势？ts的泛型怎么实现： (a: string): string, (a: object):object，(a:string): object,(a:object):string？
问题1:
- TypeScript 是 JavaScript 的超集，这意味着他支持所有的 JavaScript 语法。并在此之上对 JavaScript 添加了一些扩展，如 class / interface / module 等。这样会大大提升代码的可阅读性。
- TypeScript 是 JavaScript 的强类型版本。然后在编译期去掉类型和特有语法，生成纯粹的 JavaScript 代码。由于最终在浏览器中运行的仍然是 JavaScript，所以 TypeScript 并不依赖于浏览器的支持，也并不会带来兼容性问题。
- 静态类型检查：静态类型检查、IDE 智能提示、 代码重构可读性。
详情：https://www.zhihu.com/question/21879449
问题2:
3 vuex代码量很少？实现原理是什么？
4 diff算法详细 需要比对子节点吗？
5 webpack写一个雪碧图插件有什么思路？
https://juejin.im/post/59d2f80d6fb9a00a6a7466aa
6 浏览器api获取属性为什么也要重排?
浏览器为了保证属性值的实时性。
7 css 怎么实现任意大小的正方形?怎么样让宽高相等
提示:padding百分比
demo: demo
充电：各css单位%相对于谁
总结: 这些问题了解需要深入了解，简单的看博客是回答不上的。
公司 思为科技
今天（共同的问题）
1 html渲染过程？
参考阮一峰老师的
https://www.ruanyifeng.com/blog/2015/09/web-page-performance-in-depth.html
2 webpack loader 和插件的区别？
loader 面向的是解决某个或者某类模块的问题，而 plugin 面向的是项目整体
