ES6--变量私有化(对象代理)

1. ES3

    为了保护变量,我们应该将某些变量私有化,使它无法被直接操作。

    在ES3中,我们这样写:

    function Animal(){

    var data = { //这里不用this.name, this.sound,那么实例就无法直接操作name和sound了

        name: 'juju',

        sound: 'meow'

    };

  

    this.get = function(key){

        return data[key];

    }

    this.set = function(key, value){

        data[key] = value;

        }

    };

  var a = new Animal();

  a.get('sound');//meow

  a.set('food','human');

  a.get('food');//human


2. ES5

    var Animal = {

        name: 'juju',

        sound: 'meow'

    };

    Object.defineProperty(Animal, 'food', {

        writable: false,

         value: 'human'

});

将"food"设置writable为false即不可写。就保护了food不被改变。

 3. ES6

    var Animal={

        name:'juju',

        sound:'meow',

        food:'human'

};

var animal = new Proxy(Animal, {

    get(target, key){

        return target[key]

    },

    set(target,key,value){

        if(key !=='food'){

            target[key] = value;

            }

    }

})


animal.name; //juju

animal.sound;//meow

animal.food;//human


try{

    animal.food = 'fruit';//animal.food在set方法里面设置不能修改, 有的浏览器可能报错,本人的chrome并未报错

} catch(e){

}

animal.food;//human

猜你喜欢

转载自blog.csdn.net/qq_15241071/article/details/79953703