logoHi! I'm Mofei!
  • 首页
  • 博客
  • 实验室
  • 留言
  • 小伙伴
  • English
  • 
全部88前端基础10HTML2CSS3JavaScript45Node.JS4可视化8杂谈15Python学习1

理解 JavaScript 中的 microtasks 和 macrotasks(微任务和宏任务)

 Tags:  前端基础JavaScript
如果一段JavaScript代码中包含了setTimeout几乎所有的前端同学都知道其代码会被延迟(异步)执行,但是如果代码中同时出现了setTimeout、await以及Promise resolve的话大家还能说出来他们的先后执行顺序么?先抛出一个网上流传的前端面试题,主要考察的知识点是异步asyncawait,setTimeout,Promise resolve的执行先后顺序,也就是我们这里要讨论的microtaks(异步微任务)和macrotasks(异步宏任务): javascript async function async1() { ...
2021-01-14 00:25:46
 158  1 

配置全局.gitignore文件

 Tags:  前端基础JavaScript
很多时候,在审查代码的时候,会看到.gitignore文件中这样的提交: bash composer.lock package.lock .vscode 其中.vscode是vscode的配置文件,如果所有人都把自己的环境编辑器配置放到.gitignore中的话,就会导致.gitignore文件很长很难维护。为了保持项目的干净整洁,可以使用全局.gitignore 全局 .gitignore 1. 新建全局.gitignore文件,通常情况下放在home是个不错的选择 touch ~.gitignore 2....
2021-01-04 10:46:21
 203  3 

如何使用Canvas实现一个时间控件

 Tags:  可视化前端基础JavaScript
前段时间在一个分享上提及到了我们的时间穿梭控件,分享之后很多同学在Github的Issue中留言想了解该控件的具体开发过程,利用周末的时间将该控件单独重新写成一个Demo,和大家分享一下具体的技术实现细节。 重新整理的控件开源在Github上 https:github.comzmofeitimeplayer ,也欢迎大家在Issue中对代码提出问题或者建议,共同探讨一起进...
2020-03-22 13:54:50
 1226  5 

如何在微信小程序里加载超好看的 Mapbox 地图?

 Tags:  可视化前端基础
小程序,正在成为一种 Pre-App,以一种轻量的方式,来测试 App 的功能和用户场景,便于在正式的 App 中作出更明智的决策。 只可惜,在微信小程序里,只支持自家的地图,比如最基本的地图显示。 所以,开发者们看着 Mapbox 绝美的样式,真的只能望洋兴叹么? ![P3](https:s...
2019-06-06 08:48:10
 2316  2 

在微信小程序中使用Mapbox地图

 Tags:  前端基础
由于某些众所周知或者是中所不知的原因,在微信的小程序中我们只能调用腾讯自家的地图(差评),看着Mapbox绝美的样式只能望洋兴叹。在耗费了200根工程师的头发之后我们终于想到了一个曲线救国的方案(PS:工程师的头发可值钱了,尤其是高级工程师),先看效果: 怎么样,是不是很神奇?! How? 或许你已经想到了,没错,我们是通过微信提供的 [web-view](https:developers.weixin.qq.commini...
2019-01-22 03:14:29
 389  1 

JavaScript数字前补0小技巧

 Tags:  前端基础JavaScript
经常处理财务数据的朋友可能会遇到这样一个需求:给定一个数值,转换成固定的长度的字符串,不足的地方前面补零,比如 123 = 000123。 通常我们会尝试这样的做法: let num = 123; 把数值转换成字符串 let numStr = num.toString(); let strLen = 5; 计算差几个空缺的0 let spaceLen = strLen - numStr.length; 拼出这些0 let spaceStr = ''; for(let i=0; i<spaceLen; i){ ...
2019-01-10 03:21:10
 2110  4 

像大神一样写代码之代码质量控制

 Tags:  JavaScript前端基础Node.JS
Mofei超爱开源,最近接触了不少大神的开源项目,特别羡慕这些项目的代码质量控制,再加上公司最近也在强调代码质量,在挖坑、填坑的路上总结出一些经验和大家分享。 今天想聊的是其中的持续集成、单元测试和代码覆盖率的部分。 从我个人的角度来看,虽然单元测试和代码覆盖率会在一定程度...
2018-11-13 15:35:56
 3144  8 

JavaScript生成CSV,以及中文乱码问题

 Tags:  JavaScript前端基础
由于工作的原因经常需要将表格导出成CSV格式,之前这类的工作都是交由后端处理的,这次由于是做一个单纯的前端工具,所以不想麻烦后台大神,尝试了一次通过JavaScript生成CSV。其实整个过程通按照BaiduGoogle上搜索出来的方案就可以流畅的完成,但是实际使用的时候,遇到了一些小问题,比如说中文乱码等,虽然折腾了半个小时用很hack方法解决了,但是整体回顾下来还是蛮有意思的,这里简单的整理一下。 Data URLs 首先需要介绍一下Data URLs,其允许通过URL地址的方式存储文件,我们的CSV也是利用了这个技术,将CSV的内容转成URL,然后在新窗口打开,这样浏...
2017-08-22 12:57:05
 6024  11 

JavaScript 的多线程,Worker 和 SharedWorker

 Tags:  JavaScript前端基础
随着业务的发展,前端脚本处理大量数据的情况已经变的越来越常见了。但是,当我们尝试用前端脚本处理大量数据的时候,会发现这样的计算可能占用过多资源导致页面前端UI线程的假死。在这背景下,为了让页面有更好的体验,W3C在HTML5的规范中提出了Web Worker的概念,允许浏览器通过后台线程来执行复杂的事物或者逻辑。 1. 大量计算导致的页面假死 先让我们看一下什么情况下会导致页面假死。 假死Demo传送门 (代码: 1.[withoutWorker...
2017-05-07 04:45:03
 5880  10 

怎样成长为一个优秀的 Web 前端开发工程师?

 Tags:  前端基础
在知乎上看到了这个问题,答得非常好,分享一下。 What makes a good front end engineer? ===== 原博文地址:http:www.nczonline.netblog20070815what-makes-a-good-front-end-engineer Nicholas C. Zakas谈怎样才能成为优秀的前端工程师: 昨天,我负责了Yahoo!公司组织的...
2013-12-27 04:34:42
 7622  8 
1
(C) 2010-2020 Code & Design by Mofei
Powered by Dufing (2010-2020) & Express
IPC证:皖ICP备11015043号