js 设计模式学习(1)

最近一个人外出旅行 顺便在那座城市买了一本关于JS设计模式的书 供无聊的时候阅读

却发现小有收获 旅游回来以后立马写下心得 做了一个地图 并以此总结此次旅行的经过的地方

尝试1:

尝试写JS类

 1 var TianDiTu = function (lat, lng, zoom) {
 2             if (this instanceof TianDiTu) {
 3                 var zoomSize = { maxZoom: 18, minZoom: 5 },
 4                 normalm = L.tileLayer.chinaProvider(‘TianDiTu.Normal.Map‘, zoomSize),
 5                 normala = L.tileLayer.chinaProvider(‘TianDiTu.Normal.Annotion‘, zoomSize),
 6                 imgm = L.tileLayer.chinaProvider(‘TianDiTu.Satellite.Map‘, zoomSize),
 7                 imga = L.tileLayer.chinaProvider(‘TianDiTu.Satellite.Annotion‘, zoomSize);
 8
 9                 this.normal = L.layerGroup([normalm, normala]);
10                 this.image = L.layerGroup([imgm, imga]);
11                 this.center = [lat, lng];
12                 this.zoom = zoom;
13             } else {
14                 return new TianDiTu(lat, lng, zoom);
15             }
16         };
17
18         var tdt = TianDiTu(34.618129, 112.454059, 12);

尝试2:

尝试将调用地图的方式放入工厂模式:

 1 var CreateMap = function () {
 2             if (!(this instanceof CreateMap))
 3                 return new CreateMap();
 4         }
 5         CreateMap.prototype = {
 6             init: function () {
 7                     map = L.map("map", {
 8                     center: tdt.center,
 9                     zoom: tdt.zoom,
10                     layers: [tdt.normal]
11                 });
12
13                 return this;
14             },
15             createControl: function () {
16                 var baseLayers = {
17                     "地图": tdt.normal,
18                     "影像": tdt.image,
19                 }
20
21                 var overlayLayers = {
22                 }
23
24                 L.control.layers(baseLayers, overlayLayers).addTo(map);
25             }
26         }
27
28         var createMap = new CreateMap();
29         createMap.init().createControl();
时间: 2024-12-24 21:50:47

js 设计模式学习(1)的相关文章

js设计模式学习一(单例模式)

写在最前 为什么会有设计模式这样的东西存在,那是因为程序设计的不完美,需要用设计模式来弥补设计上的缺陷,那立马估计会有童鞋问,既然设计的不完美,那就换个完美点的语言,首先,没有绝对完美的语言存在,其次,借鉴下前辈说的话,灵活而简单的语言更能激发人们的创造力,所以生命力旺盛,这也能够解释,近些年来前端发展的如此迅速的原因吧. ps一段,自从开始正儿八经深入学习前端已经有一年多左右了,当时定的一个看书目标就是最初的是dom入门,之后是高三书和犀牛书,截止到现在这三本基本都算看完了,犀牛书后续的一些章

js设计模式学习 --- 单例模式1

什么单例模式 定义: 保证一个类仅有一个实例,并提供一个访问它的全局访问. 单例模式是一种常用的模式,有一些对象我们往往只需要一个,比如线程池.全局缓存.浏览器中的window 对象等.在JavaScript 开发中,单例模式的用途同样非常广泛.试想一下,当我们单击登录按钮的时候,页面中会出现一个登录浮窗,而这个登录浮窗是唯一的,无论单击多少次登录按钮,这个浮窗都只会被创建一次,那么这个登录浮窗就适合用单例模式来创建. 实现单例模式 <script type="text/javascrip

设计模式学习总结系列应用实例

1.单例模式 应用实例:1.一个党只能有一个主席.2.Windows是多进程多线程的,在操作一个文件的时候,就不可避免地出现多个进程或线程同时操作一个文件的现象,所以所有文件的处理必须通过唯一的实例来进行.3.一些设备管理器常常设计为单例模式,比如一个电脑有两台打印机,在输出的时候就要处理不能两台打印机打印同一个文件. 2.工厂模式 应用实例:1.你需要一辆汽车,你可以直接从工厂里面提货,而不用去管这辆汽车是怎么做出来的,以及这个汽车里面的具体实现 2.Hibernate换数据库只需换方言和驱动

