长沙市天心区建设局网站,优速网站建设,wordpress猫咪主题,网站制作公司天强科技05_属性描述符 文章目录 05_属性描述符一、属性描述符是什么#xff1f;二、属性描述符①#xff1a;查看属性描述②#xff1a;设置属性描述符③#xff1a;案例01.代码实现02.代码实现#xff08;优化#xff09; 一、属性描述符是什么#xff1f; 属性描述符的结构 在…05_属性描述符 文章目录 05_属性描述符一、属性描述符是什么二、属性描述符①查看属性描述②设置属性描述符③案例01.代码实现02.代码实现优化 一、属性描述符是什么 属性描述符的结构 在定义对象、定义属性时我们曾经介绍过属性描述符属性描述符实际上就是一个对象。
属性描述符一共有 6 个可以选择使用。
value设置属性值默认值为 undefined。writable设置属性值是否可写默认值为 true。enumerable设置属性是否可枚举即是否允许使用 for/in 语句或 Object.keys( ) 函数遍历访问默认为 true。configurable设置是否可设置属性特性默认为 true。如果为 false将无法删除该属性不能够修改属性值也不能修改属性的属性描述符。get取值函数默认为 undefined。set存值函数默认为 undefined。
二、属性描述符
①查看属性描述
let obj {a: 1,b: 2
}let desc Object.getOwnPropertyDescriptor(obj, a);
console.log(desc)②设置属性描述符
let obj {a: 1,b: 2
}// 获取 属性描述符
let desc Object.getOwnPropertyDescriptor(obj, a);
console.log(desc)// 设置属性描述符
Object.defineProperty(obj, a,{value: 10,writable: false, // 不可从重写// enumerable: false, // 不可遍历// configurable: false // 不可修改属性描述符本身
})console.log(修改前a的值,obj.a)
obj.a 100
console.log(修改后a的值,obj.a) ③案例
01.代码实现 设置一个对象的属性只读不能修改 // 定义一个名为 aGoods 的对象表示商品信息
let aGoods {pic: .,title: ..,desc: ...,sellNumber: 1,favorRate: 2,price: 3
}// 定义一个名为 UIGoods 的类
class UIGoods {// 构造函数接收一个 goods 对象作为参数constructor(goods) {// 使用 Object.defineProperty 定义名为 data 的属性Object.defineProperty(this, data, {value: goods, // 设置属性的值为传入的 goods 对象writable: false, // 不可写即不能通过赋值修改属性的值configurable: false, // 不可配置即不能通过 delete 操作符删除属性})}
}
// 创建一个 UIGoods 类的实例传入 aGoods 对象作为参数
let goods new UIGoods(aGoods);
// 尝试修改 goods 实例的 data 属性的值
goods.data abc;
// 输出修改后的 goods 实例的 data 属性的值
console.log(goods.data); 问题刚刚我们已经实现了属性不能修改但是我们尝试修改没有修改成功也没有任何报错试想一下如果代码比较多的情况下我们可能也会忘记该属性不能修改当我们修改属性值后.......
02.代码实现优化
我们需要的效果是当属性设置不能修改后在尝试修改给出一个错误提示
// 定义一个名为 aGoods 的对象表示商品信息
let aGoods {pic: .,title: ..,desc: ...,sellNumber: 1,favorRate: 2,price: 3
}// 定义一个名为 UIGoods 的类
class UIGoods {// 构造函数接收一个 goods 对象作为参数constructor(goods) {// 使用 Object.defineProperty 定义名为 data 的属性Object.defineProperty(this, data, {configurable: false, // 不可配置即不能通过 delete 操作符删除属性get:function (){ // 取值函数return goods;},set: function (){ // 存值函数throw new Error(兄弟您正在尝试修改 data 属性这是不可能的死心吧)}})}
}
// 创建一个 UIGoods 类的实例传入 aGoods 对象作为参数
let goods new UIGoods(aGoods);
// 尝试修改 goods 实例的 data 属性的值
goods.data abc;
// 输出修改后的 goods 实例的 data 属性的值
console.log(goods.data);
