渡鸦
渡鸦
## vue生命周期原理，钩子函数 create和mounted 的区别 参考 - https://juejin.im/post/5afd7eb16fb9a07ac5605bb3 - https://juejin.im/post/5c6d48e36fb9a049eb3c84ff   ## MVVM框架的设计理念 ## 为什么选择vue 为什么使用vue，首先要看和其他框架React/Angular的对比 ### React React 的特别是使用 JSX，有些人喜欢用，有些人不喜欢？看它的语法就知道 1. 一个render函数，里面又放html代码，又放 JS 代码。逻辑不能使用 if-else，只能使用一堆三元运算符。 css也可以当成对象属性放进去，揉在一块，虽然最后他们会编译成纯JS，反正我个人是比较喜欢 JS/CSS/HTML 分开写。 2....
## Event-Loop，一般出题说执行顺序，有可能问与Node的区别 ## Promise ## ES6有哪些新特性，Promise/Proxy可能会问 ## this指向，打印 ## 变量提升 ## JS判断变量类型 ## 继承、闭包 ## 深度克隆，函数缓存 ## 手撕bind/apply/call等 ## var f = function () {} 和 function f () {}的区别...
## 编程题 1. 排序算法，冒泡或者快排等，一个数组由小到大排序 2. JS 对象深拷贝 3. 写个函数，实现继承 4. 根据数组的某个值，找数组的索引 5. 数组的编程应用 ## 笔试题知识点 1. js 作用域 2. 变量提升等等 3. JS 基础知识，JS的内置对象有哪些 4. promise 基础知识 ## 项目题 1. 前端提高性能的方式...
### [一套完整的学习手册帮助自己准备 Google 的面试](https://github.com/jwasham/coding-interview-university/blob/master/translations/README-cn.md#%E7%BB%88%E9%9D%A2) ### [中山大学郑永川为了准备秋招的项目 算法/操作系统/网络/数据库/工具/编程实践](https://github.com/CyC2018/CS-Notes) ### [前端面试手册](https://github.com/yangshun/front-end-interview-handbook/blob/master/Translations/Chinese/README.md) ### [本项目教你如何通过饿了么大前端的面试](https://github.com/ElemeFE/node-interview) [来源](https://mp.weixin.qq.com/s/TwSbx1AW-WuBaFKfAbP6pw)
作者：Belinda 来自：segmentfault.com/a/1190000015916686 ## 基础题 题目的答案提供了一个思考的方向，答案不一定正确全面，有错误的地方欢迎大家请在评论中指出，共同进步。 怎么去设计一个组件封装 组件封装的目的是为了重用，提高开发效率和代码质量 低耦合，单一职责，可复用性，可维护性 前端组件化设计思路 ### js 异步加载的方式 渲染引擎遇到 script 标签会停下来，等到执行完脚本，继续向下渲染 defer 是“渲染完再执行”，async 是“下载完就执行”，defer 如果有多个脚本，会按照在页面中出现的顺序加载，多个async 脚本不能保证加载顺序 加载 es6模块的时候设置 type=module，异步加载不会造成阻塞浏览器，页面渲染完再执行，可以同时加上async属性，异步执行脚本（利用顶层的this等于undefined这个语法点，可以侦测当前代码是否在 ES6 模块之中） ### css 动画和 js 动画的差异...
ES6 module（import/export 语句）是静态的，所以无法用于按需加载。 但有一份新的规范提案 dynamic import（[tc39/proposal-dynamic-import](https://github.com/tc39/proposal-dynamic-import)）可用于动态加载。该提案已经达到 stage 3，有望在明年进入标准。 babel已经支持解析该语法：[Syntax Dynamic Import](https://babeljs.io/docs/en/babel-plugin-syntax-dynamic-import/)，不过要在生产环境用还需要配置其他插件。 以下为浏览器的实现情况： Safari: [Implement dynamic-import for WebCore](https://bugs.webkit.org/show_bug.cgi?id=166926) Chrome: [711706 - Implement dynamic import - chromium - Monorai](https://bugs.chromium.org/p/chromium/issues/detail?id=711706) lFirefox: [1342012 -...
### webpack-bundle-analyzer 插件 1. 分析依赖的第三方模块文件大小 2. 业务里面的组件的组件代码大小 3. 127.0.0.1:8888 访问 **配置** ```js const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin; module.exports = { plugins: [ new BundleAnalyzerPlugin() ] } ``` **效果**  ### [github...
### speed-measure-webpack-plugin 插件 1. 查看每一个loader或者是每一个插件的执行耗时 2. 分析整个打包总耗时 ```js const SpeedMeasurePlugin = require("speed-measure-webpack-plugin"); const smp = new SpeedMeasurePlugin(); const webpackConfig = smp.wrap({ plugins: [ new MyPlugin(), new MyOtherPlugin() ] }); ```...
### 构建异常和中断处理 **如何判断构建是否成功** 1. 在 CI/CD 的pipeline 或者发布系统需要知道当前的构建状态 2. 每次构建完后输入 `echo $?` 获取错误码 webpack4 之前的版本构建失败不会抛出错误码（error code） nodejs 中的 process.exit 规范 - 0 表示成功完成，回调函数中，err 为null - 非 0 表示执行失败，回调函数中，err不为null，err.code 就是传给 exit...