- 博客(106)
- 收藏
- 关注
RSS订阅原创 Chrome插件：统计你每日摸鱼时长，降低自己的摸鱼时间和频率
减少摸鱼的时间和频率的Chrome插件：在上班/学习期间很容易下意识的打开摸鱼网站，插件帮助我们减少摸鱼的时间和频率，提高我们上班和学习的效率，节省时间用于学习提升自己或者享受生活。
2022-01-18 09:34:13
808
1
原创 用来阻止你摸鱼，节省你的时间，提高你的工作和学习效率-我的Chrome插件
stop-mess-aroundchrome插件通过强制的手段禁止大家浪费时间摸鱼，在上班/学习期间下意识的打开摸鱼网站, 自动检测摸鱼网站, 提示激励信息后, 关闭摸鱼网站。Github地址stop-mess-around插件解决的问题: 停止下意识的摸鱼在工作、学习期间，如果事情不是太忙，或者说在学习/忙碌一小段时间之后。就会下意识的打开或者输入知乎、掘金沸点、微博等网站，开始了摸鱼时光。可能是摸鱼奶头乐太快乐了，时间很快就过去两三个小时，而忘记自己的工作、学习初衷了。事后我们通常会
2021-06-25 09:29:24
576
原创 只需三个文件教你实现命令行终端[electron实战项目学习]
前言Electron很出名，很多人可能了解过，知道它是用来开发桌面端的应用，但是一直没有在项目中实践过，缺乏练手的实践项目。很多开源的命令行终端都是使用Electron来开发的，本文将从零开始手把手的教大家用Electron写一个命令行终端。作为一个完整的实战项目示例，该终端demo也将集成到Electron开源学习项目electron-playground中，目前这个项目拥有800+ Star⭐️，它最大的特点是所见即所得的演示Electron的各种特性，帮助大家快速学习、上手Electron。.
2021-01-13 14:36:06
1326
2
原创 人生是一场马拉松-OBKoro1的2020年年终总结
前言一晃眼2020年马上就要过去了，今年感觉过的特别快。工作已经三年了，之前都没有写过年终总结，结果造成了下面这个现象:回首过去的几年，记忆已经很模糊了，需要很用力才能想起过去一部分往事。人生百年，好像也没有多少年终总结可以写呢~这么激励一下，一下子就有动力写年终总结了 ????工作在家办公年初的疫情，是2020年过不去的记忆~待到山花烂漫时，我们再相见当时疫情比较严重，全国封闭，公司很快就宣布在家办公，并且特地说明了不用担心隔离14天赶不上上班~对于当时还惶惶不安的朋友来说，着实感受
2020-12-10 14:23:03
599
1
原创 Electron桌面端所见即所得-electron特性快速学习与上手
突然让你开发Electron应用，你能hold住吗？如果领导突然说需要开发一款前端桌面端应用，那么对于我们前端er来说选择Electron是一件顺理成章的事情。但事实上很多同学对于Electron都不太了解和熟悉。如果突然让我们去开发Electron应用，很多人都会陷入迷茫和懵逼的状态。然后在依靠网上相对较少的资料，慢慢摸索、一路踩坑的完成Electronn的需求。为了解决上述问题，我们完成了一个项目，并把它开源了出来, 希望能够对大家学习Electron有点帮助。快速学习和上手Electron:.
2020-12-04 16:00:12
589
原创 注释工具一键添加佛祖保佑永无BUG、神兽护体等注释图案
很早之前就见过各种佛祖保佑永无BUG、神兽护体等形式的注释，感觉很有趣，蛮骚的????。然后最近有人在我开源的VSCode插件：**koroFileHeader**里面给我提issue，希望能够支持这种类型的注释。现在开发完成了，大家可以根据下面的使用方式试用一下。koroFileHeader插件简介这个插件目前维护两年多了，有1300+Star，支持所有主流语言，支持自定义语言(不支持的语言可以自行设置)。作用: 在文件开头添加注释，记录文件信息/文件的传参/出参等，让人对文件的功能一目了然。
2020-05-20 10:15:57
1465
4
原创 论如何优雅的一键填满Github的绿色格子-AutoCommit
autoCommit一个用于Git自动commit的VSCode插件，它可以用来补充之前忘记提交commit，帮助你把首页的绿色格子填满。使用效果使用本插件来控制commit次数.如下图，你甚至可以规划一下commit次数，然后画出图形, 天空才是你的极限。功能特性选择多个日期范围：一次操作即可提交不同日期commit控制每个日期的commit次数: 可以用它来控制绿色格...
2020-01-13 10:09:26
1778
原创 eslint plugin rule如何定制以及ESLint rule运行原理
这篇文章目的是介绍如何创建一个ESLint插件和创建一个ESLint rule，用以帮助我们更深入的理解ESLint的运行原理，并且在有必要时可以根据需求创建出一个完美满足自己需求的Lint规则。插件目标禁止项目中setTimeout的第二个参数是数字。PS： 如果是数字的话，很容易就成为魔鬼数字，没有人知道为什么是这个数字, 这个数字有什么含义。使用模板初始化项目：1. 安装NPM包...
2019-12-09 10:03:26
967
原创 JS基础-前端面试继承(手写继承)、继承的优缺点
前言上篇文章详细解析了原型、原型链的相关知识点，这篇文章讲的是和原型链有密切关联的继承，它是前端基础中很重要的一个知识点，它对于代码复用来说非常有用，本篇将详细解析JS中的各种继承方式和优缺点进行，希望看完本篇文章能够对继承以及相关概念理解的更为透彻。本篇文章需要先理解原型、原型链以及call的相关知识：JS基础-函数、对象和原型、原型链的关系js基础-面试官想知道你有多理解call,ap...
2019-09-23 10:12:09
1228
原创 JS基础-原型、原型链真的不能一知半解
JS的原型、原型链一直是比较难理解的内容，不少初学者甚至有一定经验的老鸟都不一定能完全说清楚，更多的"很可能"是一知半解，而这部分内容又是JS的核心内容，想要技术进阶的话肯定不能对这个概念一知半解，碰到问题靠“猜”，却不理解它的规则！prototype只有函数有prototype属性let a = {}let b = function () { }console.log(a.protot...
2019-08-26 10:44:47
415
原创 前端中等算法-无重复字符的最长子串
无重复字符的最长子串难度：中等描述：给定一个字符串，请你找出其中不含有重复字符的 最长子串 的长度。样例：输入: “abcabcbb”输出: 3解释: 因为无重复字符的最长子串是 “abc”，所以其长度为 3。输入: “bbbbb”输出: 1解释: 因为无重复字符的最长子串是 “b”，所以其长度为 1。输入: “pwwkew”输出: 3解释: 因为无重复字符的...
2019-08-09 10:27:00
216
转载 js call/apply，bind面试官想知道什么？
函数原型链中的 apply，call 和 bind 方法是 JavaScript 中相当重要的概念，与 this 关键字密切相关，相当一部分人对它们的理解还是比较浅显，所谓js基础扎实，绕不开这些基础常用的API，这次让我们来彻底掌握它们吧！目录call,apply,bind的基本介绍call/apply/bind的核心理念：借用方法call和apply的应用场景bind的应用场景中...
2019-08-05 10:30:53
425
原创 图片外链失效，怎么办？使用npm工具一次性下载/替换所有失效的外链图片
前言大约一个月前，微博的图片外链失效了，以及掘金因为盗链问题也于2019/06/06决定开启防盗链，造成的影响是：个人博客网站的引用了这些图片外链都不能显示。目前微博和掘金的屏蔽，在CSDN和segmentfault都是可以正常显示的，只影响个人博客。比如前段时间我的博客:http://obkoro1.com上引用的微博图片都不能显示了。因为我写博客比较频繁，被屏蔽的图片不在少数，肯定不...
2019-06-05 11:43:20
810
原创 js 普通函数和es6箭头函数的区别以及箭头函数的注意事项、不适用场景
箭头函数是ES6的API，相信很多人都知道，因为其语法上相对于普通函数更简洁，深受大家的喜爱。就是这种我们日常开发中一直在使用的API，大部分同学却对它的了解程度还是不够深…普通函数和箭头函数的区别：箭头函数的this指向规则：1. 箭头函数没有prototype(原型)，所以箭头函数本身没有thislet a = () =>{};console.log(a.prototype)...
2019-03-23 19:31:18
3054
3
原创 js sendBeacon 刷新/关闭页面之前发送请
背景：有一个任务非常耗时会消耗后台大量算力，所以在退出页面的时候，要求前端这边发送一个请求来杀死任务。一开始以为这个需求非常简单，就是在进入其他路由前，发送一下请求，杀死一下任务就好了。然而现实狠狠的打了我的脸，因为退出页面的场景不止切换路由~退出页面场景：还在本网站，跳到其他路由刷新页面/关闭页面也需要发送请求来杀死任务还在本网站，跳到其他路由这个比较简单，在Vue中可以通过...
2019-02-25 10:33:01
1951
原创 js 浏览器桌面通知npm插件 notification-koro1
H5 notification:一个浏览器桌面通知 npm 包,求 Star轻量:体积不超过 2KB安装:npm i -S notification-koro1使用：插件在vue项目中使用的示例：.vue文件1. 导入 && 初始化:初始化需要两个参数:title(通知的标题)、options(配置)，具体信息查阅wiki文章和MDNimport notif...
2019-02-21 09:06:45
1524
原创 js 浏览器桌面通知notification
Notification是HTML5新增的API，用于向用户配置和显示桌面通知。上次在别的网站上看到别人的通知弹窗，好奇之余也想知道如何实现的。实际去查一下发现并不复杂，且可以说比较简单，故写篇博客分享给大家,希望能帮你们了解这个API。npm包：我还发了一个npm包:notification-Koro1，非常轻量简洁，觉得不错的话，点个Star吧~chrome下Notification的...
2019-02-21 09:02:23
5370
转载 var和let/const的区别
let和const是 ES6 新增的命令，用于声明变量，这两个命令跟 ES5 的var有许多不同，并且let和const也有一些细微的不同，再认真阅读了阮一峰老师的文档后，发现还是有一些不知道的细节…博客、前端积累文档、公众号、GitHub内容：var和let/const的区别块级作用域不存在变量提升暂时性死区不可重复声明let、const声明的全局变量...
2019-01-04 11:28:04
535
1
原创 浏览器重绘重排与优化-前端进阶
很多人都知道要减少浏览器的重排和重绘，但对其中的具体原理以及如何具体操作并不是很了解，当突然提起这个话题的时候，还是会一脸懵逼。希望大家可以耐着性子阅读本文，仔细琢磨，彻底掌握这个知识点！博客、前端积累文档、公众号、GitHub网页生成过程：HTML被HTML解析器解析成DOM 树css则被css解析器解析成CSSOM 树结合DOM树和CSSOM树，生成一棵渲染树(Render T...
2018-12-24 10:43:23
663
1
原创 web 全屏模式轻松掌握[局部元素全屏展示]
我第一次对网页全屏模式有概念，是那种网页播放视频的全屏播 放的那种。感觉很强，前几个星期有个需求也是关于全屏模式的，接触之后才知道全屏模式并不神秘，是个很容易掌握的技能…博客、前端积累文档、公众号、GitHubCodePen Demo地址：演示、code进去看看，玩一下，本文将结合这个demo一起进行讲解。全屏功能封装在一个类里面：我把全屏模式封装在一个类里面，在代码中有详细的...
2018-12-03 08:28:26
1134
原创 前端er来学习一下webWorker吧
我们都知道，JavaScript 是单线程的，在同一时刻只能处理一个任务，我们会通过 setTimeout()、setInterval()、ajax 和事件处理程序等技术模拟“并行”。但都不是真正意义上的并行:Web Worker 是 HTML5 标准的一部分，这一规范定义了一套 API，它允许一段 JavaScript 程序运行在主线程之外的另外一个线程中。这在很大程度上利用了现在不断升级...
2018-11-27 13:22:20
293
原创 一份超级详细的Vue-cli3.0使用教程[赶紧来试试！]
前言在vue-cli 2.X的时候，也写过一篇类似的文章，在八月份的时候vue-cli已经更新到了3.X，新版本的脚手架，功能灰常强大，试用过后非常喜欢，写篇教程来帮助各位踩一下坑。游泳、健身了解一下：博客、前端积累文档、公众号、GitHub主要内容：零配置启动/打包一个.vue文件详细的搭建过程重点推荐：使用图形化界面创建/管理/运行项目安装：卸载旧版本：如果你事先...
2018-11-15 10:38:51
1204
原创 手摸手教你使用WebSocket[其实WebSocket也不难]
在本篇文章之前，WebSocket很多人听说过，没见过，没用过，以为是个很高大上的技术，实际上这个技术并不神秘，可以说是个很容易就能掌握的技术，希望在看完本文之后，马上把文中的栗子拿出来自己试一试，实践出真知。游泳、健身了解一下：博客、前端积累文档、公众号、GitHubWebSocket解决了什么问题：客户端(浏览器)和服务器端进行通信，只能由客户端发起ajax请求，才能进行通信，服务...
2018-10-25 10:42:30
1398
原创 VsCode 添加文件头部注释和函数注释[koroFileHeader]
以前发过这个插件，这回版本升级了一下，修复了以前默认配置项不能删除，顺序不能移动的问题，并且新增了光标处添加函数注释的功能，也重写了一遍readme，所以再推广一下这个插件，下一步计划是支持其他语言的注释。以下是readme正文。koroFileHeader一个读取用户自定义模板，通过快捷键添加文件头部注释、在光标处添加函数注释的VsCode插件language简体中文 | E...
2018-10-17 10:31:09
18001
8
原创 VsCode读取项目文件的Eslint规则 保存时自动修复格式错误
前言：同一个项目，保持代码风格的一致，是非常重要的一个规范。但事实上项目小组成员的代码校验规则、格式化工具通常都不一致，为了避免项目到后期出现无法维护的问题，项目成员使用同一套校验规则，同一个格式化方式是相当好的步骤之一。个人博客了解一下：obkoro1.com保存时自动统一代码风格：先通过一些简单的配置，然后：Ctrl+s / command+s 时自动修复代码的格式错误自动...
2018-09-19 09:18:06
7090
原创 VuePress 手摸手教你搭建一个类Vue文档风格的技术文档/博客
前言：VuePress是尤大为了支持 Vue 及其子项目的文档需求而写的一个项目，VuePress界面十分简洁，并且非常容易上手，一个小时就可以将项目架构搭好。现在已经有很多这种类型的文档，如果你有写技术文档的项目的话，VuePress绝对可以成为你的备选项之一。VuePress特性：为技术文档而优化的 内置 Markdown 拓展在 Markdown 文件中使用 Vu...
2018-09-10 10:23:03
9437
4
原创 前端er怎样操作剪切复制以及禁止复制+破解等
前言有时候我们经常会碰到这些场景：玩掘金、知乎的时候复制一段文字，总是会在内容后面加上一些版权信息，以及像小说网站等都有禁止选中，禁止复制这种功能，还有点击自动复制账号的功能。我也经常遇到这些场景，有时候会去想这后面到底是怎么做，周末趁着有空去研究了一下，然后发现这些都跟操作剪贴板有关系，并且都不难，了解一下基本都知道怎么做了，整理分享一波给大家。 个人博客了解一下：obk...
2018-08-09 11:32:12
723
原创 Vue的钩子函数[路由导航守卫、keep-alive、生命周期钩子]
前言说到Vue的钩子函数，可能很多人只停留在一些很简单常用的钩子(created,mounted)，而且对于里面的区别，什么时候该用什么钩子，并没有仔细的去研究过，且Vue的生命周期在面试中也算是比较高频的考点，那么该如何回答这类问题，让人有眼前一亮的感觉呢… 个人博客了解一下：obkoro1.comVue-Router导航守卫：有的时候，我们需要通过路由来进...
2018-07-23 11:02:09
845
原创 JS高程中的垃圾回收机制与常见内存泄露的解决方法
前言起因是因为想了解闭包的内存泄露机制，然后想起《js高级程序设计》中有关于垃圾回收机制的解析，之前没有很懂，过一年回头再看就懂了，写篇博客与大家分享一下。如果喜欢的话可以点波赞/关注，支持一下。 个人博客了解一下：obkoro1.com内存的生命周期：分配你所需要的内存：由于字符串、对象等没有固定的大小，js程序在每次创建字符串、对象的时候，程序都会...
2018-07-09 10:08:07
576
1
原创 你不知道的js中关于this绑定机制的解析[看完还不懂算我输]
前言最近正在看《你不知道的JavaScript》，里面关于this绑定机制的部分讲的特别好，很清晰，这部分对我们js的使用也是相当关键的，并且这也是一个面试的高频考点，所以整理一篇文章分享一下这部分的内容，相信看本文的解析，你一定会有所收获的，如果喜欢的话可以点波赞/关注，支持一下。 个人博客了解一下：obkoro1.com为什么要用this：function...
2018-07-02 09:05:07
335
1
原创 160行代码仿Vue实现极简双向绑定[详细注释]
前言现在的前端面试不管你用的什么框架，总会问你这个框架的双向绑定机制，有的甚至要求你现场实现一个双向绑定出来，那对于没有好好研究过这方面知识的同学来说，当然是很难的，接下来本文用160行代码带你实现一个极简的双向绑定机制。如果喜欢的话可以点波赞/关注，支持一下，希望大家看完本文可以有所收获。本文是在面试题：你能写一个Vue的双向数据绑定吗？的基础上仔细研究+改动，并添加了详细注释，...
2018-06-25 09:08:47
650
原创 JS忍者秘籍中的定时器机制详解
前言前段时间刚看完《JS忍者秘籍》，虽说是15年出版的，有些东西是过时了，但像对原型链、闭包、正则、定时器之类的机制却是不会过时的，里面很多东西都讲的很细，还是值得一读的，本文将对这本书中对定时器机制的部分进行详细的解析，如果喜欢的话可以点波赞/关注，支持一下，希望大家看完本文可以有所收获。 个人博客了解一下：obkoro1.com准备阅读本文之前，推荐先阅读...
2018-06-22 09:40:25
423
原创 Js 的事件循环(Event Loop)机制以及实例讲解
前言大家都知道js是单线程的脚本语言，在同一时间，只能做同一件事，为了协调事件、用户交互、脚本、UI渲染和网络处理等行为，防止主线程阻塞，Event Loop方案应运而生… 个人博客了解一下：obkoro1.com为什么js是单线程？js作为主要运行在浏览器的脚本语言，js主要用途之一是操作DOM。在js高程中举过一个栗子，如果js同时有两个线程，同时对同...
2018-06-19 09:02:46
786
原创 浅析HTTP缓存的机制-浏览器缓存
前言在浏览器众多缓存中的HTTP缓存可能很多人对这个的概念并没有很清晰，每个人都知道进入一次网页之后再刷新一次页面，加载速度会比首次加载快非常多，每个人都知道这是浏览器缓存的magic，但是对此背后的原因可能不甚了解… 个人博客了解一下：obkoro1.com当我们在谈论HTTP缓存时我们在谈论什么:我们实际上是在谈论下面这两种情况:如上图，浏览器对静...
2018-06-11 09:18:22
879
原创 你或许不知道Vue的这些小技巧
前言用Vue开发一个网页并不难，但是也经常会遇到一些问题，其实大部分的问题都在文档中有所提及，再不然我们通过谷歌也能成功搜索到问题的答案，为了帮助小伙伴们提前踩坑，在遇到问题的时候，心里大概有个谱知道该如何去解决问题。这篇文章是将自己知道的一些小技巧，结合查阅资料整理成的一篇文章，如果喜欢的话可以点波赞/关注，支持一下，希望大家看完本文可以有所收获。 个人博客了解一下：obko...
2018-06-04 08:31:54
1081
原创 【干货】js 数组详细操作方法及解析合集
前言在开发中，数组的使用场景非常多，平日中也涉及到很多数组的api/相关操作，一直也没有对这块内容进行一块整理总结，很多时候就算用过几次这个api，在开发中也很容易忘记，还是要谷歌一下。所以就希望对这块内容有一个比较系统性的总结，在这背景下，就有了本篇文章，如果喜欢的话可以点波赞/关注，支持一下，希望大家看完本文可以有所收获。 个人博客了解一下：obkoro1.com...
2018-05-31 10:24:49
441
原创 你对CSS权重真的足够了解吗？
前言css权重很多人都听过，也了解一些，但是很多人对具体的规则或者说再深如一些关于css权重的问题，可能会不那么清楚。日常开发中，或多或少都会遇到css规则不生效的问题，为了让我们能够减少调试css规则的时间，深刻理解css权重，就十分关键了。如果喜欢的话可以点波赞/关注，支持一下，希望大家看完本文可以有所收获。 个人博客了解一下：obkoro1.com权重规则总结:...
2018-05-21 09:05:04
420
原创 koroFileHeader 非常实用的Vscode 插件[用于添加文件头部注释]
前言本来之前也安装过一个头部文件注释的插件：vscode-fileheader，由于插件的注释模板都是定死的，想要自己定制一些模板注释也不行，实在用的不舒服，然后自己去研究了一番，参考vscode-fileheader插件的一些内容，开发了这个插件。koroFileHeader在 VsCode 中通过快捷键ctrl+alt+i在文件头部添加注释。languageEngl...
2018-05-18 09:56:45
9794
9
原创 关于input的一些问题解决方法分享
前言input是我们接受来自用户的数据常用标签，在前端开发中，相信每个人都会用到这个标签，所以在开发过程中也时候也会遇到一些问题，本文的内容是我在跟input相爱相杀过程中产生的，在此记录分享一下。如果喜欢的话可以点波赞/关注，支持一下，希望大家看完本文可以有所收获。 个人博客了解一下：obkoro1.com本文内容包括：移动端底部input被弹出的键盘遮挡。控制...
2018-05-14 09:27:48
927
原创 如何判断用户浏览器以及一些前端常用的正则表单验证
前言在我们做用户授权登录(微信,qq授权)，以及根据对应浏览器做对应的操作的时候，经常会遇到需要判断用户使用的浏览器的需求，以及在需要用户输入信息的时候，有需要验证的一些正则。如果喜欢的话可以点波赞/关注，支持一下，希望大家看完本文可以有所收获。 个人博客了解一下：obkoro1.com判断用户浏览器navigator.userAgent判断用户所使用的浏览器...
2018-05-07 09:15:16
395
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人