JavaScript 设计模式
JavaScripe 设计模式与开发实践,例如发布-订阅者模式是我们在学习Vue底层实现原理和React中的Redux,他们都涉及到的一种设计模式,了解原理将会对我们的学习有很大的帮助......
DreamFive
这个作者很懒,什么都没留下…
展开
-
第八节、JavaScript 设计模式——发布-订阅模式
定义:发布-订阅模式又叫观察者模式,它定义对象间的一种一对多的依赖关系,当一个对象的状态发生变化时,所有依赖他的对象都将得到通知。 实现发布-订阅的步骤: 首先要指定好谁充当发布者 然后发布者添加一个缓存列表,用于存放回调函数以便通知订阅者 最后发布消息时,发布者会遍历这个缓存列表,依次触发里面存放的订阅者回调函数 另外,我们还可以往回调函数里填入一些参数,订阅者可以接收这些参数。 发布-订阅...原创 2019-12-12 23:11:37 · 133 阅读 · 0 评论 -
第七节、JavaScript 设计模式——迭代器模式
定义:迭代器模式是指提供一种方法顺序访问一个聚合对象中的各个元素,而又不需要暴露该对象的内部表示。 在 JavaScript 中,像 Array.prototype.forEach等都是其内置的迭代器实现。 迭代器类型 内部迭代器 let each = (arr,callback)=>{ for(let i=0; i<arr.length; i++){ callback.cal...原创 2019-12-10 23:10:17 · 184 阅读 · 0 评论 -
第六节、JavaScript 设计模式——代理模式
定义:代理模式是为一个对象提供一个代用品或占位符,以便控制对它的访问。 举个例子来说明吧。 小明遇到了他的百分百女孩,暂且把他的女神称呼为 A,小明决定给A送一束花表白。刚好小明和A有一个共同的朋友B,于是内向的小明决定让B来代替自己完成送花这件事。 let Flower = function(){}; let xiaoming = { sendFlower: (target)=>{ ...原创 2019-12-09 23:31:05 · 117 阅读 · 0 评论 -
第五节、JavaScript 设计模式——策略模式
定义:定义一系列的算法,把它们一个个封装起来,并且使他们能互相替换。 策略模式有着广泛的应用,举一个计算年终奖金的例子,年终奖的计算方式会根据工资基数和年底绩效考核来计算的。 let strategies = { "S":(salary)=>{ return salary*4; }, "A":(salary)=>{ return salary*3; }, "B":(s...原创 2019-12-08 00:19:52 · 123 阅读 · 0 评论 -
第四节、JavaScript 设计模式——单例模式
定义:保证一个类仅有一个实例,并提供一个访问它的全局访问点。 实现一个单例模式。 // 实现单例模式无非是用一个变量来标志当前是否为某个类创建过对象,如果是,则下次获取该类时直接返回之前创建的对象 var Singleton = (name)=>{ this.name = name }; Singleton.prototype.getName = ()=>{ alert(this.na...原创 2019-12-07 00:12:47 · 111 阅读 · 0 评论 -
第三节、JavaScript 设计模式——闭包和高阶函数
这一节同上一节一样,都是为后续学习打基础的内容。对此非常了解的可以跳过。 一、闭包 闭包是什么? 闭包就是有权访问其他函数作用域内变量的函数。 闭包的作用 通过闭包可以访问局部变量 可以让局部变量的值始终保持在内存中(因此要注意不能滥用闭包) 可以暂存数据,给变量开辟私密空间,避免外部污染。 闭包优缺点 优点:可以把局部变量驻留在内存中,可以避免使用全局变量;全局变量在复杂程序中会造成许多麻烦...原创 2019-12-05 00:12:02 · 137 阅读 · 0 评论 -
第二节、JavaScript 设计模式——this、call 和 apply
这一节不涉及具体设计模式,只是针对我们后续的学习做一个铺垫,如果是对这三者很了解的话请跳过此节。 JavaScript 的 this 总是指向一个对象,具体指向哪个对象在运行时基于函数的执行环境动态绑定的,而非函数声明时的环境。 除去不常用的 with 和 eval 的情况,this 的指向大致分为以下4种: 作为对象的方法调用 作为普通函数调用 构造器调用 Function.proto...原创 2019-12-03 23:14:19 · 121 阅读 · 0 评论 -
第一节、JavaScript 设计模式——原型模式
前言:刚开始学习这部分内容时,只学了 1/5 就放弃了,当时感觉实际开发中没有太大用处。随着之后学习 Vue 和 React 时,发现设计原理与底层实现方式涉及到发布-订阅者模式(观察者模式),学习起来费了一番功夫,这才意识到掌握 JavaScript 设计模式与开发实践是多么重要的一件事情。 好了,废话不多说,现在开始我们的学习(第一节比较简单,也将接触到我们的第一个设计模式,大家记住就行)。 ...原创 2019-12-02 22:57:57 · 139 阅读 · 0 评论