今天和大家介绍一下一种特殊的设计模式——规约模式（Specification pattern）什么是规约模式（Specification pattern）假设你正在减肥，不能吃肉，也不能吃卡路里大于500的食物。把这种情况用编程来表示就会是下面这样void Eat(Food food){ if(food.HasMeat||food.Calorie>500) { ...

今天和大家讲一道很火的面试题——64匹马8赛道选前8的算法解析。题目有64匹马，一共有8个赛道，想要找出最快的8匹马，要比赛最少多少轮才可以?解析这道题初步一看会让人觉得摸不到头脑。我们试着先用图表示下。假设每一匹马是一个图的一个节点，用有向线段A->B表示马A比马B快最终我们可以找到一条从最快马到最慢马的单向路径。那么我们可以有这样的约束：如果有A->B，A-...

在看到编译器相关知识时，发现有一个T型图的概念，于是就记录一下什么是T型图T型图是用于描述编译器实现时的一种辅助工具。我们都知道描述一个语言编译，需要源代码，编译器，和目标代码，三个组成部分。这三者都有自己的生成语言描述，正好可以使用一个T型图标识。这里下面的t型图表示使用β语言书写的编译器，将α语言写的源代码编译成为γ语言。T型图作用有了T型图我们就可以来描述编译器构建。比...

Virtual Audio Cable(VAC)是一款windows平台下的高效的虚拟声卡软件。集音频设备虚拟，混流，采集，复用等功能与一体，倍儿好用VAC的官网地址是：Virtual Audio Cable - connect audio applications, route and mix sounds我们可以在官网找到下载地址，当前最新版本是4.60。如果不够买的话可以下载试用版...

今天和大家聊一聊taro2.x版本useEffect中改变observable对象导致的Effect执行2次问题问题现象话不多说，先看代码。代码很简单，Taro+mobx在函数组件内使用，并且在useEffect中更新test的状态。注意此时useEffect传入了空数组import Taro, { useEffect } from '@tarojs/taro';import { View } from '@tarojs/components';import { observer } from

今天和大家聊一聊微信小程序在ios中下拉出现“橡皮筋”效果问题现象话不多说，先看代码（使用taro编写）。代码很简单，一个flex的容器+一个允许进行下拉刷新的ScrollView，就组成了一个最简democonst TicketRecordsPage = () => { const revenueData = new Array(10).fill(0).map((_, i) => i) return ( <View className={styles['root

今天和大家聊一聊taro在微信小程序下函数组件多次执行问题关于taro和小程序首先taro是一个针对多端小程序的编译框架。对于微信小程序来说，taro的源码最终会编译成微信小程序可执行的代码。因此对于使用taro进行开发来说，既会受到小程序的约束，又能利用小程序的优势小程序初始数据对于小程序来说，可以通过data进行数据绑定，为页面模板提供初始数据。这种方式能够更有效的提升初始渲染的效率。但是对于react来说，组件的初始状态来自于组件的构造函数中的初始state或者函数组件的usest

今天和大家聊一聊redux的中间件原理。注：本文内容大部分参考redux的官网文档Middleware - Redux。如果英文好的同学可以直接阅读官网文档，写的非常好。关于redux-middlewareredux中间件提供了一个切面的关注点。我们可以很方便的利用中间件进行AOP编程，比如日志功能，埋点上报等。这里主要是利用装饰器模式，在实际任务执行之前，动态添加before和after的逻辑。这样就能形成一个洋葱模型接下来我们就看下如何手动开写一个日志中间件手动处理日志首先我们手动

今天和大家聊一聊如何实现一个远程桌面程序。关于远程桌面对于远程桌面程序，相信大家一定有所了解。常见的产品有TeamViewer，向日葵，微软远程桌面，QQ远程桌面等等。远程桌面能够在定位用户问题，协助操作，远程办公上有非常便捷作用。这里我们就来自己实现一个远程桌面程序。需求分析对于一个远程桌面程序，我们要解决的问题主要有三点：获取桌面流——没有桌面流，怎么做远程桌面传输数据——包括桌面流以及键盘鼠标等信息传输控制信息——建立连接，断开连接等这里需要注意的点是第二点传输数据。远

今天和大家聊一聊如何在JavaScript中调用C++动态链接库什么是ffiffi 是Foreign Function Interface的简称，是一款nodejs的addon。可以让大家在nodejs中调用c风格的c++动态链接库ffi调用起来非常简单，可以看下官网的这个例子var ffi = require('ffi-napi');var libm = ffi.Library('libm', { 'ceil': [ 'double', [ 'double' ] ]});libm.

今天和大家聊一聊taro使用React.Fragment出现的问题。什么是React.Fragment在react组件中，只能返回单一的元素，不能返回一个元素列表。//报错render() { return ( <ChildA /> <ChildB /> <ChildC /> );}//正常render() { return ( <div> <ChildA />

今天和大家聊一聊NAT穿越什么是NATNAT(Network Address Translation)，即网络地址转换，是一种ip数据包的重写技术。为什么要要有NAT呢？这是因为现实中公网的ip地址过少，很多单位，学校都不能满足每个主机分配一个公网地址。因此会通过NAT技术将内网的主机地址映射为同一个公网地址的不同端口，进行外网访问。NAT的缺点NAT解决了内网环境下多主机上网的问题，但是也造成了难以从外网访问内网主机的问题。尤其是在一些p2p应用的场景下(比如现在越来越火的webrtc

今天和大家聊一聊node在windows下的版本管理工具NVM-windows为什么需要node版本管理主要原因有两个：开发时保证项目以及依赖库（尤其是原生的addon）API兼容。调试特定node版本下的软件问题。推荐的node版本管理工具如果是在mac/linux下，可以使用nvm-sh/nvm如果是在windows下，可以使用我们今天要讲的coreybutler/nvm-windows使用方法卸载你电脑上的node以及npm在Releases · coreybut

之前restful理解_数据库_黄腾霄的博客-CSDN博客和大家介绍了对RESTful的理解。然后就有小伙伴问了我灵魂问题，对于RESTfulAPI设计，是不是不能使用query string？关于这个问题，网上观点两派纷争不断，为此我特意去拜读了Roy Thomas Fielding的博士论文，以及结合自己的理解来和大家谈谈RESTfulAPI能否使用query string。问题来源对于RESTfulAPI，大家都有一个基本的认识，网上一切皆资源，用URI来定位唯一的资源。而对于领域模型的实体

今天和大家聊一聊协同编辑的架构设计。什么是协同编辑协同编辑是指多人同时对同一份文档进行编辑。例如我们熟悉的wiki，百度百科，以及办公产品腾讯文档，乃至我们的代码管理工具git，都可以算作是协同编辑产品。实时协同编辑随着大家在家办公，异地办公的情况普及，实时协同编辑工具也变得更加引人注目。实施协同编辑会面临几个问题：实时性——输入的数据可以及时被相关协作者看到一致性——各端看到和编辑的文档需要保持一致容错性——允许存在一定的网络波动，和数据丢失但是这三个问题会形成一个不可能三角即

今天和大家聊一聊node中的stream的背压机制。为什么要有流在编写服务时，经常会需要涉及到文件或者数据压缩的问题。使用合适的压缩算法能够有效减少请求文件的大小，从而减少网络中的数据传输量，提升响应速度。假设我们采用最普通的方式处理一个文件的获取，压缩，发送这个过程，就会是如下所示的图形表示：我们看到整个执行流程是串行的，所有耗时都会累加，导致整个过程耗时很长。流的出现就是为了解决这个串行处理的问题。如下图所示，我们将整个文件分成一个个小块，利用生产者消费者模式，上一个阶段的操作有一小部

今天在写electron的项目时，需要使用到robotjs。而robotjs是c++编写的库，所以需要在不同的平台进行重新编译。期间遇到了许多问题，mark一下。问题来源所有代码最终是要转换为操作系统相关代码，才能在指定的OS上运行。像java，python这类代码是需要对应平台的vm环境，转成平台相关代码才能够执行。而c++并没有这样的vm环境，因此对于node的c++模块，需要先编译成平台相关的代码，才能执行。方案这里我采用的方式是node-gyp进行编译整体方案如下所示，利用nod

今天和大家聊一聊create-react-app设置默认启动浏览器的方式。问题来源对于create-react-app默认会在npm start执行之后在默认浏览器打开页面。但是，有的时候，我们期望能够设置特定的浏览器启动。或者是在开发诸如electron之类的应用时，不期望启动浏览器。解决方案在npm脚本中，我们可以使用create-react-app提供的配置参数BROWSER指定启动的浏览器。比如如果你期望指定浏览器为chrome，就可以写"start": "BROWSER=chro

今天和大家聊一聊webpack中不同hash值的作用。问题来源对于浏览器来说，一方面期望每次请求页面资源时，获得的都是最新的资源；一方面期望在资源没有发生变化时，能够复用缓存对象。这个时候，使用文件名+文件哈希值的方式，就可以实现只要通过文件名，就可以区分资源是否有更新。而webpack就内置了hash计算方法，对生成文件的可以在输出文件中添加hash字段。区分hash，contenthash，chunkhashwebpack内置的hash有三种：hash：每次构建会生成一个hash。和整