ES3、ES5、ES6分别给数据设置只读权限的方法
在某些业务逻辑中我们需要保护某些对象的数据为只读,这个时候我们可以根据es3,es5,es6使用以下几种方法来实现
ES3,ES5 数据保护,这里是使用了闭包的原理
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26
| { var Person = function() { var data = { name: 'es3', sex: 'male', age: 15 } this.get = function(key) { return data[key] } this.set = function(key, value) { if (key !== 'sex') { data[key] = value } } } var person = new Person(); console.table({name: person.get('name'), sex: person.get('sex'), age: person.get('age')}); person.set('name', 'es3-cname'); console.table({name: person.get('name'), sex: person.get('sex'), age: person.get('age')}); person.set('sex', 'female'); console.table({name: person.get('name'), sex: person.get('sex'), age: person.get('age')}); }
|
ES5 使用修改属性配置来做数据保护
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21
| { var Person = { name: 'es5', age: 15 };
Object.defineProperty(Person, 'sex', { writable: false, value: 'male' });
console.table({name: Person.name, age: Person.age, sex: Person.sex}); Person.name = 'es5-cname'; console.table({name: Person.name, age: Person.age, sex: Person.sex}); try { Person.sex = 'female'; console.table({name: Person.name, age: Person.age, sex: Person.sex}); } catch (e) { console.log(e); } }
|
ES6 使用Proxy代理做数据保护
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27
| { let Person = { name: 'es6', sex: 'male', age: 15 }; let person = new Proxy(Person, { get(target, key) { return target[key] }, set(target,key,value){ if(key!=='sex'){ target[key]=value; } } }); console.table({ name:person.name, sex:person.sex, age:person.age }); try { person.sex='female'; } catch (e) { console.log(e); } }
|
最后更新时间:
当前页访问次数 10