您的位置:首页 > Web前端 > JavaScript

js 设计模式学习(1)

2017-02-11 01:32 274 查看
最近一个人外出旅行 顺便在那座城市买了一本关于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();
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: