JS 闭包 BUG

C.js代码:

/**
 * 有BUG
 */

(function (global) {
    var _id;
     _map;
     _length;

    global.C =  () {
        _map = {};
        _length = 0;
    };

    global.C.prototype = {
        setId:  (id) {
            _id = id;
        },getId:  () {
            return _id;
        },put:  (key,value) {
            if (!_map.hasOwnProperty(key)) {
                _length++;
            }
            _map[key] = value;
        },get:  (key) {
            if (_map.hasOwnProperty(key)) {
                 _map[key];
            }
            return null;
        },};

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

})(window);
View Code

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

D.js代码:

*
 * 无BUG
  (global) {

    global.D =  () {
        this._map = {};
        this._length = 0;
    };

    global.D.prototype = (id) {
            this._id =this._id;
        },1)">._map.hasOwnProperty(key)) {
                this._length++;
            }
            this._map[key] =if (._map[key];
            }
             global.D;

})(window);
View Code

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");

         log(msg) {
            div.append(msg + " ");
        }

         logLine(msg) {
            div.append(msg + "<br />"//测试
         test() {
            var c1 = new C();
            var c2 = var d1 =  D();
            var d2 =  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",1)">);
            d2.put("key1",1)">);

            logLine(c1.get("key1"));
            logLine(c2.get("key1"));
            logLine(d1.get("key1"));
            logLine(d2.get("key1"));
        }

    </script>
</body>
</html>
View Code

测试截图:

 

 

相关文章

1.第一步 设置响应头 header(&#39;Access-Control-Allow...
$.inArray()方法介绍 $.inArray()函数用于在数组中搜索指定的...
jquery.serializejson.min.js的妙用 关于这个jquery.seriali...
JS 将form表单数据快速转化为object对象(json对象) jaymou...
jQuery插件之jquery.spinner数字智能增减插件 参考地址:http...