20200502 前端开发日报

（立下flag）每日10道前端面试题-15 关于【高级技巧】十问；一个HTTP请求的曲折经历；JS里循环截取（slice）数组中固定长度，获取新数组；Spring Boot 2.0 打包与自定义 launch.script；【技术思考系列】为什么使用TypeScript开发vue2.x体验很差？；Vue源码探秘（十三）（组件注册）；面试中关于 JavaScript 作用域的 5 个陷阱；动态路由前端控制还是后端控制？（附代码）

1. （立下flag）每日10道前端面试题-15 关于【高级技巧】十问

   第一问：安全类型检测——typeof和instanceof 区别以及缺陷，以及解决方案 这两个方法都可以用来判断变量类型 区别：前者是判断这个变量是什么类型，后者是判断这个变量是不是某种类型，返回的是布尔值 （1）typeof 缺陷： 1.不能判断变量具体的数据类型比如数组、正则、日期、对象，因为都会返回object,不过可以…

2. 一个HTTP请求的曲折经历

   作为程序员的我们每天都在和网络请求打交道，而前端程序员接触的最多的就是HTTP请求。平时工作中，处理网络请求之类的操作是最多的了。但是一个请求从客户端发出到被服务端处理、再回送响应，再被客户端接收这一…

3. JS里循环截取（slice）数组中固定长度，获取新数组

   应用场景：换一批功能 {代码…}

4. Spring Boot 2.0 打包与自定义 launch.script

   原创：小姐姐味道（微信公众号ID：xjjdog），欢迎分享，转载请保留出处。 今天和首架聊到springboot的配置参数问题。他说，这些配置的参数，开发人员拷贝来拷贝去的，很容易出错，不如我们屏蔽一下吧。 确实，经过工程师的ctrl+c和ctrl+v，大多数重要的参数已经面目全非，完全不是当初的模样。我…

5. 【技术思考系列】为什么使用TypeScript开发vue2.x体验很差？

   都这么写了，为什么还要用ts？ ——来自我的日常吐槽 “为什么使用TypeScript开发vue2.x体验很差？”，这句话不仅是一句吐槽，也是一种疑惑。 吐槽的是：花费了更多的时间，使用TypeScript构建出的类型安全的代码，在书写Vue模板时竟然完全用不上。 疑惑的是：为什么React跟TypeScript结合的那么好，而Vue却一塌糊…

6. Vue源码探秘（十三）（组件注册）

   在 Vue.js 中，除了它内置的组件如 keep-alive 、 component 、 transition 、 transition-group 外，其它用户自定义的组件在使用前必须注册，否则会抛出如下错误： 组件的注册有两种方式： 全局注册 和 局部注册 。这里我们举两个例子： // main.jsimport Vue from "vue";import App from…

7. 面试中关于 JavaScript 作用域的 5 个陷阱

   作者：Dmitri Pavlutin翻译：疯狂的技术宅 原文：[链接] 未经允许严禁转载 在 JavaScript 中，代码块、函数或模块为变量创建作用域。例如 if 代码块为变量 message 创建作用域： {代码…} 在 if 代码块作用域内…

8. 动态路由前端控制还是后端控制？（附代码）

   关于后台管理系统的路由，想花一点时间，彻底的整理一份实现动态路由的点点滴滴。 首先声明，这篇文章是基于花裤衩大神的《手摸手，带你用vue撸后台》，在他项目的基础上，帮助想要实现动态路由的小伙伴，来写的一篇使用笔记。 segmentfault.com/a/119000000… 为什么要实现动态路由? 我们在开发后台管理系统的…

9. 基于 Express + MySql 的 Node.js 的后端开发

   框架: express 数据库 ORM : sequelize 、 mysql2 依赖注入: awilix 路由插件: awilix-express 项目结构 |– express-backend |– src |– api // controller api文件 |– config // 项目配置目录 |– container // DI 容器 |– daos // dao层 …

10. vue-cli4从零开始搭建Vue项目

    记录一下使用vue-cli4从零开始搭建Vue项目，并进行一些工具的封装。希望能够通过这个过程，了解一个Vue项目所用到的知识，整合成一个体系。 安装脚手架vue-cli4 现在Vue项目的搭建都是使用脚手架vue-cli一键搭建的，不同版本的vue-cli生成的项目目录是不一样的。目前vue-cli已经更新到了4.3.1版本(2020/4/25)，这里…

11. 从 script 标签说到 webpack：javascript 模块化历史

    ### 前言 最近有个需求要用到 dynamic import ，发现 require 也可以实现同样的效果，但是 webpack 不推荐用多种 module method 。后来就尝试去了解关于 static import / dynamic import / require 之间的区别。再后来就顺便复习了一下 requirejs 和 seajs，还有更早之前的通过闭包实现的模块化以及相应的设计模式。…

12. 敲黑板写给前端看的 JSBridge 原理

    JSBridge 的起源 近些年，移动端普及化越来越高，开发过程中选用 Native 还是 H5 一直是热门话题。Native 和 H5 都有着各自的优缺点，为了满足业务的需要，公司实际项目的开发过程中往往会融合两者进行 Hybrid 开发。Native 和 H5 分处两地，看起来无法联系，那么如何才能让双方协同实现功能呢？ 这…

