<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
// 1 ,独立的对象 比如 一个是xiaowang 和一个xiaoli
// 2,小李跟小王通过门铃进行通信
// 3,先看小王家有没有门,如果有 直接通过门铃通讯 didi 没有的话 建门
// 4,单例之间进行通信
// \
//
// 以下这种单例是需要用到的时候 才去New一个对象 平时开发里 不是这样写
var xiaowang = (function(argument){
var xiaowangjia = function(message){
//建门
this.menling = message;
}
var men;
var info = {
//info是包含对外的东西
sendMessage:function(message){
//这是info里面其中一个方法,接受信息
if (!men) {
men = new xiaowangjia(message);
};
return men;
}
};
return info;
})();
var xiaoli = {
callXiaowang:function(mes){
//小王家有一个送消息的方法
var _xw=xiaowang.sendMessage(mes);
alert(_xw.menling);
//xiaowang采用闭包 ;此时xiaowang.sendMessage(message)已经被回收了 相当于_xw = null
_xw = null;//加不加这句话都没事,因为效果都一样,不加也是自动被垃圾回收机制回收掉
}
}
xiaoli.callXiaowang('didi'); </script> <script>
//页面有6个按钮 a b c d e f
// a b c => top
// d e f =>bannerbta
var top = {
init:function(){
//
this.render();
this.bind();
},
//要传递的a
a:4,
render:function(){
//放所有dom元素
var me = this;
me.btna = $('#a');
},
bind:function(){
//绑定事件
var me = this;
me.btna.click(function(){
//业务逻辑取出去
me.test(); //此时不能this.test(); 因为此时的this指的是 按钮
})
},
test:function(){
a= 5;
}
}
var banner = {
init:function(){
//初始化
this.render();
this.bind();
},
a:4,
render:function(){
//放所有dom元素 既是绑定dom元素
var me = this;
me.btna = $('#d');
},
bind:function(){
//绑定事件
var me = this;
me.btna.click(function(){
//业务逻辑取出去
me.test(); //此时不能this.test(); 因为此时的this指的是 按钮
})
},
test:function(){ //当点击的时候
top.a = 6;
}
}
top.init();
banner.init(); </script> </body>
</html>

js之 单例模式的更多相关文章

  1. JS实现单例模式的多种方案

    JS实现单例模式的多种方案 今天在复习设计模式中的-创建型模式,发现JS实现单例模式的方案有很多种,稍加总结了一下,列出了如下的6种方式与大家分享 大体上将内容分为了ES5(Function)与ES6 ...

  2. JS的单例模式

    维基百科对单例模式的介绍如下: 在应用单例模式时,生成单例的类必须保证只有一个实例的存在,很多时候整个系统只需要拥有一个全局对象,才有利于协调系统整体的行为.比如在整个系统的配置文件中,配置数据有一个 ...

  3. 2.js模式-单例模式

    1. 单例模式 单例模式的核心是确保只有一个实例,并提供全局访问. function xx(name){}; Singleton.getInstance = (function(){ var inst ...

  4. js设计模式-单例模式

      JavaScript中的单例模式是最常用的.最基本的设计模式,它提供了一种命名空间,减少全局变量泛滥的代码管理机制: 1.最常见的单例模式: [javascript] view plain cop ...

  5. js之单例模式

    单例模式是指一个类,只有一个实例.实现的思路是,创建实例时候加判断,如果有实例则返回,如果没有就new一个,并返回. 第一步: 创建类. function Waiter(id, name, salar ...

  6. JS设计模式——单例模式剖析

    转载于原文地址:https://blog.csdn.net/q1056843325/article/details/52933426 举一个通俗的例子,在页面中点击登录按钮,弹出了一个登录浮窗,这个登 ...

  7. [js]js设计模式-单例模式

    单例模式 不同模块之间需要同时开发, // 单例模式: 把描述同一个事物的属性和方法放在同一个内存空间下. // 优点: 分组,防止冲突 // p1 p2也叫做命名空间(模块开发) var p1 = ...

  8. js 设计模式——单例模式

    单例模式 保证一个类仅有一个实例,并提供一个访问它的全局访问点. 单例模式是一种常用的模式,有一些对象我们往往只需要一个,比如线程池.全局缓存.浏览器中的 window 对象等. JavaScript ...

  9. [转]JS设计模式-单例模式(二)

    单例模式是指保证一个类仅有一个实例,并提供一个访问它的全局访问点. 单例模式是一种常用的模式,有一些对象往往只需要一个,比如线程池.全局缓存.浏览器中的window对象等.在javaScript开发中 ...

随机推荐

  1. 网球pt站 T3nnis 情况说明

    网球收藏爱好者们一定知道这个站,网球界的海德堡. 但想进的人发现没什么办法.满世界的找门路.那我说一下具体的情况吧. ************************************ 更新:现 ...

  2. leecode第二百三十六题(二叉树的最近公共祖先)

    /** * Definition for a binary tree node. * struct TreeNode { * int val; * TreeNode *left; * TreeNode ...

  3. clojure开发环境配置git, vscode+Calva插件配置

    万事开头难,全是犄角旮旯的细节. 1 安装lein 参见 https://www.cnblogs.com/xuanmanstein/p/10504401.html 2 创建工程 lein 参考http ...

  4. Redis(三)-数据类型

    1.五种数据类型:字符串类型.字符串列表.有序字符串集合.哈希.字符串集合 2.字符串类型常用操作 (1)赋值 $ set key value (2)取值 $ get key (3)删除 $ del ...

  5. Subversion ----> svnserve.conf / authz / passwd / hooks-env.tmpl <<翻译笔记>>

    svnserve.conf 假如你使用这个文件去允许访问这个仓库,那么这个文件控制着svnserve后台进程的配置.(但是如果你只是允许通过http和/或者 file:URLs,则这个文件就不起作用了 ...

  6. 如何增加亚马逊listing多个类目节点

    流量是电商销售的必要因素,可以说,任何成功的电商平台都离不开流量.亚马逊listing优化做得好,不仅能提高产品的曝光率,还能提升转换率,而好的类目可以吸引大的流量.帮你快速爬升. 首先我们来了解一下 ...

  7. POJ-2796 & 2019南昌邀请赛网络赛 I. 区间最大min*sum

    http://poj.org/problem?id=2796 https://nanti.jisuanke.com/t/38228 背景 给定一个序列,对于任意区间,min表示区间中最小的数,sum表 ...

  8. 牛逼的MySQL,起死回生啊

    1.目标库新建数据库root@mysqldb 14:10:  [(none)]> create database db_name; root@mysqldb 14:11:  [(none)]&g ...

  9. js里面的Object基本

    属性名必须是字符串,非字符串对象不能用来作为一个对象属性的键,任何非字符串对象,包括number,可通过toString()方法,类型转换成一个字符串1 1,Object基本格式 <script ...

  10. nginx 基本操作及配置

    基本操作: 1.启动nginx {global}/nginx 例如:/usr/local/Cellar/nginx/1.13.12/bin/nginx 2.重启nginx {global}/nginx ...