【转】JS设计模式开篇

(原文地址:http://blog.chinaunix.net/uid-26672038-id-3904513.html) 本文主要讲述一下,什么是设计模式(Design pattern),作为敲键盘的我们要如何学习设计模式.设计模式真的是一把万能钥匙么? 各个代码的设计模式几乎每个人都知晓,就算不会那也一定在一些装逼的大牛(部分而已)口中听过.但可能很少有人知道设计模式的由来: 设计模式该术语源自Erich Gamma等人在上世纪90年代从建筑设计领域引入到计算机科学的(很难想象到底有多大关联

JS设计模式(一)

刚入职时,看过一段时间的设计模式,似懂非懂.不知不觉过去七个月了,对JS的理解更深刻了,数据结构与算法的基础也基本上算是过了一遍了,接下来要把设计模式搞定,然后不再深层次研究JS了,而是学习前端自动化.linux.数据库.服务器等的基础知识. 设计模式的学习主要参考<JavaScript设计模式与开发实践>一书,很多笔记也会从该书抄录.开始JS设计模式的学习. 1.原型模式 原型模式既是一种设计模式,也是一种编程泛型.原型模式是JS最基础的继承实现,在这儿就不多讲了,写一下JS原型继承的基本原

设计模式学习总结

本文是对各处设计模式示例的总结概括和简化,主要参考 http://blog.csdn.net/zhangerqing/article/details/8194653 直接看本文估计比较枯燥无聊,因为没图~~??,建议对设计模式有兴趣的先看看上面的博文,或者基础比较好可直接移到最底下看下我的各模式一句话概括总结,有什么意见建议欢迎提出~~~~~~~~~~ 总体来说设计模式分为三大类:创建型模式,共五种:工厂方法模式.抽象工厂模式.单例模式.建造者模式.原型模式.结构型模式,共七种:适配器模式.装饰

java/android 设计模式学习笔记(14)---外观模式

这篇博客来介绍外观模式(Facade Pattern),外观模式也称为门面模式,它在开发过程中运用频率非常高,尤其是第三方 SDK 基本很大概率都会使用外观模式.通过一个外观类使得整个子系统只有一个统一的高层的接口,这样能够降低用户的使用成本,也对用户屏蔽了很多实现细节.当然,在我们的开发过程中,外观模式也是我们封装 API 的常用手段,例如网络模块.ImageLoader 模块等.其实我们在开发过程中可能已经使用过很多次外观模式,只是没有从理论层面去了解它. 转载请注明出处:http://bl

java/android 设计模式学习笔记(10)---建造者模式

这篇博客我们来介绍一下建造者模式(Builder Pattern),建造者模式又被称为生成器模式,是创造性模式之一,与工厂方法模式和抽象工厂模式不同,后两者的目的是为了实现多态性,而 Builder 模式的目的则是为了将对象的构建与展示分离.Builder 模式是一步一步创建一个复杂对象的创建型模式,它允许用户在不知道内部构建细节的情况下,可以更精细地控制对象的构造流程.一个复杂的对象有大量的组成部分,比如汽车它有车轮.方向盘.发动机.以及各种各样的小零件,要将这些部件装配成一辆汽车,这个装配过

java/android 设计模式学习笔记(一)---单例模式

前段时间公司一些同事在讨论单例模式(我是最渣的一个,都插不上嘴 T__T ),这个模式使用的频率很高,也可能是很多人最熟悉的设计模式,当然单例模式也算是最简单的设计模式之一吧,简单归简单,但是在实际使用的时候也会有一些坑. PS:对技术感兴趣的同鞋加群544645972一起交流 设计模式总目录 java/android 设计模式学习笔记目录 特点 确保某一个类只有一个实例,而且自行实例化并向整个系统提供这个实例. 单例模式的使用很广泛,比如:线程池(threadpool).缓存(cache).对