20200415 前端开发日报

浅谈webpack+vue从零开始的后台管理项目(一) —– webpack配置及构建vue初始化项目;JavaScript体系结构梳理(面试向);Webpack 5. 0 初体验;React diff探究;前端错误监控指南;JavaScript进阶之实现拖拽(上);web大前端面试——JavaScript;Vue源码的一些理解

  1. 浅谈webpack+vue从零开始的后台管理项目(一) —– webpack配置及构建vue初始化项目

    最近在总结深入自身掌握的知识点, 然后试着从零开始构建一个完整的webpack + VUE的项目. 然后通过 项目对整体流程进行了一个归纳总结, 文章会挺长, 分篇上传吧, 内容方面就以当前在做的后台 项目为示例对象, 发表一些个人归纳的东西, 希望对大家会有一定帮助. 当然, 还是那句话, 每个人的理 解观念不同, 也希望不…

  2. JavaScript体系结构梳理(面试向)

    本文首发于本人github上,以梳理本人JavaScript知识体系以及应对未来的工作面试。很多解决方案非原创,参考了很多博客和资料。内容将会持续更新中… 类型 值类型 vs. 引用类型 1. 区别 三点:存储位置,访问机制,变量间赋值不同。 前者:栈区,变量访问的是值本身,在栈区复制一份。 后者:堆区(+栈区),…

  3. Webpack 5. 0 初体验

    如 果 你 是 前 端 程 序 员 的 话 , 相 信 你 会 和 我 有 一 样 的 感 概 ‘ 前 端 个 丫 的 , 技 术 更 新 太 快 了 , 老 子 学 不 动 了 ’ 但 是 现 实 谁 会 管 你 哈 , 学 不 动 回 家 养 猪 去 。 :sob: 现 在 面 试 除 了 基 础 的 前 端 三 大 框 架 外 , 你 还 必 须 得 掌 握 w e b p a c k …

  4. React diff探究

    最近混子前端想探究一波 React diff,发现网上博客能讲通俗易懂的很少(也可能本人水平有限),所以打算四处借鉴,更新一篇 React 老版本的 diff 探究,虽然大家现在可能都在使用 React Hooks,但也许这和我本人一样总是后知后觉,好了,废话不多说,进入正文: 前言 React render 函数每次执行都会生成一个新的 Virt…

  5. 前端错误监控指南

    作为一个前端,在开发过程即便十分小心,自测充分,在不同用户复杂的操作下也难免会出现程序员意想不到的问题,给公司或个人带来巨大的损失。 这时一款能够及时上报错误和能够帮助程序员很好的解决错误的前端错误监控系统就必不可少了。 接下来我们就聊聊常见的错误发生与处理。 本文主要围绕以下几点讨论: 常…

  6. JavaScript进阶之实现拖拽(上)

    最近做到的react项目就有一个拖拽的需求,然后大概搜索了一下,找到了star比较高的 react-dnd 库,但是阅读 react-dnd 的官方文档还是有点 难受的 ,因为 概念性比较强 ,所以在介绍 react-dnd 之前我们来实现 原生拖拽 原生实现拖拽 Mouse事件实现拖拽 在h5之前,原生实现拖拽是根据 Mouse事件来实现的 ,需…

  7. web大前端面试——JavaScript

    什么是闭包?闭包是有权限访问其它函数作用域内的变量的一个函数。 在js中,变量分为全局变量和局部变量,局部变量的作用域属于函数作用域,在函数执行完以后作用域就会被销毁,内存也会被回收,但是由于闭包是建立在函数内部的子函数,由于其可访问上级作用域的原因,即使上级函数执行完,作用域也不会被销毁,此时…

  8. Vue源码的一些理解

    由于对于vue中一些操作的疑惑比如computed存在缓存机制如何实现,带着问题尝试去阅读vue源码,没想到越往后看想要了解的越多,根本停不下继续深入研究的脚步,断断续续花了几周的时间,终于初略地有点理解,如果有不正确的地方希望得到大牛的指正。 在开始前最好能先了解下Vue.component,Vue.extend,Vue.use,nextTi…

  9. js实现递归,尾递归(递归优化),防止栈溢出

    一 第一版一版的递归实现 n!,比如 5!= 5 * 4 * 3 * 2 *1 let count = 9000; const fact = (n) => { if (n == 1) { return 1; } else { return n * fact(n – 1); } }; let a = fact(count); //3628800; console.log(a); 但这样就会保持10条记录,这样很容易造成栈溢出;我们可以这样理解,执行…

  10. JVM 笔记:前端编译与优化

    1. 概述 所谓”编译“,通俗来讲就是把我们写的代码“翻译“成机器可以读懂的机器码。而编译器就是做这个翻译工作的。 Java 技术中的编译器可以分为如下三类: 前端编译器:把 *.java 文件转变为 *.class 文件的过程。比如 JDK 的 Javac。 即时编译器:Just…

  11. 源码角度分析 OkHttp 实现 WebSocket:握手/保活/数据处理…

    wolfcstech | 作者 承香墨影 | 校对 https://www.wolfcstech.com/2017/02/23/OkHttp实现分析之Websocket | 原文 前段时间写了篇文章,讲解了如何使用 OkHttp 实现 WebSocket 通信,但是只停留在一些使用和理论上,分享出来各项数据还不错。本来想继续写一篇 OkHttp 关于 WebSocket…

  12. 编写一个javascript元循环求值器

    在上一篇文章中,我们通过AST完成了微信小程序组件的多端编译,在这篇文章中,让我们更深入一点,通过AST完成一个javascript元循环求值器 结构 一个元循环求值器,完整的应该包含以下内容: tokenizer:对代码文本进行词法和语法分析,将代码分割成若干个token parser:根据token,生成AST树 evaluate:…

  13. 【Vue】 生命周期, created,mounted, methods , computed , watched

    生命周期: 用通俗的语言来说,就是Vue中实例或者组件从创建到消灭中间经过的一系列过程。 beforecreate : 一般使用场景是在加 loading事件 的时候 created :处于loading结束后,还做一些初始化,实现函数自执行(data数据已经初始化,但是DOM结构渲染完成,组件没有加载) beforemount :处于…

  14. Vue回炉重造之封装一个实用的人脸识别组件

    element UI Vue.js tracking-min.js face-min.js 源码 由于我们的电脑有的有摄像头,有的没有摄像头,所以我们需要根据不同的场景来封装这个组件。先放个图吧,大家可以看得更加直观一些。 有摄像头的话,我们就显示(需要人像识别组件): 没有摄像头的话,我们就显示(这个直接上传人像…

  15. 浅谈webpack+vue从零开始的后台管理项目(二) —– vue项目基础功能完善

    上一篇讲了使用webpack初始化构建vue项目, 那么这一篇接着上一篇的内容继续讲一下,element的引入, axios请求载入, router路由载入和vuex状态管理 一.公用样式初始化重置 在讲公用样式初始化重置之前, 首先需要知道为什么要样式重置. 为了兼容性考虑,每个浏览器默认样式不一样,比如行高,某个浏览器是1,另外zd一…

  16. 【何不三连】JS面向对象最后一弹-多态篇(羽化升仙)

    前言 你盼世界,我盼望你无 bug 。Hello 大家好!我是霖呆呆! 首先抱歉让大家久等了,大家一直期待的 "多态" 篇到现在才来 :blush:,其实我最近挺忙的,给张手机截图让大家感受一下。 算了,说了你们也不信。 因为平常开发中感觉多态听到的不多,所以就会让我们产生一个误解:多态并不重…

  17. Vue源码探秘(十一)(合并options)

    在上一篇文章的结尾,我们提到在 _init 的最初阶段执行的就是 merge options 的逻辑: // src/core/instance/init.js// merge optionsif (options && options._isComponent) { // optimize internal component instantiation // since dynamic options merging is pretty slow, and none of the // internal comp…

  18. 一篇文章带你使用Typescript封装一个Vue组件

    vue create ts_vue_btn 复制代码 这里使用了 vue CLI3 自定义选择的服务,我选择了 ts、stylus 等工具。然后创建完项目之后,进入项目。使用快捷命令 code . 进入Vs code编辑器(如果没有 code . ,需要将编辑器的 bin文件目录地址 放到环境变量的 path 中)。然后,我进入编辑器之后,进入设置工作区,随便设置一个参…

更多内容请关注公众号【前端开发博客】每日更新


关注我

我的微信公众号:前端开发博客,在后台回复以下关键字可以获取资源。

  • 回复「小抄」,领取Vue、JavaScript 和 WebComponent 小抄 PDF
  • 回复「Vue脑图」获取 Vue 相关脑图
  • 回复「思维图」获取 JavaScript 相关思维图
  • 回复「简历」获取简历制作建议
  • 回复「简历模板」获取精选的简历模板
  • 回复「加群」进入500人前端精英群
  • 回复「电子书」下载我整理的大量前端资源,含面试、Vue实战项目、CSS和JavaScript电子书等。
  • 回复「知识点」下载高清JavaScript知识点图谱

每日分享有用的前端开发知识,加我微信:caibaojian89 交流