Reeves'Blog

Git 是Linux之父 Linus Torvalds 为了帮助管理 Linux 内核开发而开发的一个开放源码的版本控制软件。 GitHub 作为全球最知名的代码管理平台 使用 git 分布式版本控制系统，为代码的托管提供了非常便捷的服务 在使用Git之前，需要了解Git系统的相关机制 3个容器 工作区 ： 当前项目目录 文件分为两种状态： 已跟踪 、 未跟踪 已跟踪的文件为以及被纳入Git版本库中的文件，具有快照记录， 已跟踪的文件在一段时候后有 3种 状态： 已提交 、 已修改 、 已暂存 暂存区： 当生成Git对象后，从Git版本库中放入Git对象所对应的文件的占存容器 Git版本库： Git对象的直接存储容器 3个对象 Git对象(blob) 将目标文件一git对象的方式存储于Git版本库的objects中，使用hash算法生成一个唯一的SHA-1值来标识当前文件的Git对象. 树对象(tree) 将多个Git对象（一个项目版本的多个文件）对应的SHA-1索引生成一个树对象，记录文件的层次结构 提交对象(commit) 将一个树对象以及上 ...

简单总结前端热门面试题要点 概述HTML5 技术栈 语义化标签类 音视频处理 Canvas 、 webGL history API requestAnimationFrame 地理位置 webSocket(直播) CSS3 常规 动画 盒子模型 响应式布局 JavaScript ES 6-11 DOM BOM 设计模式 底层原理 堆栈内存 闭包作用域 AO/VO/GO/EC/ECSTACK 面向对象 this 事件循环 浏览器渲染原理 回流重绘 网络通信 AJAX / Fetch / axios HTTP协议 1.0 、 2.0 TCP 跨域处理方案 性能优化 Hybrid 或者 APP 和 小程序 Hybrid uni-app (Vue) React Native Weex PWA 前端工程化 webpack git linux nginx React 基础知识 核心原理 react-router-dom redux react-redux dva umi antd SSR 优化 ….. 全栈 NodeJs H5 /CSS面试题什么是标签语 ...

JavaScript 并行异步队列的实现背景队列，这玩意几乎计算机相关的大学生都学过，用简单的描述来说，就是一个排队处理调度机制，先来先出去嘛，队列的算法操作与数据结构也相对比较简单，一个装东西的容器，一个从头出队列的操作，一个从尾部进的操作。当然可能还有其他的操作。 最近团队的前端项目中有一个很常见的需求：上传文件。平常我们遇到最多的场景就是网盘，但是文件上传就只有把文件推上去那么简单吗？不，文件大小是个问题。 小文件在上传中几乎是秒级的速度，但大文件不一样，需要切片。 文件切片可以说是很常规的文件操作了，其实就是把文件的二进制数据按照大小一节一节的砍下来，传输完成后再按照相应的位置拼上去，这里我们不讨论如何保证传输中不出错，我们讨论如何优雅的传输这大量的文件“碎片” 为什么需要队列可以想象一下这样的一个问题，我们的文件大小有 100MB，我需要将它切为20份，每一份5MB，那么我们该如何传输这 20 份文件切片呢？将他们都创建一个上传任务吗？这样做可以，你可以同时发送20个请求来发送字节流。 要是文件再大一点呢？1GB 或者更大，那文件的切片的规模就会非常大，同时传输你的浏览器已经 ...

HTTP请求与XMLHttpRequestAPI分类 REST API，restful 使用到请求方式的语义决定服务器进行CRUD的其中一种，例如GET为查询，POST为修改，PUT为增加，DELETE为删除 同一个路径可以进行多个操作 非REST API ，restless 请求方式不觉得服务器的操作 一个路径只对应一个操作 一般只有GET/POST XMLHttpRequest对象 status http状态码 statusText 状态码对应的文本 readyState 标识当前xhr发送请求的状态的只读属性，不是http状态码 onreadystatechange 当xhr的请求状态发送改变的时候 0 初始化 1 即将发送请求 2 已经发送了秦秋 3 请求中 4 请求完成，收到响应 responseType 设置主动解析的数据类型 response 通过数据类型解析好的数据对象 timeout 设置超时时间 ontimeout 绑定超时监听回调函数 error open() 初始化一个请求，填写参数以及请求方式 send() 发送请求 abor ...

