
JS设计模式之职责链模式
意图 {#意图} -------- > 使多个对象都有机会处理请求,从而避免请求的发送者和接收者之间的耦合关系。将这些对象连城一条链,并沿着这条链传递该请求,直到有一个对象处理它为止。 > > ------《设计模式:可复用面向对象软件的基础》中文版第167页 尤其是我们在处理不同类型的表单时,这个设计模式就能很好的派上用场。 示例 {#示例} ----...
意图 {#意图} -------- > 使多个对象都有机会处理请求,从而避免请求的发送者和接收者之间的耦合关系。将这些对象连城一条链,并沿着这条链传递该请求,直到有一个对象处理它为止。 > > ------《设计模式:可复用面向对象软件的基础》中文版第167页 尤其是我们在处理不同类型的表单时,这个设计模式就能很好的派上用场。 示例 {#示例} ----...
意图 {#意图} -------- > 用原型示例指定创建对象的种类,并且通过拷贝这些原型创建新的对象。 > > ------《设计模式:可复用面向对象软件的基础》中文版第89页 所以这里说的原型类似于对象的蓝图。但是,由于JS的灵活性,这个设计模式对于JS来说不是很重要。 > 因为在像C++这样的静态语言中,类不是对象,并且运行时只能得到很少或者得...
背景 {#背景} -------- 这是在**AVL树** 计算高度时遇到的问题。为了方便大家看到问题的本质,这里使用一个**单链表**复现问题。 我们有一个链表,并且把它的深度储存到了每一个节点里(所谓深度就是它拥有的子节点层数,对于一个链表而言就是它的**长度减一**)。 复现 {#复现} -------- 先一个个函数来实现一个简单的链表。不直接说的原因是我想让读...
源码 {#源码} -------- 前往[Codepen](https://codepen.io/kifuan/pen/vYdzpPz)在线体验。 介绍 {#介绍} -------- **防抖** 和**节流**是两个JS中的概念,它们被广泛应用于被频繁触发的事件中,如搜索框在输入时会弹出候选列表:如果每次输入都发送一个AJAX请求来获取数据,那么后台就要被刷爆了。所以,...
意图 {#意图} -------- > 保证一个类仅有一个实例,并提供一个访问它的全局访问点。 > > ------《设计模式:可复用面向对象软件的基础》中文版第96页 这个概念有些类似于全局变量,它确保所有引用都访问到唯一的实例对象,这可以节省掉创建对象的开销。但是,相应地,在懒加载模式下,它也带来了检查是否已经创建对象的开销。所以还是要根据情况灵活选择...
源码 {#源码} -------- 使用[Codepen在线体验](https://codepen.io/kifuan/pen/RwQjrzM)和查看源码。 页面代码 {#页面代码} ------------ 在我们用前端框架的时候,经常用到路由技术,就是在地址栏确实发生了变化但是页面没有刷新,那么本文就介绍通过更改哈希的方式实现这样一种路由,下面是页面代码: |---...
<h2>实现 {#实现}</h2> <p>代码看起来很简单,这里就直接给出来了:</p> <p>|---------------------------------------------------|-----------------------------------------------------------...
背景 {#背景} -------- 我没有系统性的从头开始学过一遍JS,全凭之前学的其它语言,尤其是Python,直接上手操作了,所以留了不少的坑。 虽然对我来说是一个坑,但我觉得本文更适合放到学习的分类里。 给出下列代码。这里是对原问题的一个抽象,只是把问题的核心单独摘出来了: |------------------------------------|-------...
<h2>背景 {#背景}</h2> <p>众所周知,JS是单线程语言,但它支持异步操作,其核心机制就是JS引擎的<strong>事件循环</strong>。</p> <p>先上一段代码:</p> <p>|----------------------------------...
背景 {#背景} -------- 遍历数组的时候,我相信大多数人已经用上ES6的`for...of`语法了: |---------------------|--------------------------------------------------------------------------------------| | ``` 1 2 3 4 5 6 ```...