为javascript的JSON对象扩展forEach方法

最近发现javascript的JSON对象没有forEach这个方法,所以就自己动手扩展了一下,做个记录,方便以后使用。

1. Object prototype forEach

· 最初的代码

if (!Object.prototype.forEach) {
    Object.prototype.forEach = function(fn) {
        try {
            for (var key in this) {
                fn.call(this, this[key], key, this);
            }
        } catch (e) {
            throw new TypeError();
        }
    }
}

· 测试

var obj = {"a": 1,"b": 2};

obj.forEach(function(value, key, json){
    console.log(value, key, json);
    /*
    打印结果:
    1 "a" Object {a: 1, b: 2}
    2 "b" Object {a: 1, b: 2}
    function (fn) {
        try {
            for (var key in this) {
                fn.call(this, this[key], key, this);
            }
        } catch (e) {
            throw new TypeError();
        }
    } "forEach" Object {a: 1, b: 2}
    */
})

· 分析

以上测试结果,基本符合预期,不过有一个问题:在自定义方法的最后,把方法函数体本身也枚举出来了。为了解决这一问题,可以采用一个折中的办法:hasOwnProperty(),即确定某属性是否是对象本身的属性。


· 最终版(支持IE6+)

//  @support: IE6+, Firefox, Chrome

if (!Object.prototype.forEach) {
    Object.prototype.forEach = function(fn) {
        try {
            for (var key in this) {
                if (this.hasOwnProperty(key)) {
                    fn.call(this, this[key], key, this);
                }
            }
        } catch (e) {
            throw new TypeError();
        }
    }
}

· 测试

var obj = {"a": 1,"b": 2};

obj.forEach(function(value, key, json){
    console.log(value, key, json);
    /*
      打印结果:
      1 "a" Object {a: 1, b: 2}
      2 "b" Object {a: 1, b: 2}
     */
}

然后结果完全符合预期了,Oh,Yeah ! 但是对于处女座,你以为就酱紫结束了吗?NO NO NO.

So, 请接着往下看


2. ECMAScript 5 defineProperty

在新版本的ECMAScript 5中,可以设置自定义对象的方法为不可枚举。支持IE9以上,具体设置如下:

//  @support: IE9+, Firefox, Chrome

if (!Object.prototype.forEach) {
    Object.prototype.forEach = function(fn) {
        try {
            for (var key in this) {
                fn.call(this, this[key], key, this);
            }
        } catch (e) {
            throw new TypeError();
        }
    }
}
/***************************************************/
try {
    Object.defineProperty(Object.prototype, "forEach", {
        enumerable: false //是否可枚举?false
    });
} catch (e) {
    //throw new TypeError();
    console.log(e);
}

· 测试

var obj = {"a": 1,"b": 2};

obj.forEach(function(value, key, json){
    console.log(value, key, json);
    /**
     *  打印结果:
     *  1 "a" Object {a: 1, b: 2}
     *  2 "b" Object {a: 1, b: 2}
     */
}

以上就是全文,欢迎留言。同时感谢@jslang(天际的海浪)的指点。

  • 2
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值