C.js代码：

/**

 * 有BUG

 */

(function (global) {

    var _id;

    var _map;

    var _length;

    global.C = function () {

        _map = {};

        _length = 0;

    };

    global.C.prototype = {

        setId: function (id) {

            _id = id;

        },

        getId: function () {

            return _id;

        },

        put: function (key, value) {

            if (!_map.hasOwnProperty(key)) {

                _length++;

            }

            _map[key] = value;

        },

        get: function (key) {

            if (_map.hasOwnProperty(key)) {

                return _map[key];

            }

            return null;

        },

    };

    global.C.prototype.constructor = global.C;

})(window);

错误原因：代码中_id、_map、_length变量是C的所有实例共用的。

D.js代码：

/**

 * 无BUG

 */

(function (global) {

    global.D = function () {

        this._map = {};

        this._length = 0;

    };

    global.D.prototype = {

        setId: function (id) {

            this._id = id;

        },

        getId: function () {

            return this._id;

        },

        put: function (key, value) {

            if (!this._map.hasOwnProperty(key)) {

                this._length++;

            }

            this._map[key] = value;

        },

        get: function (key) {

            if (this._map.hasOwnProperty(key)) {

                return this._map[key];

            }

            return null;

        },

    };

    global.D.prototype.constructor = global.D;

})(window);

test.html代码：

<!DOCTYPE html>

<html>

<head>

    <title>JS闭包测试</title>

    <meta charset="utf-8" />

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <style type="text/css">

    </style>

    <script type="text/javascript" src="jquery-1.7.1.js"></script>

    <script type="text/javascript" src="C.js"></script>

    <script type="text/javascript" src="D.js"></script>

</head>

<body>

    <input type="button" value="测试1" onclick="test()" />

    <div id="div" style="height:800px;"></div>

    <script type="text/javascript">

        var div = $("#div");

        function log(msg) {

            div.append(msg + " ");

        }

        function logLine(msg) {

            div.append(msg + "<br />");

        }

        //测试

        function test() {

            var c1 = new C();

            var c2 = new C();

            var d1 = new D();

            var d2 = new D();

            c1.setId("id1");

            c2.setId("id2");

            d1.setId("id1");

            d2.setId("id2");

            logLine(c1.getId());

            logLine(c2.getId());

            logLine(d1.getId());

            logLine(d2.getId());

            debugger;

            c1.put("key1", "value1");

            c2.put("key1", "value2");

            d1.put("key1", "value1");

            d2.put("key1", "value2");

            logLine(c1.get("key1"));

            logLine(c2.get("key1"));

            logLine(d1.get("key1"));

            logLine(d2.get("key1"));

        }

    </script>

</body>

</html>

测试截图：

