20190423 前端开发日报-前端开发博客

2019春招前端实习面经；5 分钟了解凭啥 Typescript 比 JS 还火；LeetCode 之 JavaScript 解答第8题 —— 字符串转换整数（String to Integer ）；axios封装以及前端接口处理策略；看了就会的next.js路由；关于前端脚本异常监控的思考；JS大坑之19位数的Number型精度丢失问题；45个值得收藏的 CSS 形状

2019春招前端实习面经从2019.1就开始渐渐的进行复习，2月末开始面试，到现在四月中旬基本宣告结束。在3月和4月经历了无数次失败，沮丧，意外，期待，崩溃，焦虑。我尽量回忆每一场面试问的问题，希望给后辈们做个参考。碰壁的三月企家有道（一面挂）2019.2.27 第一次面试，问了很多基础，非…
5 分钟了解凭啥 Typescript 比 JS 还火文/北妈阅读本文需要 5.1分钟一人的观念和喜好其实对一个成年人，而且有自己特定思想的人来说很难转变，比如生活里，你是宅男、腐女型的。然后，突然有人说宅不好，要多出去走走，体验体验大自然和不同的生活模式，这对你就造成了一种冲击和下…
LeetCode 之 JavaScript 解答第8题 —— 字符串转换整数（String to Integer ） Time：2019/4/19 Title: String To Integer Difficulty: Medium Author: 小鹿题目：String To Integer（字符串转换整数 (atoi)） Implement atoi which converts a string to an integer. The function first discards as many whitespace characters as necessary until the first non-whit…
axios封装以及前端接口处理策略在大型前端项目中，当有很多接口实现数据输入、流出并附加拦截，结合状态管理，抵御XSRF攻击等时，统一管理API接口就成为大型前端项目必须面对的环节。axios作为最流行的基于Promise的HTTP库可以同时运行在浏览器端和服务器端，已经成为大部分前端项目的首选。 POST序列化通过 JSON.stringify 我们同样可以实现…
看了就会的next.js路由在介绍路由之前，想先简单说一下目录结构，其中有些东西对于路由讲解还是很有帮助的 ├── .next │ ├── build-manifest.json │ ├── react-loadable-manifest.json │ ├── server │ └── static ├── components │ ├── head.js │ └── nav.js ├── pages │ ├── _app.js │ └── index.js ├── static │ └── fav…
关于前端脚本异常监控的思考这里讲的是如何高效合理的捕捉与定位问题，不涉及 pv、uv、埋点之类的业务监控首先我们要明白一点，前端如何捕获错误，在代码中我们可以经常使用 try…catch 来捕获错误，但是 try…catch 无法捕获语法错误和异步错误，如下所以 try…catch 不适合做全局的异常监听，当然对于已知的可能…
JS大坑之19位数的Number型精度丢失问题最近在实现一个需求的时候，需要接入第三方的接口，先调用A接口，A接口返回的数据里，有一个taskId，然后再使用这个taskId请求B接口，获取最终需要的数据。后端使用的是node，因此最开始使用的是request-promise这个包请求第三方接口，然而在获取A接口返回的taskId之后，调用B接口之后，B接口的响应居然是系统错误！…
45个值得收藏的 CSS 形状CSS能够生成各种形状。正方形和矩形很容易，因为它们是 web 的自然形状。添加宽度和高度，就得到了所需的精确大小的矩形。添加边框半径，你就可以把这个形状变成圆形，足够多的边框半径，你就可以把这些矩形变成…
React 与 React-Native 使用同一个 meteor 后台 meteor 可以快速构建 pc,移动端，桌面端应用。最大的优点是：数据库的数据发生变化时，可以实时推送到前端，非常适用于实时展示的应用开发。在 react,react-native 应用中，可以仅使用同一个 meteor 后台，实时向前端推送数据。 github 代码地址 metaor 安装 windows 安装 meteor 官方推荐choc…
说说如何利用 Node.js 代理解决跨域问题前后端分离，经常会出现跨域访问被限制的问题。跨域访问限制是服务端出于安全考虑的限制行为。即只有同域或者指定域的请求，才能访问。这样还可以防止图片被盗链。服务端（比如 Node.js）可以通过代理，来解决这一问题。 1 安装 request 库 npm install request –save-dev 复制代码 2 配置我们以知乎日报为…
实现一个简单的WebSocket聊天室
10分钟搭建属于自己的 Vue CLI3 项目模板 0x01 契机 Vue CLI3 出来已经很长时间了，一直想研究它的插件系统却没有时间~~（其实是懒）~~，刚好最近需要统一一下项目组的规范~~（借口）~~，于是就有了契机。先瞅一眼文档: CLI3插件和Preset 然后就教你怎么完全定制化一套前端项目模板，妈妈再也不用担心我每次复制粘贴啦~ 特别说明：这种 preset 不需…
使用 vue 实例更好的监听事件使用 vue 实例更好的监听事件 :star:️ 更多前端技术和知识点，搜索订阅号 JS 菌订阅文章举例说明一下在 vue 中如何更好的监听浏览器事件。原文介绍了一种新增 vue 实例的方法，单独监听事件。这样代码书写较为简练，容易管理。 :watermelon: 当监听如下事件的传统做法是： window.scrollX window.scrollY wi…
Vue踩坑笔记（更新ing）我们知道，Vue组件中，有时直接操作引用数据类型，视图有时并不会更新。 1.一个方法是使用 $set 例如 this.$set(this.obj,"key","value") this.$set(this.arr,index,"value") 复制代码 2.可以使用数组的部分方法可以使视图自动进行更新，就不需要使用 $set 了。 V…
前端笔记之NodeJS（四）MongoDB数据库&Mongoose&自制接口&MVC架构思想|实战
webpack支持启动dev服务和热更新，并支持打包时增加文件注释自己琢磨的一个项目，由于需要频繁的build，且需要http-server启动服务，故折腾弄了webpack的热更新服务。同时，修改配置，使支持打包时加入文件(头)注释。准备由于项目是基于typescript的，那我就直接按ts的来（后面再放js的），其实差别不是很大的都是前端项目，只不过ts的解析的是ts-loader，而js则是babel-…
关于 JavaScript 中的继承 ES5 之前，继续是这样实现的 function Parent() { this.foo = function() { console.log(‘foo’); }; } Parent.prototype.bar = function() { console.log(‘bar’); } function Child() { } Child.prototype = p = new Parent(); Child.prototype.constructor = Child; var c = new Child(); c instanceof Par…
[Vuex系列] – 初尝Vuex第一个例子 Vuex是什么？ Vuex是一个专为vue.js应用程序开发的状态管理库。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。通过定义和隔离状态管理中的各种概念并通过强制规则维持视图和状态间的独立性，我们的代码将会变得更结构化且易维护，这就是 Vuex 背后的基本思想。 …
关于vue-cli 3配置打包优化要点本文同步更新于我的个人博客点击前往。如果对您有帮助,请为我点个小星星。首先说下我目前已经做的优化点,本文是在此基础上做的进一步优化: 配置路由懒加载,封装了异步组件引入的方法,接收一个地址做参数 /** * 返回异步组件 * @tips 请注意页面只能挂载在views文件下,非此路径请勿使用 */ const AsyncCo…
React.js 的 state 碎碎念注：头图来自于 https://ihatetomatoes.net/react-state-management-tutorial-do-you-really-need-redux-or-mobx/ React里的组件，有从父级组件传下来的props，也可以有自己的状态state。在state改变时，会触发组件重新render。但是在实际开发中，经常会在state上很纠结，比如下面这些问题： …
用vue3公开的思路从0实现最简化的vue 我们用vue，是因为它是当前业界最佳的解决方案之一，但前端技术方案迭代及工业标准化发展的浪潮，大概率不会在vue这里到达终点。 jquery没有死，它的基因已经注入浏览器标准。而webcomponent shallow dom的灵感，同样有受到vue和react的vdom技术的启发。当然vue也在进化，但要知道，vue的竞争对手，并不是react，而是…
积梦前端采用的 React 状态管理方案: Rex积梦([链接] 是一个为制造业制作的一个平台.积梦的前端基于 React 做开发的. Rex 是我们在前端使用的状态管理方案, 类似 Redux.从名字也可以看, Rex 是一个基于 Redux 做了大幅简化的方案.另一方面, Rex 跟 Immer…
HTTPie：替代 Curl 和 Wget 的现代 HTTP 命令行客户端 | HTTPie 工具是现代的 HTTP 命令行客户端，它能通过命令行界面与 Web 服务进行交互。 …
190421-SpringBoot高级篇WEB之websocket的使用说明常见的web应用大多是提供基础的REST服务，简单来讲就是用户发起一个请求，然后给出反应，可以理解为由客户主动发起的单边操作；那么有没有一种技术是服务端主动发起，与客户端进行交互的？非常常见的几个需求场景，如聊天室的实现，股票的委托、成交实时刷新，信息推送机制，应用日志实时刷新等用我们传统的web交互方…