51工具盒子

依楼听风雨
笑看云卷云舒,淡观潮起潮落

jquery

原生JS实现哈希路由

原生JS实现哈希路由

厉飞雨 阅读(150) 评论(0) 赞(7)

源码 {#源码} -------- 使用[Codepen在线体验](https://codepen.io/kifuan/pen/RwQjrzM)和查看源码。 页面代码 {#页面代码} ------------ 在我们用前端框架的时候,经常用到路由技术,就是在地址栏确实发生了变化但是页面没有刷新,那么本文就介绍通过更改哈希的方式实现这样一种路由,下面是页面代码: |---...

JS实现函数重载

JS实现函数重载

厉飞雨 阅读(104) 评论(0) 赞(9)

需求 {#需求} -------- 假设我们有这样一个数据(来源于参考文章中的*浅谈JavaScript函数重载*,链接在文章尾部给出): |---------------|--------------------------------------------------------------------------------| | ``` 1 2 3 ``` | `...

JS设计模式之装饰器模式

JS设计模式之装饰器模式

厉飞雨 阅读(131) 评论(0) 赞(10)

意图 {#意图} -------- > 动态地给一个对象添加一些额外的职责。就增加功能来说,装饰器模式相比生成子类更为灵活。 > > ------《设计模式:可复用面向对象软件的基础》中文版第132页 在Java中这样的设计可太多了,比如进行IO操作时的`XxxReader`,那么这里就模仿它进行一个应用。 示例 {#示例} -------- 如下: ...

JS设计模式之单例模式

JS设计模式之单例模式

厉飞雨 阅读(122) 评论(0) 赞(8)

意图 {#意图} -------- > 保证一个类仅有一个实例,并提供一个访问它的全局访问点。 > > ------《设计模式:可复用面向对象软件的基础》中文版第96页 这个概念有些类似于全局变量,它确保所有引用都访问到唯一的实例对象,这可以节省掉创建对象的开销。但是,相应地,在懒加载模式下,它也带来了检查是否已经创建对象的开销。所以还是要根据情况灵活选择...

JS设计模式之备忘录模式

JS设计模式之备忘录模式

厉飞雨 阅读(208) 评论(0) 赞(10)

意图 {#意图} -------- > 在不破坏封装性的前提下,捕获一个对象的内部状态,并在该对象之外保存这个状态。这样以后就可将该对象恢复到原先保存的状态。 > > ------《设计模式:可复用面向对象软件的基础》中文版第212页 这个常常被运用于游戏存档、操作撤销等场景。 示例 {#示例} -------- 这是一个悲催的故事,内容是一个人先涨薪...

JS设计模式之建造者模式

JS设计模式之建造者模式

厉飞雨 阅读(98) 评论(0) 赞(13)

意图 {#意图} -------- > 将一个复杂对象的构建与它的表示(即实例对象)分离,使得同样的构建过程可以创建不同的表示 > > ------《设计模式:可复用面向对象软件的基础》中文版第74页 这句话里包含着两个要素:第一个是分离构建与表示,也就是说我们要单独创建一个新的类`XxxBuilder`来进行构建操作;第二个是这个`XxxBuilder`...

JS设计模式之工厂模式

JS设计模式之工厂模式

厉飞雨 阅读(73) 评论(0) 赞(8)

工厂方法模式 {#工厂方法模式} ---------------- > 定义一个用于创建对象的接口,让子类决定实例化哪一个类。工厂方法使一个类的**实例化延迟到子类**。 > > ------《设计模式:可复用面向对象软件的基础》中文版第81页 在我理解中,所谓工厂方法,是指我们通过**调用已知的接口,获得未知的对象,做出预期的行为**。工厂方法为我们提供...

JS统计中英文字数

JS统计中英文字数

厉飞雨 阅读(80) 评论(0) 赞(11)

源码 {#源码} -------- > 来自半年后的说明:我把代码转放到 gists 里了,当时代码风格受 Python 影响较大,这里就不再更改了,毕竟大家本地都有自己的格式化工具。 点击[这里](https://gist.github.com/hikariyo/b838dff3bdf0d280b25f50a66abd699c)前往Github获取本文源码。 需求...

JS迭代器和生成器

JS迭代器和生成器

厉飞雨 阅读(156) 评论(0) 赞(10)

背景 {#背景} -------- 遍历数组的时候,我相信大多数人已经用上ES6的`for...of`语法了: |---------------------|--------------------------------------------------------------------------------------| | ``` 1 2 3 4 5 6 ```...

JS写睡眠排序

JS写睡眠排序

厉飞雨 阅读(63) 评论(0) 赞(12)

<h2>实现 {#实现}</h2> <p>代码看起来很简单,这里就直接给出来了:</p> <p>|---------------------------------------------------|-----------------------------------------------------------...