JS 闭包 BUG的更多相关文章

  1. js闭包之我见

    很久前的一个问题终于得以解决,内心是无比喜悦的,不多说,先上代码: function test(){ for(var i=0;i<5;i++){ window.onclick=function( ...

  2. js闭包的作用域以及闭包案列的介绍：

    转载▼ 标签: it   js闭包的作用域以及闭包案列的介绍:   首先我们根据前面的介绍来分析js闭包有什么作用,他会给我们编程带来什么好处? 闭包是为了更方便我们在处理js函数的时候会遇到以下的几 ...

  3. 大部分人都会做错的经典JS闭包面试题

    由工作中演变而来的面试题 这是一个我工作当中的遇到的一个问题,似乎很有趣,就当做了一道题去面试,发现几乎没人能全部答对并说出原因,遂拿出来聊一聊吧. 先看题目代码: function fun(n,o) ...

  4. Js闭包常见三种用法

        Js闭包特性源于内部函数可以将外部函数的活动对象保存在自己的作用域链上,所以使内部函数的可以将外部函数的活动对象占为己有,可以在外部函数销毁时依然存有外部函数内的活动对象内容,这样做的好处是可 ...

  5. js闭包之初步理解（ JavaScript closure）

    闭包一直是js中一个比较难于理解的东西,而平时用途又非常多,因此不得不对闭包进行必要的理解,现在来说说我对js闭包的理解. 要理解闭包,肯定是要先了解js的一个重要特性, 回想一下,那就是函数作用域, ...

  6. (原创)JS闭包看代码理解

    <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="C ...

  7. js闭包理解

    js闭包的作用是使函数外可以访问函数内部的变量,是通过 在函数内部 定义 访问函数内变量 的函数实现的,内部的一个函数产生一个闭包 function a() { var i=0; return fun ...

  8. js闭包理解实例小结

    Js闭包 闭包前要了解的知识  1. 函数作用域 (1).Js语言特殊之处在于函数内部可以直接读取全局变量 <script type="text/javascript"> ...

  9. Js闭包的用途

    本来想总结一点JavaScript中的闭包的一些用法,在查资料的时候发现了一篇很好的文章,就转过来收藏了,下面附上传送门: js闭包的用途 ---------sunlylorn 我们来看看闭包的用途. ...

  10. js闭包和ie内存泄露原理

    也议 js闭包和ie内存泄露原理 可以, 但小心使用. 闭包也许是 JS 中最有用的特性了. 有一份比较好的介绍闭包原理的文档. 有一点需要牢记, 闭包保留了一个指向它封闭作用域的指针, 所以, 在给 ...

随机推荐

  1. SQL Server 2000 创建角色，登陆用户，安全用户，批量授予权限

    前言 我在2011年刚入门学习的时候,是从 SQL Server 2008 开始学的,再加上这些年较少接触 SQL Server 2000,因此对它不是很熟. 之前都是在 SQL Server 200 ...

  2. C语言,可爱的小明特别喜欢爬楼梯，他有的时候一次爬一个台阶，有的时候一次爬两个台阶，有的时候一次爬三个台阶。如果这个楼梯有n个台阶，小明一共有多少种爬法呢？n值从键盘输入。

    /* 开发者:慢蜗牛 开发时间:2020.5.28 程序功能:小明爬楼梯 */ #include<stdio.h> int taijie(int n); long taijie(int n ...

  3. C#中LINQ的使用知多少？LINQ常功能整理，实例源代码解析

    LINQ(Language-Integrated Query)是C#语言中的一个强大的查询技术,它提供了一种统一的查询语法,可以用于查询和操作各种数据源,包括集合.数据库.XML等.下面详细描述了LI ...

  4. 【Javaweb】什么是Listener监听器？

    1.Listener监听器它是Javaweb的三大组件之一.Javaweb的三大组件分别是:Servelt程序,Filter过滤器,Listener监听器. 2.Listener它是JavaEE的规范 ...

  5. [ABC328D] Take ABC 题解

    题目翻译 题目描述 给你一个字符串 \(S\) 包含 A.B 和 C 三个不用的字符. 只要字符串 \(S\) 中包含连续的 ABC 就将 ABC 删除掉 再字符串 \(S\) 不能操作之后输出这个字 ...

  6. mybatis_高级

    注解方式: 不需要配置文件 @select等注解直接放在接口mapper里 多表操作: @Select("select * from user1") @Results({ @Res ...

  7. 开源地图库OpenLayers的简单使用

    引言 最近在学习可视化的东西,这让我想起了一些以前用过的图表库,其实我在日常做的大多是普通的需求,可视化方面应用的并不多,只是偶尔会因为个别特殊的需求,去借助一些图表库来实现图表的展示,这些普通的图表 ...

  8. SpringBoot项目整合微信登录

    一.开通微信登录 去微信开发者平台 1.注册 2.邮箱激活 3.完善开发者资料 4.开发者资质认证 准备营业执照,1-2个工作日审批.300元 5.创建网站应用 6.提交审核,7个工作日审批 7.熟悉 ...

  9. Harbor安装和镜像推送

    安装前提: yum -y install docker-compose-plugin 安装: tar -zxvf harbor-offline-installer-v2.6.1.tgz cd harb ...

  10. 免费背景音人声分离解决方案MVSEP-MDX23,足以和Spleeter分庭抗礼

    在音视频领域,把已经发布的混音歌曲或者音频文件逆向分离一直是世界性的课题.音波混合的物理特性导致在没有原始工程文件的情况下,将其还原和分离是一件很有难度的事情. 言及背景音人声分离技术,就不能不提Sp ...