协变和逆变是什么？我们先来看看维基百科的解释： 协变与逆变（Covariance and contravariance）是在计算机科学中，描述具有父/子型别关系的多个型别通过型别构造器、构造出的多个复杂型别之间是否有父/子型别关系的用语。 简单的说，协变和逆变是一种关系 如何解释协变与逆变背景我们先假设有以下这几种类型以及关系： Animal >= Dog >= Greyhound（灰狗） 以上的类型规定，很显然 灰狗属于狗，狗属于动物，那我们有以下的几种函数的类型 (Animal) → Animal (Dog) → Dog (Greyhound) → Greyhound 假设现在有一个函数g，他的参数为(Dog) → Dog，即： 123function g(animal: Animal, dogCallback: (Dog)=> Dog): string{ // some code to call dogCallback(dog) , dog is Dog type} 我们要调用函数g，在第二个参数dogCallback的位置传入 ...

使用CSS3的景深与三维变换+JavaScript实现一个可旋转的立方体（x,y两轴旋转） HTML部分： 首先先构建立方体的DOM结构： 将6个面使用cube包裹，目的很简单，为了给子元素开启3d景深， 使用wrap再次包裹，wrap的目的是为了包装整个立方体，可控制缩放 12345678910<div class="wrap"> <div class="cube"> <div class="cube-face"></div> <div class="cube-face"></div> <div class="cube-face"></div> <div class="cube-face"></div> <div class="cube-face&quo ...

概念闭包函数： 引用了另一个函数内变量的函数，造成另一个函数的上下文能继续保持在栈中， 高阶函数：参数包含函数，返回值为函数的函数，可以理解为函数工厂函数 函数柯里化：将一个接受n个参数的函数，转换为每次调用只接受不超过n个参数的函数，且最多需要n次调用完 carriedFunc = carry(func) netxArgsFunc = carriedFunc(..partArgs) funcResult = carriedFunc(…fullArgs) 使用场景 参数复用，柯里化后的函数相当于预传参数的函数，这样避免和频繁输入参数 代码简洁，在不使用对象最为传参数的情况下，避免一次性传入过多的参数导致代码可读性变差 延迟计算，如果涉及到多个参数的实时输入计算，防止频繁计算出现非预期结果，柯里化可以在没有完全传入参数的情况下节省计算资源 动态创建特定函数，可以通过不同的参数进行动态返回函数 实现原理要实现分分步传入参数，返回下一步的函数，使得最终步调用函数，需要使用Function.prototype.bind() 方法的特性：使用预备参数生成新函数。bind函数第一个参数是 ...

Docker容器的基本使用Docker的基本架构关键字： Dockerfiles：Docker本身的配置文件，配置如何构建容器以及镜像，和端口 Image：虚拟系统的镜像 DockerContainer(容器)：镜像运行的虚拟环境，类似虚拟机 镜像仓库：虚拟系统的基本镜像，或者已保存的镜像 Docker的基本指令 查看当前运行的/所有的镜像 docker ps docker ps -a 从仓库拉取原始镜像，以Nginx为例 docker pull nginx 查看所有镜像： docker images 在使用一个镜像，在后台创建并运行一个容器，并添加镜像别名以及进行端口映射： docker run –name testNginx -p 80:80 -d nginx 在后台创建并运行一个容器，并将宿主主机指定目录映射到容器的指定目录 将宿主主机下的/home/index 文件夹映射到 容器的/usr/share/nginx/html文件夹中 当前文件夹使用pwd docker run –name mappedNginx -p 8080:80 - ...

本文将总结一ECMAScript 6-8 的常用特性，并使用一些案例来展示特性的使用场景，学以致用 let在ES6之前使用var关键字来声明变量，会出现重复声明导致变量被覆盖却不会报错的问题，且使用var声明的变量会被提升到最前进行解析，使用function声明的函数次之 123456789101112var camper = 'James';var camper = 'David';console.log(camper);// 打印出 'David'function a () { console.log('function a')}var a = 10var a = 20console.log(a) // 输出 20 与var不同的是，当使用ES6新增的let来声明变量时，没有变量提升，且同一名字的变量只能被声明一次， 123456789let camper = 'James';let camper = 'David';//输出错误 Unca ...

ECMAscript 6 原生提供了 Promise 对象。Promise 对象代表了未来将要发生的事件，用来传递异步操作的消息。 了解JavaScript事件循环在解析promise的机制之前，我们需要掌握浏览器的事件循环，此处引用一张事件循环流程图 在上图中的最后2两行队列均为异步队列，可以观察到，每个宏任务队列后都跟随一个微任务队列， 注意，需要把第一个同步任务，也就是首次同步执行的代码视为一个宏任务 在执行栈中的函数遇到异步任务时，会将异步任务交给 右侧相应模块进行处理 第一个队列为宏任务队列，也是主要的异步任务队列，其中的任务由计数器处理模块，ajax请求线程与文件处理模块(NodeJs)进行推入， 第二个队列为微任务队列，在promise对象的then()方法，与Node中的process.nextTick()都会在执行时，将传入的回调函数推入当前宏任务后的微任务队列， 当宏任务与微任务相互嵌套时，此时就可能会产生一些异步任务队列与执行栈会相互添加内容，即在栈中异步队列的函数 与 栈中函数产生异步任务，因此形成循环，而JS的异步任务常常通过事件进行执行，也就是为什 ...