- 博客(79)
- 问答 (1)
- 收藏
- 关注
RSS订阅原创 使用Lerna + Yarn Workspace管理Monorepo项目
通常，我们会根据自身业务的实际情况，将通用的组件、逻辑等提取成NPM包，方便以后复用。但这些提取出来的NPM包可能互相之间存在依赖，如果仍然采用 Multirepo 的形式进行管理，则在包的版本管理、依赖管理、调试等诸多方面存在不便。Monorepo 能很好的解决上述问题，为更加方便的使用 Monorepo 来管理我们的项目，我们需要一些趁手的工具，Lerna + Yarn Workspace 的组合就是这样一件优秀的工具。
2024-03-08 22:58:52
1164
原创 关于 Rust程序设计语言-构建多线程 Web服务器 一章的一些问题
最近在跟着一书学习Rust，在学习最后一章的最后两节时，我遇到了一些问题，并尝试进行解释，接下来分享给大家。
2024-02-03 23:41:57
1417
原创 Node.js中Buffer的一些实现原理
在ES6之前，JavaScript无法直接处理二进制数据，Node.js为了弥补这个不足引入了 Buffer，其是Node.js的核心模块之一，底层实现基于C++。本文将从 Node.js v14.20.0 的源码分析 Buffer 的一些实现原理。
2023-05-24 22:24:09
1390
原创 狄克斯特拉(Dijkstra)算法详解
最近在看《算法图解》，其中第七章狄克斯特拉算法个人感觉并没有讲的清楚，比如看完7.1节给人的感觉是狄克斯特拉算法会遍历图中的每一条边，后续狄克斯特拉不适用负权边的说法就站不住脚了。后续在查阅诸多资料之后，总结文章一篇，尽可能以通俗易懂且思路清晰的方式来讲解狄克斯特拉算法。...
2022-06-26 18:26:36
37494
19
原创 Java中的重载 / 重写 / 继承 / 多态
最近在用Java编程，一开始我觉得自己对重载(Overload)、重写(Override)还是分得清的，对于继承和多态还是有所了解的。但实践中突然发现了几个问题：静态成员是否可以继承、静态成员是否可以呈现出多态的性质、重载是不是多态。这些问题还是挺值得细想的，所以总结博客一篇。
2022-02-07 10:56:10
1847
原创 Emscripten之JS与C/C++互相调用
1.前言上一篇博客介绍了Emscripten中的胶水代码，通常我们会在js中调用定义在C/C++中的函数，此时就涉及到js如何向C/C++传递参数。本文主要介绍Emscripten中JS与C/C++互相调用的方式和简单原理，在阅读之前，读者最好对WebAssembly有所了解，并且有一定的使用Emscripten的经验。2.内存模型2.1.Module.asm.memory通过Emscripten处理后，C/C++代码直接通过地址访问的数据全部在内存中，该内存空间实际是Emscripten提供的Ar
2021-12-18 18:21:05
4439
原创 Emscripten胶水代码初探
1.前言如果我们想把C/C++代码编译为WebAssembly，那十有八九就会用到Emscripten。在运行Emscripten相关编译指令后，我们可以得到wasm文件和js文件。如果在编译时添加对应的参数，我们还可以使用模板HTML或者将wasm文件放到web worker中执行。其中Emscripten编译生成的js文件即是所谓的胶水代码，我们只需要在自己的项目中引入这段胶水代码，胶水代码就会帮我们加载wasm模块，并且将定义在C/C++中的函数绑定在全局变量上供我们调用。本文主要简单的探索Em
2021-11-28 22:17:23
2775
原创 Vue3.0 Composition API响应式原理的简单模型
1.前言之前总结了一篇博客——《Vue响应式的简单模型》，里面介绍了观察者模式和发布订阅模式，并通过自己实现一个轻量级Vue框架的方式介绍了Vue2.0和3.0响应式的简单原理。但在自己实现的轻量级Vue框架中，仍然采用“传统”的Options API的方式。我们知道Vue3.0的一个亮点就是引入了Composition API，这篇博客就简单介绍一下Composition API响应式的原理。和之前《介绍Vue响应式的简单模型》一样，我们先介绍Composition API的核心原理，然后再通过自己
2021-05-23 18:45:34
460
1
原创 Vue响应式原理的简单模型
1.前言最近在梳理vue响应式的原理，有一些心得，值得写一篇博客出来看看。其实之前也尝试过了解vue响应式的原理，毕竟现在面试看你用的是vue的话，基本上都会问你几句vue响应式的原理。以往学习这块就是看看别人写的文章，或者翻翻源码。这个过程中发现相当一部分文章看完之后一句话总结就是—— vue通过 Object.defineProperty 或者 Proxy API 拦截了数据的getter/setter，再在getter/setter里面做数据响应的相关逻辑。除此之外就一无所知了。与此同时又发现直接
2021-05-02 22:28:48
1637
6
原创 axios拦截器/koa中间件/express中间件/redux中间件的原理
1.前言最近在看redux相关的东西，发现redux也有中间件一说。之前接触的express、koa也有中间件的概念，而axios中也有拦截器这种相似的机制，那就正好梳理下这些概念的原理。阅读本篇文章之前，读者应该对axios、koa、express、redux有所了解。2.axios拦截器2.1 注册const axios = require('axios')axios.interceptors.request.use((config) => { console.log('请求拦截
2021-03-29 00:22:42
840
原创 入门-使用Gradle编译运行Kotlin代码
1.前言如果我们想学习Kotlin，那势必需要一个平台或者一种方法能够编译运行Kotlin代码。Kotlin官方教程提供了多种方式编译运行Kotlin代码，但个人认为这些方法依赖于IDE或者编辑器，直接使用命令行编译器也比较麻烦。官方教程最后提到可以使用构建工具构建Kotlin项目，鉴于学习Kotlin很大程度上是为了学习安卓开发，而在安卓开发中Gradle是非常重要的工具，所以这篇文章将介绍如何使用Gradle编译运行Kotlin代码，以作为学习Kotlin的入门准备。2.准备首先，你必须对Grad
2020-05-15 18:09:15
4109
原创 WebRTC中的协议
1 前言掐指一算，貌似快两年没写博客了。最近在看有关音频视频直播相关的东西，其中就包括WebRTC。WebRTC并不是一个协议，而是一项实时通讯技术，其中使用了许多的协议，这篇文章就来总结一下WebRTC中的各种协议。这篇文章需要读者对WebRTC有一定的了解。2 传输层协议开门见山的说，WebRTC使用UDP作为传输层协议。使用TCP作为传输层协议的话，如果中间出现丢包的情况，由于TCP需...
2020-02-02 21:09:56
1910
原创 几种手动实现HMR的方式
1.前言众所周知，在webpack中使用模块热替换(HMR)，能够使得应用在运行时，无需开发者重新npm run dev、刷新页面，便能更新更改的模块，并且将效果及时展示出来，这无疑极大的改善了前端同学们的生活。 当然，目前有许多脚手架——比如vue-cli、create-react-app等，通过这些脚手架，我们可以很轻松的搭建项目，而且这些脚手架自动为我们配置好了热更新功能，从此，我们再...
2018-06-09 14:29:35
12454
1
原创 使用Nuxt.js改造已有项目
前言如果我们需要对现有的vue项目进行ssr改造，使用nuxt.js是一个不错的选择。这里用作例子的“现有项目”是一个高仿饿了么外卖APP的spa。不过我没有把全部功能开发出来（全部做出来就不得了了），只是做出几个基本界面意思意思 下面就以这个demo为小白鼠进行ssr改造准备现有目录 很明显，这是使用vue-cli搭建的项目 其中prod.server.js是build...
2018-05-28 18:31:05
13873
4
原创 styled-components设置组件属性
问题最近在试着用react做一个音乐播放器，在这之前其实并不了解styled-components，但由于使用css in js并且想实现hover效果，百度各种解决方案后发现了styled-components这个好东西，如果你看到了这篇博客，就证明你应该了解或者熟练运用styled-components了。 回到项目开发中，一个音乐播放器应该由多个组件组成，其中有一个list组件用于展示...
2018-05-18 16:17:14
6520
原创 在create-react-app中使用css modules
前言如果我们从零开始用webpack + es6来结合react开发前端应用，那势必会在各种webpack配置中消耗大量精力，于是便有了各种脚手架，create-react-app就是其中之一。 对于css modules，在react中，通常用它来避免预料之外样式规则相互覆盖以及实现其他功能。配置弹出配置文件如果直接使用create-react-app搭建一个项目，所有的配...
2018-05-14 17:22:01
8255
1
原创 vuex中mutation/action的传参方式
前言在vuex中提交 mutation 是更改状态的唯一方法，并且这个过程是同步的，异步逻辑都应该封装到 action 里面。对于mutation/action，有一个常见的操作就是传参，也就是官网上说的“提交载荷”。 这里是关于如何在vue-cli中使用vuex的方法，我们采用将vuex设置分割成不同模块的方法。其中，state模块中配置如下//vuex中的stateconst st...
2018-05-11 18:18:40
35452
4
原创 如何在vue-cli中使用vuex
前言众所周知，vuex 是一个专为 vue.js 应用程序开发的状态管理模式，在构建一个中大型单页应用中使用vuex可以帮助我们更好地在组件外部管理状态。而vue-cli是vue的官方脚手架，它能帮助我们方便的配置webpack。这样看来，有很大的可能我们需要同时使用vue-cli与vuex如何在vue-cli中使用vuex项目搭建及添加vuex 当我们使用vue-cli搭建一个vu...
2018-05-11 17:07:12
6780
1
原创 为什么要使用computed而不是data获取vuex中的state
最近在学习vuex时，照着官网最基本的 Vuex 记数应用示例敲的时候遇到了这样一个问题 想实现的效果： 点击加号、减号实现数字增减 vuex设置：Vue.use(Vuex);Vue.prototype.$store = new Vuex.Store({ state: { count: 0 }, mutations: { in...
2018-05-08 18:45:03
11235
2
原创 解决koa2 ctx.render is not a function
最近在学习使用koa2，在尝试用koa2复写之前用express写的一个入口文件的时候发现命令行报错ctx.render is not a function 项目路径如下 app.js是之前用express写的入口文件 koa.js是用koa2复写的入口文件 view是前端页面文件夹，使用的模板引擎是pug 报错时koa.js代码如下//使用koa复写入口文件const K...
2018-04-18 11:25:16
9704
原创 express解决413 request entity too large问题
最近在尝试自己实现一个图片上传组件，后台用express（4.16.2）做服务器，然后就尴尬的发现只要上传的数据超过1mb，后台就会报request entity too large并且前台返回413 经过一段时间的百度，发现有多种解决方案，其中，这个帖子包括了我看到的所有解决方法。 首先，讲一下我最后尝试成功的解决方法app.post("/api/save",bodyParser.j...
2018-04-03 23:10:27
5640
2
原创 如何取消ajax请求
之前在面试的时候，被面试官问到了如何取消ajax请求，然鹅并不知道，被刷之后痛定思痛，总结了原生XHR、jquery、axios取消ajax请求的方法。原生XHR对于原生XHR对象来说，取消的ajax的关键是调用XHR对象的.abort()方法var native = new XMLHttpRequest();native.open("GET","https://api.gith...
2018-04-03 14:13:36
24206
4
原创 mongodb如何更新数组中嵌套的对象
前言众所周知，mongodb以类似json的数据格式——bson储存数据，它允许数据之间相互嵌套，所以说，查找、修改嵌套比较深的字段就成了一个问题。假设有那么一个collection{ "_id" : ObjectId("5a3672b2c0e07c5f2ab47f06"), "type" : [ { "name" : "JavaS...
2018-04-02 14:26:57
13210
3
原创 linux如何安装nginx以及配置多域名对多端口
假如你有一台服务器（实例版本为centos7）、多个域名，你想在这台服务器上部署了多个项目，并且一个项目对应一个域名，但又不想在访问项目的时候加上端口号，这时，你或许应该尝试使用nginx。安装nginx安装依赖这一步中的某些依赖，可能你的电脑上已经安装了，但你不知道或者忘记了，在每一步安装操作下方注释有如何检测依赖是否安装yum install gcc-c++//gcc -v...
2018-02-28 23:04:13
2787
原创 js延迟加载的几种方法
众所周知，在一个HTML页面加载的时候，如果遇到script标签，一般情况下会停止页面渲染，转而加载并执行脚本，等到脚本执行结束后才继续渲染页面。 但世界上存在可以使js延迟加载的方法，这些方法有助于提高页面加载速度1.defer属性作用脚本会立即下载，但要在页面已加载之后才运行脚本使用<script type="text/javascript" src="demo_d...
2018-02-21 12:09:43
4525
原创 js实现继承的4种基本方式
在ES6之前，js创建对象都需要通过函数，如何实现继承成为一个问题。目前有很多人已经给出了自己的解决方案，但由于没有统一的定义，导致相同方式有多个名称、一种方式有多种变体。本文总结了4种最基本的方式，没有遗漏的话，其他方式应该就是下面四种方式的变体或者重命名。欢迎各位读者在评论区补充没有提及的基本方式。 需要强调的是，在js实现继承的过程中，父类或者子类的属性和方法是直接定义在原型上还是定义在实...
2018-02-13 21:07:17
528
原创 js创建对象的6种基本方式
如何在js中创建对象，一直是一个值得关注的问题。有很多人在博客上进行了总结，但由于没有权威的定义，导致某些方式有多种不同的命名以及不同的变体。下文将介绍我总结的5种方式，如果没有遗漏的话，其他一些本文没有提及的创建方式应该都是下面5种方式的别名或者变体。欢迎各位读者在评论区补充我没有总结到的基本方式1.直接字面量let person={ key:value, ......
2018-02-13 20:53:42
509
原创 CommonJs / ES Module的用法和区别
由于JavaScript缺乏模块体系，在ES6之前，社区指定了一些模块加载方案，比如node.js所遵循的commonJS规范。而在ES6在语言层面上实现了模块功能，完全可以取代现有的commonJS等规范，成为浏览器、服务器通用的模块解决方案。本篇博客目录如下： 1.如何使用exports 2.如何使用module.exports 3.exports与module.exports的区别 4
2017-12-25 11:12:07
7237
原创 axios用post提交的数据格式
vue框架推荐使用axios来发送ajax请求，之前我还写过一篇博客来讲解如何在vue组件中使用axios。但之前做着玩用的都是get请求，现在我自己搭博客时使用了post方法，结果发现后台（node.js）完全拿不到前台传来的参数。后来进过一番探索，终于发现问题所在。post提交数据的四种编码方式1.application/x-www-form-urlencoded 这应该是最常见...
2017-12-12 16:41:22
173130
6
翻译 Service Workers/Web Workers/WebSockets的区别
原文戳这里前言之前在看面经的时候看到了“Service Workers”这个名词，赶紧百度了一下，发现许多博客对它的描述是“一个Service Worker是一段运行在浏览器后台进程里的脚本，他独立于当前页面，提供了那些不需要与web页面交互的功能在网页背后悄悄执行的能力。”我眉头一皱，发现这句话好熟悉，好像在w3school上看到过，随后一找，发现了“Web Workers”，w3school的描
2017-11-22 20:22:48
3898
1
原创 BFC浅析
当我第一次接触到BFC时，我的三观基本上都被颠覆了。在平时编程中我们会经常遇到BFC，只不过那些与BFC相关的现象——比如外边距折叠我们往往都忽略掉。1.什么是BFCBFC是Block Formatting Context的缩写，翻译成中文就是“块级格式化上下文”。 简单来说，BFC是一个具有特殊CSS样式的HTML盒子，下面的样式只要满足一项，就说明这个盒子是BFC：flo...
2017-11-19 20:53:56
370
原创 JavaScript的this机制与箭头函数（二）——箭头函数中的this
这是《JavaScript的this机制与箭头函数》系列的第二篇文章，这里是系列的第一篇文章，主要讲解this的四种绑定机制，下面的内容会涉及到第一篇博文所讲解的部分知识点。 一开始接触箭头函数的时候就被其this的指向搞懵逼了，最后看了好多大牛的博客才搞清楚。 首先我们需要明白的是箭头函数根本没有自己的this，导致内部的this就是外层代码块的this，这句话会解释箭头函数的很多行为——比如
2017-11-10 15:01:38
450
原创 JavaScript的this机制与箭头函数（一）——this绑定的4种机制
传闻JavaScript有两座大山——this与作用域，在函数中，这两个难点会交织在一起。本来this就一脸懵逼，又有同样懵逼的作用域，所以说很多人就会 es6中，又出现了一个箭头函数，箭头函数的this又比普通函数的this“骨骼惊奇”得多。欲搞清楚箭头函数的this指向，必须要搞清楚this的四种绑定机制。 参考链接：深入理解this机制系列第一章默认绑定全局环境中，thi...
2017-11-10 14:32:19
645
1
原创 在vue+webpack中使用sass
在使用vue-cli等脚手架初始化项目之后，css-loader和vue-style-loader就默认装好了，如果我们要在vue组件中使用sass应该这么做呢？ 首先需要安装node-sass和sass-loadernpm install node-sass --save-dev --no-optionalnpm install sass-loader --save-dev --no-opti
2017-10-31 15:09:30
1983
原创 npm run dev退出后依旧占用端口
在使用webpack时（windows环境），如果在git bash here中启动npm run dev，想要停止服务，ctrl+c是不起作用的，这个时候只能通过任务管理器停止进程。如果用windows自带的cmd则可以通过ctrl+c停止服务
2017-10-29 17:09:50
10926
原创 sublime text3左侧导航栏以及皮肤的相关设置
sublime的界面给人一种简洁的快感，但默认的皮肤看起来略微有那么一点点low，如果想更换一个帅一点的皮肤，可以使用插件Boxy Theme。 先介绍一个与Boxy Theme无关的点——如何让编辑器左侧导航栏显示中文。默认情况下，sublime左侧导航栏的中文文件名显示出来是方框，这个时候需要修改一下配置工具栏点击preference选择Settings这时会出现 将右侧文件中的dpi
2017-10-28 21:44:59
8649
原创 Webpack Loaders
这篇博客主要介绍webpack中loader的使用，博客最后依然会有webpack.config.js实例，我的项目目录是这样子的 1.loaders的作用 通过使用不同的loader，webpack有能力调用外部的脚本或工具，实现对不同格式的文件的处理，比如说分析转换scss为css，或者把下一代的JS文件（ES6，ES7)转换为现代浏览器兼容的JS文件2.基本参数Loaders需要单独安装并
2017-10-21 17:06:33
905
原创 webpack入门
最近开始学习webpack的正确打开姿势，先总结一下webpack一些比较重要的入门配置，在博客的最后会有完整的webpack.config.js的栗子。1.什么是webpack WebPack可以看做是模块打包机：它做的事情是，分析你的项目结构，找到JavaScript模块以及其它的一些浏览器不能直接运行的拓展语言（Scss，TypeScript等），并将其转换和打包为合适的格式供浏览器使
2017-10-18 13:46:13
369
空空如也
超过16位且最后一位是1的整数会出现一个奇葩的问题
2017-09-25
TA创建的收藏夹 TA关注的收藏夹
TA关注的人