13. vscode配置使vue项目支持断点调试

    每个应用，不论大小，都需要理解程序是如何运行失败的。当我们写的程序没有按照自己写的逻辑走的时候，我们就会逐步一一排查问题。在平常开发过程中我们可能会借助 console.log 来排查,但是现在我们可以借助 vscode 断点来调试项目。 先决条件 Chrome VS Code Debugger for Chrome Vue CLI 3 浏览器断点调试 …

14. 再来一打Web安全面试题

    本文已收录在Github github.com/Geekhyt，感谢Star。 从胡子的长度和忧郁的眼神我察觉到，面前坐着的这位面试官应该有点东西。 浑身上下流露着打过CTF的气场。我像以往一样，准备花3分钟的时间进行自我介绍。在此…

15. 变异野生前端的某东方面试之路（直播中

    游泳健身了解一下： github 1面 实际项目中最常用到的数组方法 shift,pop,push,unshift,splice,slice,join,split,reverse,等等 复制代码 实现数组的 map 方法 Array.prototype.map = function() { // todo } 解 思路是看如何使用通过如何使用来判断条件 Array.prototype.Map = function(fn){ …

16. 转行学前端的第 23 天 : 了解 javaScript 实现

    我是小又又，住在武汉，做了两年新媒体，准备用 6 个月时间转行前端。 今日学习目标 昨天基于一些页面搜索，学习了《JavaScirpt 高级程序设计》(第三版) 1.1 章节，今天主要是基于搜索来学习 1.2 章节中的 JavaScript 实现，又是适合学习的一天，加油，小又又！！！！ 今日学习概要 虽然 JavaScr…

17. 如果使用 JavaScript 原型实现继承

    点赞再看，养成习惯本文 GitHub [链接] 上已经收录，更多往期高赞文章的分类，也整理了很多我的文档，和教程资料。欢迎Star和完善，大家面试可以参照考点复习，希望我们一起有点东西。

18. 手拉手带你开启Vue3世界的鬼斧神工

    2020注定是不平凡的一年，无论是疫情的横空出世，还是世界局势的激烈动荡，抑或是股市的跌宕起伏，我相信很多国人都会有一种庆幸我是中国人的深刻感悟。作为一名技术宅，除了疫情，更多的还是雨女无瓜，随着 Vue3.0 Beta 的推出，大家都争先恐后的尝了鲜，笔者也不例外，经过一番研究，觉得 Vue3 也的确存在它独特的魅力…

19. JQuery、Vue、React、Angular，JavaScript 框架成本终极对比

    本文最初发布于 Tim Kadlec 博客，经原作者授权由 InfoQ 中文站翻译并分享。 想要减慢网站的速度，最快的办法就是塞进去一堆 JavaScript 代码了。 JavaScript 的问题是，到最后你要缴纳至少四次性能税： 在网络上下载文件的成本 下载后解析和编译未压缩文件的成本 执行 JavaScript 的成本 内存成本 …

20. JavaScript优秀实践之改进类

    使用默认参数和属性缩写，清理我们的JavaScript代码很容易。 在本文中，我们将探讨创建类的优秀做法以及何时创建类。 构造函数 为了让我们的构造函数更好地发挥作用，我们应该做一些事情。它们是： 如果可能的话，初始化所有构造函数中的所有成员数据 我们应该将它们全部放入构造函数中，以便在实例化…

21. 可能被你忽略的 JavaScript 代码陷阱

    下面这段代码，你知道有哪些错误吗： 以下是代码片段： var g_bar = "bar"; function foo(container, config) { var container = container || document, name = config.name || "无名氏", isLive …

22. 【技术思考系列】如何让TypeScript完美兼容Vue2.x的JSX

    TypeScript如何处理JSX TypeScript参考了React的JSX，那么我们就以React为例，来分析TypeScript是如何处理React的JSX的。 <div id="main"> <MyComponent title="my-component"></MyComponent> </div>复制代码 这段代码足以囊括React的JSX使用的各种方面：宿主元素…

23. 编译原理：从0写一个js解释器

    前段时间写了一个js解释器，在没有依赖任何第三方库的情况下。 到目前已经已经把除了对象以外的JS大部分基础功能写出来了，在此分享和回顾一下主要实现和技术细节。 github.com/zuluoaaa/ma… 解析一个快排函数 0 初始化 我们输入一串有意义的js字符串 1 词法分析 遍历循环输入，将字符串逐个…

24. 使用Go开发前端应用（二）

    在之前的第一篇文章： juejin.im/post/5e9ee0… 中，大概介绍了怎么使用Go去编写代码，然后将代码编译成wasm，之后可以在js中使用wasm。是一个非常简单的demo，这篇文章主要会用来讲解两个方面的知识 简单介绍wasm js中加载wasm js中访问wasm中导出的方法 wasm中访问js中的方法 简单介绍wasm 本来…

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