发布-订阅模式.又称观察者模式(Observer).它定义了对象之间的一对一或一对多的依赖关系.当一个对象发生变化时,它会通知到依赖它的其他对象.

发布-订阅模式广泛用于异步编程者中,是一种代替传递回调函数的方案.前端最典型的例子就是:EventTarget.addEventListener()监听DOM事件.

发布-订阅模式可以取代对象之间的硬编码,让两个对象松耦合联系在一起.

发布订阅模式的缺陷:

1. 会消耗一定的时间和内存.
2. 过度使用会将对象之间的联系深埋在背后,导致程序难以跟踪维护和理解.
   阅读更多

代理模式:通过一个中间对象,控制对真实想要调用对象的访问.

代理模式的用途:

1. 代理将接受的信息 加工处理后传给本体,还可以控制本体接受数据的速率.
2. 代理帮助缓存本体已经处理过的数据.
3. 代理校验是否有权限访问本体.

软件设计模式是高效组织代码的方式,它能保证系统的灵活性和可靠性.策略模式是最长用的模式之一.

定义一系列的算法,把它们封装起来.并且使它们可以互相替换. - 策略模式

前端工程化的一个基础能力就是自动部署前端打包后的代码到服务器.基于node和typecript写了一个自动部署的脚步.

脚本的逻辑是先将目录打包压缩包,再通过SSH上传到服务器,最后解压和备份.源码地址

“Event Loop是一个程序结构，用于等待和发送消息和事件。（a programming construct that waits for and dispatches events or messages in a program.）”

JS是一门单线程语言,但它支持事件驱动,可以同时接受多个事件并处理响应.这个处理过程是异步操作的. 在浏览器和Node.js中实现了一套 Event Loop机制来完成 JS的异步操作行为.

一个项目中会有多名开发中同时进行code,为了项目的健壮和可维护性我们需要制定一套代码规范,约束开发者的coding.

Dart官方推荐一套代码规范.这套规范适用于其他语言的项目代码规范.

Dart 是Google为客户端界面开发而创造的静态语言.它是Flutter框架指定的开发语言.

缓存是一种保存资源副本并在下次请求时直接使用该副本的技术.

Web 缓存能够减少延迟与网络阻塞，进而减少显示某个资源所用的时间。借助 HTTP 缓存，Web 站点变得更具有响应性。

缓存技术有: 网关缓存、CDN、方向代理缓存、负载均衡器等部署在服务器端的缓存技术.

HTTP缓存是浏览器和服务器协同工作完成的一种机制.它可以帮助Web应用更开始的响应用户的行为.

而在HTTP缓存中只能存储GET请求的响应,对于其他类型的响应无能为力.

Linux账户体系分为用户和群组,一个用户可以属于多个群组.而Linux里面一切皆是文件,而对文件的权限分为三类:拥有者,群组,其他.

针对不同的用户需求,应该创建不同的账户和群组.使它们只能针对特定的文件或目录拥有权限,这样最大限度的保证系统的安全.

Linux拥有多个版本,为了希望让使用者可以了解到已安装软件通常放置于那个目录下,Linux推出了Filesystem Hierarchy Standard (FHS)标准.

FHS的重点在于规范每个特定的目录下应该要放置什么样子的数据而已。 这样做好处非常多，因为Linux操作系统就能够在既有的面貌下(目录架构不变)发展出开发者想要的独特风格。

Linux支持多人同时登录系统处理,每个登录用户都会创建一个shell进程.shell进程的id是唯一的,除了linux核心模块其他文件是可以实现同时操作的.

支撑多人同时对系统进行操作的基础,的是Linux安全的文件权限设计.

在Linux上任何东西都是文件,而文件的权限从使用者分为:own、group、other.从行为分为:r、w、x.

而文件类型常见的分为:-、d、l

JavaScript语法比较灵活，并没有严格规定的面向编程的方式。在JavaScript中支持多种实现面向对象编程方式。

Object Literals

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

// 标准的 JS对象
const book1 = {
    title: 'Book One',
    author: 'John Doe',
    year: '2013',
    getSummary: function () {
        return `${this.title} was writter by ${this.author} in ${this.year}`;
    }
};

console.log(book1.getSummary())
// Book One was writter by John Doe in 2013

console.log(Object.values(book1))
// ['Book One', 'John Doe', '2013', fn]

console.log(Object.keys(book1))
// ['title', 'author', 'year', 'getSummary']

Charles 是macOS上很好用的一款抓包应用程序，通过设置代理服务，你可以很轻松的抓取通讯设备上的HTTP/HTTPS数据包。

Acceessing Navigator(Left) and Inspector(Right)

Command 1–8 (Left)

Command Option 1–6 (Right)

最近写了一个脚本使用JS读取Excel的数据后进行随机组合排列后再写入Excel文件。使用到了node-xlsx 库用于操作Excel文件。为什么没有使用大名鼎鼎的js-xlsx，是因为发现node-xlsx其实是依赖于js-xlsx的，它对js-xlsx接口进行了封装对使用者更友好些，特别是读取Excel文件解析后的数据格式更友好些。

Canvas动画的原理就是利用JavaScript连续的重绘图形，形成动图的效果。

主要会使用到的技术点有：

• setInterval 定时执行某个函数，实现连续绘制图形。

• setTimeout 一定时候后执行某个函数，可以实现连续的绘制图形。

• requestAnimationFrame 告诉浏览器您希望执行动画并请求浏览器在下一次重绘之前调用指定的函数来更新动画。该方法使用一个回调函数作为参数，这个回调函数会在浏览器重绘之前调用。

• clearRect 设置指定矩形区域内（以 点 (x, y) 为起点，范围是*(width, height)* ）所有像素变成透明，并擦除之前绘制的所有内容的方法。清除画布内容。

• save和restore 保存当前画布状态和恢复到最近的保存状态的方法。

下面的例子，采用 window.requestAnimationFrame()实现动画效果。这个方法提供了更加平缓并更加有效率的方式来执行动画，当系统准备好了重绘条件的时候，才调用绘制动画帧。一般每秒钟回调函数执行60次，也有可能会被降低。想要了解更多关于动画循环的信息，尤其是游戏，可以在Game development zone 参考这篇文章 Anatomy of a video game。

在用CSS写动画时需要设置动画的运动速度变化节奏，这个值是可以是根据四点定义一个 贝塞尔曲线。出于好奇了解一下贝塞尔曲线到底是啥。

在一个Canvas画布中，两个图形会有交叉的情况，这种情况可以通过globalCompositeOperation 属性设置两个图形交叉时展示的效果。

你还可以使用clip，将当前路径设置为剪切路径。从而绘制剪切的效果。

Canvas 绘制的图像是可以：放大、缩小、变形、旋转。这些特性和 CSS3 很类似，和 CSS3 不同的是,Canvas 变形的中心点并不是图形的正中心，而是图形的左上角。

Promise是ES6,async/await是ES7确定的ECMA标准.目前最新的 Chrome浏览器和Typescript已经支持.

Promise和async/await极大的改善了JS的编码体验.本文将介绍它们使用方式和注意事项.

Promise

Promise 对象用于表示一个异步操作的最终完成 (或失败), 及其结果值.

它的基础语法:

1

new Promise( function(resolve, reject) {...} /* executor */  );