Ryder
Ryder
## new 做了什么 new 运算符创建一个用户定义的对象类型的实例或具有构造函数的内置对象的实例。new 关键字会进行如下操作： 1. 创建一个空对象 2. 设置该空对象的原型为构造函数的原型（{}.__protp__ = constructor.prototype） 3. 执行构造函数，将 this 指向新创建的空对象 4. 如果构造函数没有返回值或返回的不是一个对象，则返回步骤 1 新创建的对象 ## 实现一个 new 根据以上步骤，用原生 js 实现一个 new ```js function _new(fn,...
## JavaScript 单线程语言 众所周知 JavaScript 是单线程语言，也就是说，同一时间只能做一件事。JavaScrpt之所以设计成单线程语言，是与它的用途有关， JavaScript 被设计之初的主要用途是操作 DOM， 假设如果有两个线程，一个线程在某个节点上添加元素，另外一个线程删除了这个节点，这时，浏览器该以哪个线程为准呢。所以为了避免这一问题， JavaScript 诞生之初就是单线程。 这样就可能导致的问题是，所有的任务都需要排队，只有前一个任务结束，才会执行后一个任务，如果前一个任务耗时太长，后一个任务就只能等着，如 IO 操作（AJAX请求等），在数据返回之前，CPU 一直是空闲状态，就大大浪费了时间和资源。所以 JavaScript 通过时间循环来解决这个问题。 ## Event Loop JavaScript 中所有任务分为两种，一种是同步任务，另一种是异步任务。同步任务是指，在主线程上排队的任务，只有前一个任务执行完毕，才会执行后一个任务。异步任务是指，不进入主线程，而是进入“任务队列”，只有“任务队列”通知主线程，某个异步任务可以执行了。该任务的回调函数才会进入主线程执行。异步任务又分为**宏任务**和**微任务** 具体来说，异步执行的运行机制如下。 1. JavaScript 中有一个主执行栈，所有同步任务都在主执行栈上执行。 2. 主执行栈之外，还存在一个“任务队列”，只有异步任务有了运行结果，就把回调函数放到”任务队列“之中。 3....
## ES6 继承 **ES6 通过 class 关键字实现类，类与类之间通过 extends 关键字实现继承。** ```js class Super { constructor(x,y) { this.x = x this.y = y } print() { console.log(this.x, this.y) } } class Sub...
## Set ### 定义 **Set在其他语言中又叫做集合，是由一堆无序的、相关联的，且不重复的内存结构组成的组合。** 根据定义可以得出几个关键点： - 集合中的元素无序且唯一 - 集合中的元素可以是任何类型，无论是原始值还是对象引用 ### Set 的实例属性和方法 - size: 返回集合中所包含的元素的数量 - add(value): 向集合中添加一个新的项 - delete(value): 从集合中删除一个值 - has(value): 如果值在集合中存在，返回ture, 否则返回false - clear(): 移除集合中的所有项 -...
## 防抖（debounce） ### 定义 **在事件被触发 n 秒后再执行回调，如果在这 n 秒内又被触发，则重新计时。** ### 应用场景 - 搜索框输入发送AJAX请求 - 窗口缩放，每次resize/scroll触发事件 ### 用例 比如有一个关键词搜索的input框，用户输入后触发keyup事件向后端发送一个请求： ```html const input = document.getElementById('input') input.addEventListener('keyup', (e) => { console.log(e.target.value) }) ```...
## output ```js [1, NaN, NaN] ``` ## 分析 ### map - map 方法创建一个新数组，其结果是该数组中的每个元素都调用一个提供的 callback 后返回的结果。 - map 函数接受 2 个参数，callback 和 thisArg。 - callback 函数自动接受 3 个参数，分别是数组当前正在处理的元素、数组当前正在处理元素索引和数组本身。 - callback...
# Node.js docker 镜像体积优化实践 你讨厌部署你的应用程序花费很长时间吗? 对于单个容器来说，超过gb并不是最佳实践。每次部署新版本时都要处理数十亿字节，这对我们来说并不太合适。 本文将通过Nodejs程序展示如何优化Docker镜像的几个简单步骤，使它们更小、更快、更适合生产环境。 ## 简单的一段Node.js项目 首先写一段基于express的简单web服务器程序 ```js // package.json { "name": "docker-test", "version": "1.0.0", "description": "", "main": "app.js", "scripts": { "start": "node app" }, "author": "",...
# 彻底理解Node.js中的Buffer 每当在Node.js中遇到**Buffer**,**Stream**和**binary data**之类的单词时，是否总是像我一样感到困惑? 认为它们并不是常用的，而只适合Node.js专家和包开发人员去使用。 实际上，这些单词是非常重要的，尤其对于用Node.js进行web开发而没有任何CS学位的人员。 当然，如果你选择继续做一个普通的Node.js开发人员，你可能永远不会直接使用它们。但是如果你想对Node.js的理解提升到下一个级别，那么你确实需要更深入地了解Node的许多核心特性。比如Buffer。这正是我写这篇文章的目的——帮助我们揭开其中一些特性的神秘面纱，并将Node.js的学习带到下一个层次。 在开始前，先看一下[Node.js官方文档](https://nodejs.org/dist/latest-v8.x/docs/api/buffer.html#buffer_buffer)对Buffer的说明 > … mechanism for reading or manipulating streams of binary data. The Buffer class was introduced as part of the Node.js API...
# 两种敏捷开发方式的工作流 敏捷开发时当今很流行的一种开发软件方式，接下来主要介绍一下两种主要的敏捷开发方式的工作流 ## Scrum flow 项目计划从定义backlog开始，即交付完成的产品时应该完成的用户需求列表。 - 产品 backlog - 列出团队主要的 “To Do” list。 产品的代办事项列表应该包括全部的特性和 bug 修复。以便在项目结束时确认已经完成。产品的代办列表需要在工作中按照新的需求或者发现的错误持续的更新。产品的负责人负责待办事项，使其与客户的反馈和建议以及团队的工作进度同步。一些Item的优先级应该被提升或下降，一些item应该根据需求的变化增加或者减少。 - Sprint backlog - 包含在特定sprint中要完成的任务。sprint backlog的项目被选择为在sprint结束时交付一个完成的特性或组件。虽然sprint backlog也允许一定的灵活性和修改，但是sprint的目标应该保持不变，并且变更应该保持在最小。 - Sprint goal or increment...
## vue视图更新机制 1. 状态变更，重新渲染一个完整的Virtual DOM对象。 2. 新旧Virtual Dom对比，记录两棵树的差异。 3. 对差异的地方进行真正的DOM操作。 4. 新的Virtual Dom对象替换旧的Virtual Dom。 ## Virtual Dom对比算法（Diff 算法） 1. 基于两个基本假设： - 两个相同的组件产生类似的DOM结构，不同的组件产生不同的DOM结构。 - 同一层级的一组节点，他们可以通过唯一的id进行区分。基于以上这两点假设，使得虚拟DOM的Diff算法的复杂度从O(n^3)降到了O(n)。 2. 仅在同级的vnode间做diff，递归地进行同级vnode的diff，最终实现整个DOM树的更新 ## 结论 1. 在渲染一组同级的VNode时，也遵循上述规则。所以当有key，在进行新旧VNode对比时可以很快的计算出那些项是没有变动的，没变动的这些可以复用旧VNode的数据。在真正的更新DOM时只更新变动的部分。让更新更加高效。...