js 使用for...in...周遊對象時需要注意的一個問題：周遊時莫名其妙的多了屬性

前言

最近在做項目時遇到一個小問題：即在使用for…in…周遊對象的時候，突然發現對象莫名其妙的多了個屬性，這個屬性在聲明的時候是沒有的，後期也沒有為它添加屬性，但是究竟從何而來呢？經過一番調試之後找到原因，且看如下代碼：

Object.prototype.say = function(){
            alert('hello world!');
        }

        var obj = {
            name:'小明',
            sex:'男',
            year:'18'
        }

        for(var attr in obj){
            console.log(attr);//name sex year say
        }
           

顯而易見，for…in…周遊對象會周遊出對象的所有可枚舉的屬性，這非常值得注意，因為在多人協作開發項目的時候，很有可能你的同僚會在代碼裡Object.prototype.say來這麼一段或是引入的插件裡有那麼一句，然而你并不知道，就會發生一些意想不到的事情，讓你感到很詫異，調試了半天，原來是因為for…in…周遊莫名其妙的多了個屬性。

然而如何去解決這個問題呢？可以利用es5的Object.defineProperty方法為屬性添加限制，例子如下：

Object.defineProperty(Object.prototype,'say',{
            value:function(){
                alert('hello world!');
            },
            enumerable: false //讓say屬性不可枚舉，需設定enumerable屬性值為false
        });

        var obj = {
            name:'小明',
            sex:'男',
            year:'18'
        }

        for(var attr in obj){
            console.log(attr);//name sex year
        }
           

這是個值得注意的小問題，稍有不慎就會是以浪費很多時間，在此分享給大家。