20190717 前端开发日报

一个前端失业者的面试之旅;2019年6月份Github上热门的JavaScript开源项目;10分钟理解JS异步编程(从概念到原理);用 Javascript 写排序算法;JavaScript温故而知新——函数的4种调用方式;使用 Eslint + Prettier + husky + lint-staged 提高前端项目质量、统一项目代码风格;使用 Vue-router 在 Vue 页面之间传递数据;Webpack 理解Chunk

  1. 一个前端失业者的面试之旅 2018年,变动的一年,随着P2P的雷声不断轰鸣,各企业纷纷开始裁员过冬,“开猿节流”一词正式被创造,很不幸,笔者所在的金融公司也不得不进入“冬眠”,而我也在农历新年前变成了求职大军中的一员。 因为不想回家过年时连工作的没有,然后焦虑的心情每日缠绕于身,压力愈来愈大,随之下决心一定要在年前拿到offer,就为回...
  2. 10分钟理解JS异步编程(从概念到原理) 众所周知JavaScript语言执行环境是“单线程”( 单线程 ,就是指一次只能完成一件任务,如果有多个任务就必须排队等候,前面一个任务完成,再执行后面一个任务)。这种“单线程”模式执行效率较低,任务耗时长。 为了解决这个问题,提出了“异步模式”( 异步模式 ,是指后一个任务不等前一个任务执行完就执行,每个任务有...
  3. 用 Javascript 写排序算法 为了方便自己也帮到更多人,所有的排序算法都会简单说一下自己的思路,并附上自己能找到的最容易理解的可视化动画。 至于为什么选择用 Javascript,则是因为我觉得 Javascript 是最方便运行和调试的,只需要复制代码粘贴到浏览器的控制台就可以了,我为所有的算法附上了测试用例,通过引入 Mocha 就可以在浏览器中显...
  4. JavaScript温故而知新——函数的4种调用方式 非严格模式下的调用上下文( this 的值)是全局对象,严格模式 this 为 undefined function myFunction() { return this; } myFunction(); // 返回window对象 复制代码 二、作用方法调用 调用上下文为当前对象,即 this 指向当前对象 var calculator = { value1: 1, value2: 1, ...
  5. 使用 Eslint + Prettier + husky + lint-staged 提高前端项目质量、统一项目代码风格 前端代码风格因人而异,一个项目参与的人多了,不加强控制可能就是一个大杂烩,对开发人员来讲就是一个噩梦。 如何解决这种困境呢? Eslint 代码检查工具 Prettier 代码格式化工具 husky git hooks,git 钩子 lint-staged 对 git 中变更的文件进行 lint 操作 Eslint 代码检查,编辑器启...
  6. 使用 vue-router 在 Vue 页面之间传递数据 几周前,我写了关于 Vue 路由的使用和在 Vue 页面导航的文章。这是在应用程序中探索的一个基本例子。 通常,在将导航构建到应用程序中时,您会发现需要将数据从一个页面传递到另一个页面。(不通顺)例如,您遵循 master-detail 模式,其中您有一个数据列表,通过更深入地挖掘可以获得关于列表中特定项的更多信息。 我...
  7. Webpack 理解Chunk Chunk不同于entry、 output、module这样的概念,它们对应着Webpack配置对象中的一个字段,Chunk没有单独的配置字段,但是这个词出现在CommonsChunkPlugin(Webpack3以前)、optimization.splitChunks(Webpack4以后)这样的名称之中。 Chunk是我们理解Webpack,必须理解的一个概念。 Chunk在Webpack里指一个代码块,...
  8. Vue.nextTick使用和源码分析Vue 是采用异步的方式执行 DOM 更新。只要观察到数据变化,Vue 将开启一个队列,并缓冲同一事件循环中发生的所有数据改变。然后,在下一个的事件循环中,Vue 刷新队列并执行页面渲染工作。所以修改数据后DOM并不...
  9. vue 多项目配置 一个项目中配置多个项目 它们的差异性,网站 logo、api地址、title、部分组件页面差异 它们之间的差异性不是很大,用多分支切换项目成本太高,维护起来不方便 场景 启动项目时读取不同的配置 eg: npm run serve --project=projecaName --env=test 通过命令行输入参数,注册到应用的环境变量中,应用读取环...
  10. 轻量可嵌入的 QuickJS 引擎重磅开源,它会是下一个 V8 吗? 上周是这是 JavaScript 引擎的重要一周。在 Facebook 发布 Hermes 引擎之前, Bellard 以及 C 语言专家 Charlie Gordon 公开发布了 QuickJS。它是在 MIT 许可下发布的一个轻量可嵌入的 JavaScript 引擎,支持最新的 ES2019 语言规范。 正如 Twitter 上的一位网友所说“JavaScript 引擎很像公交汽车:你等了好几年都没来...
  11. JS面试:JS-Web-API DOM是哪种基本的数据结构?:树 DOM操作常用的API有哪些 DOM节点的attr和property有何区别 property 和attribute property:只是一个js对象的属性的修改 var obj = {x:100, y:200} console.log(obj.x) //100 var p = document.getElementsByTagName('p') console.log(p.nodeName) // P 这是字...
  12. JavaScript基础专题之类型转换(十二) 我们都知道 JavaScript 是一种动态类型语言,变量没有类型限制,可以随时赋予任意值。 var x = y ? 1 : 'a'; 复制代码 上面代码中,变量x到底是数值还是字符串,取决于另一个变量y的值。y 为 true 时,x 是一个数值;y为 false 时,x是一个字符串。这意味着,x 的类型没法在编译阶段就知道,必须等到运行时才能知道。 ...
  13. Vue CLI and Leaflet (7) 面绘制 面图形绘制流程 面绘制功能用户的操作方式和线绘制功能几乎是一模一样的。不同在于对用户操作的响应的部分。二响应部分只有两处不同。 1)当用户添加的点数为1时,地图上的显示线状橡皮筋效果。 线状橡皮筋效果 2)当用户添加的点数大于2时,地图上的显示线状橡皮筋效果。 二、...
  14. 【canvas】js 绘制真实时钟 Canvas绘制钟表 一、效果如图所示 二、详细设计过程 1. 分析 这个图形较为简单,使用的canvas api arc() 画圆 fillRect() 画矩形 fillText() 画字 2. 拆分 & 图层 图形虽简单,但由于涉及的图形较多,这里面有一些覆盖关系,所以要分析图层关系,这也是我们后面要依次...
  15. JavaScript 进阶问题列表,你掌握了多少?经常写业务就容易忽视对基础知识的补充和加强,但在面试中,基础知识点是非常重要的考核部分。本文要分享的是,一位开发者每天都会发布的 JavaScript 问题。有的容易,有的会有难度,对基础知识的查缺补漏非常有...
  16. 如何用钩子解耦 Vue.js 应用 原文: Build Decoupled Vue.js Applications with Hooks 作者:Markus Oberlehner 发表时间:9 June 2019 译者:西楼听雨 发表时间:2019/07/15 (转载请注明出处) Recently, I was wondering how best to decouple the code needed to track certain form submissions (e.g. conversion tra...

关注github前端日报 订阅精彩文章

前端日报栏目数据来自码农头条,每日分享互联网上热门的前端开发、移动开发、设计、资源和资讯等,为开发者提供动力,如果觉得内容对你有用,记得分享给你的小伙伴。进入码农头条查看更多

原文:20190717 前端开发日报 ,未经许可,禁止转载。
来源:前端开发博客 (http://caibaojian.com/fe-daily-20190717.html)