js设计模式之-单例模式的使用

php中世界最好的语言
Freigeben: 2018-03-14 14:02:33
Original
2312 Leute haben es durchsucht

这次给大家带来js设计模式之-单例模式的使用,使用js单例模式的使用注意事项有哪些,下面就是实战案例,一起来看一下。

1、概念:
在传统的开发工程师眼里,单利模式就是保证每一个类只有一个实例,我们在实现时首先判断实例是否存在,如果存在,则直接返回,如果不存在就创建了再返回,这就确保了每一个类只有一个实例对象。在javascript里单例作为一个命名空间的提供者,从全局里提供一个唯一的访问点来访问对象。123
2、作用以及注意事项:
作用:1.模块间通信
2.系统中某个类的对象只能存在一个
3.保护自己的属性和方法
注意事项:1.注意this的使用
2.闭包容易造成内存泄漏
3.使用继承时注意new的使用。

3、实现
最简单的一种办法就是使用是对象字面量的方法,其字面量里可以包含大量的属性和方法。

var firstObject = { property1: "something", property2: "something else", method1: function () { console.log('hello web!'); } };
Nach dem Login kopieren

如果你要扩展该对象,我们可以提供自己的私有成员,然后我们通过闭包在其内部封装这些变量和函数声明。我们可以实现私有或者公有的方法。我们再看下面这一段代码:

var firstObject= function () { /* 这里声明私有变量和方法 */ var privateVariable = 'something private'; function showPrivate() { console.log(privateVariable); } /* 公有变量和方法(可以访问私有变量和方法) */ return { publicMethod: function () { showPrivate(); }, publicVar: 'the public can see this!' }; };var single = firstObject(); single.publicMethod(); // 输出 'something private'console.log(single.publicVar); // 输出 'the public can see this!'
Nach dem Login kopieren

如果我们想做到只有在使用的时候才初始化,那该如何做呢?为了节约资源的目的,我们可以另外一个构造函数里来初始化这些代码,如下:

var firstjObiect= (function () { var instantiated; function init() { /*这里定义单例代码*/ return { publicMethod: function () { console.log('hello world'); }, publicProperty: 'test' }; } return { getInstance: function () { if (!instantiated) { instantiated = init(); } return instantiated; } }; })();/*调用公有的方法来获取实例:*/firstjObiect.getInstance().publicMethod();
Nach dem Login kopieren

我们来看一下他的使用场景,单例一般是用在系统间各种模式的通信协调上

var firstObjectTester = (function () { //参数:传递给单例的一个参数集合 function Singleton(args) { //设置args变量为接收的参数或者为空(如果没有提供的话) var args = args || {}; //设置name参数 this.name = 'SingletonTester'; //设置pointX的值 this.pointX = args.pointX || 6; //从接收的参数里获取,或者设置为默认值 //设置pointY的值 this.pointY = args.pointY || 10; } //实例容器 var instance; var _static = { name: 'SingletonTester', //获取实例的方法 //返回Singleton的实例 getInstance: function (args) { if (instance === undefined) { instance = new Singleton(args); } return instance; } }; return _static; })();var singletonTest = firstObjectTester .getInstance({ pointX: 5 }); console.log(singletonTest.pointX); // 输出 5
Nach dem Login kopieren

下面给大家链接一下单例模式实现的一个例子,这里把那链接给大家:
解决Textarea的数据存储时的Html转Txt和展示时Txt转Html

上面这种方式主要实现的方法,还有其他的一些实现方法(来自汤姆大叔的博客)
方法一、

function Universe() { // 判断是否存在实例 if (typeof Universe.instance === 'object') { return Universe.instance; } // 其它内容 this.start_time = 0; this.bang = "Big"; // 缓存 Universe.instance = this; // 隐式返回this}// 测试var uni = new Universe();var uni2 = new Universe(); console.log(uni === uni2); // true
Nach dem Login kopieren

方法二、

function Universe() { // 缓存的实例 var instance = this; // 其它内容 this.start_time = 0; this.bang = "Big"; // 重写构造函数 Universe = function () { return instance; }; }// 测试var uni = new Universe();var uni2 = new Universe(); uni.bang = "123"; console.log(uni === uni2); // trueconsole.log(uni2.bang); // 123
Nach dem Login kopieren

相信看了本文案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!

推荐阅读:

深入JavaScript之DOM应用

深入JavaScript之定时器

深入JavaScript之基础应用

Das obige ist der detaillierte Inhalt vonjs设计模式之-单例模式的使用. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!