数据属性与访问器属性
- 1.对象属性的作用主要是数据的存储
- 2.既然数据存在存储，则会有增删改查相关操作（增加属性，修改属性值，获取属性值，删除属性）
- 3.数据属性用于控制属性的增删改查特征
4.访问属性用于监听属性的存储过程，可以限制属性的行为（限制属性的读写，实现对象观察者模式，M与V双向绑定等）
- 1.2-访问器属性
1.1-数据属性
/** 数据属性 */
//1.我们默认的对象属性是数据属性
var person = {
name:"张三",
age : 18,
address:'zlswgy'
};
console.log(person);
// console.log(person);//{ name: '张三', age: 18, address: 'zlswgy' }
//2.数据属性有四个特征值描述他们的行为，这四个特性默认情况下可以理解为都是true
//(1)configurable:true 能够删除 (不可逆操作)
//(2)enumerable:true 能否遍历 for-in循环，以及对象获取
//(3)writable:true 能够修改
//(4)value:undefined 指定属性读写的位置 读从哪个位置读 写在哪里
// //3.要想修改这四个特征，可以用ES5的Object.defineProperty()方法
// //第一个参数：哪个对象 第二个参数：这个对象哪个属性（字符串） 第三个参数：描述符对象（四个行为特征）
// //3.1 设置person对象的name属性无法被删除,无法再修改其他任何特征
Object.defineProperty(person,"name",{
configurable : false//person的name属性不能被删除
})
//3.1.1 configurable修改是不可逆的 一旦改为false，再修改为true会报错
//这行代码运行会报错
// Object.defineProperty(person,"name",{
// configurable:true//person对象的name属性不能被删除
// });
person.name = '李四';
delete person.name;//删除name属性无效
console.log(person);//{ name: '李四', age: 18, address: 'zlswgy' }
// //3.2 设置person对象的address属性无法被遍历获取
Object.defineProperty(person,"address",{
enumerable:false//person对象的address属性不能被forin循环遍历获取,打印对象时也看不到
});
for(key in person){
console.log(person[key]);//李四 18
}
console.log(person);//{ name: '李四', age: 18 } 直接打印对象的address属性也是无法获取的
console.log(person.address);//zlswgy
// //3.3 设置person的age属性无法被修改
Object.defineProperty(person,"age",{
writable:false//person对象的age属性不能被修改
});
person.age = 20;
console.log(person);//{ name: '李四', age: 18 }
Object.defineProperty(person,"age",{
value:"6666"//设置age属性的值为6666，虽然age属性不能用属性赋值方式修改但是可以用vaule特征来修改
});
person.age = 22;
console.log(person);
1.2-访问器属性
/** 访问器属性 */
/*访问器属性除了对象属性固有的四个特征值之外，还添加了两个监听函数get与set
当对属性取值时，会调用get函数，得到的就是get函数中return的值
当对对象赋值时会调用set函数，该函数有一个默认形参用于接收赋值的实参
*/
// /*特点
// 1.如果单独get，表示该属性只可访问不可重写
// 2.在get和set中使用this会导致无限递归，内存溢出
// * 通常我们给对象添加一个带下划线的数据属性名用于存储，然后通过不带下划线来获取
// 3.访问器属性和数据属性value不能同时定义，也不能多次定义，两者只可定义一种
// */
var student = {
name : "老铁",
_age : 18
}
// //1.如果单独get，表示该属性只可访问不可重写
// Object.defineProperty(student,"age",{
// get : function(){
// console.log('1');
// return this._age;//不能使用this.age会导致循环递归，内存溢出
// }
// })
// student.age = 11;
// console.log(student.age);//18
// //2.同时实现get与set保护数据的隐私性:
// //例如将_age的数据类型改为字符串，而通过属性访问age的时候得到的是number,赋值的时候确保age这个属性具有真实性（人的年龄不可能小于0）
var people = {
name:"hm",
_age:"18"
}
Object.defineProperty(people,"age",{
get : function(){
console.log('有人想要读取我的值');
return parseInt(this._age);//访问时得到真实的数据类型number
},
set : function(newValue){
console.log('外部赋值时的传参' + newValue);
if(newValue > 0 && newValue < 100){//赋值时只有年龄在0-100之间才可以赋值
this._age = String(newValue);//转为字符串存储，保证数据隐私性
}
}
})
console.log(people);//{ name: 'hm', _age: '18' }
console.log(people._age,typeof people._age);//18 string
console.log(people.age,typeof people.age);//18 number
people.age = 111;//此数字超出上限 设置无效
console.log(people._age);//18
console.log(people.age);//18
people.age = 88;//此数字在范围内 有效
console.log(people._age,typeof people._age);//88 string
console.log(people.age,typeof people.age);//88 number