Object.defineProperty方法

javascript 文章 2022-07-20 15:20 535 0 全屏看文

AI助手支持GPT4.0

const person = { name: 'Lydia' }

Object.defineProperty(person, 'age', {
  value: 21,
})

console.log(person)
console.log(Object.keys(person))

输出结果

原因:

defineProperty方法提供给我们(getter)给对象添加一个新属性,或者通过(setter)修改已经存在的属性,当然上面的例子只涉及到最简单的修改。

const person = { name: 'Lydia' }
let number=21;
Object.defineProperty(person, 'age', {
//   value:21,
  enumerable:true, //控制属性是否可以枚举,默认值是false
  // writable:true, //控制属性是否可以被修改,默认值是false
  // configurable:true //控制属性是否可以被删除,默认值是false

  //当有人读取person的age属性时,get函数(getter)就会被调用,且返回值就是age的值
  get() {
    console.log('有人读取age属性了')
    return number
  },

  //当有人修改person的age属性时,set函数(setter)就会被调用,且会收到修改的具体值
  set(value) {
    number = value
  },
});

age属性会自动帮我们转为setter/getter,等我们真正需要或者修改,则会显示出对应的age属性

而在使用了该方法给对象添加一个属性后,属性便默认为 不可枚举 not enumerable

因此Object.keys方法仅返回对象中 可枚举 enumerable的属性,即代码中的name

添加属性改变Object.defineProperty方法的默认行为

之所以有以下的写法,也是为我们相比于添加的属性有更多的控制权

Object.defineProperty(person, 'age', {
  value:21,
  // enumerable:true, //控制属性是否可以枚举,默认值是false
  // writable:true, //控制属性是否可以被修改,默认值是false
  // configurable:true //控制属性是否可以被删除,默认值是false
})
-EOF-

AI助手支持GPT4.0


国内超级便宜服务器

摸鱼人热门新闻聚合

钻级赞助商 我要加入

开发者在线工具

第三方支付技术请加QQ群

相关文章
JS:元素的增删改查发、克隆
三叔博客双十一推服务器的弹出脚本
模拟Vue实现响应式数据
金额每三个数字用一个逗号分隔(正则表达式实现)
flv.js的追帧、断流重连及实时更新的直播优化方案
随便看看
怎么添加小程序支付功能? 4235
教育科技公司申请微信支付被拒绝? 4611
微信公众号免300认证教程 5684
小程序已经上线,作为管理员无法在小程序数据助手查看数据? 5090
小程序广告组件通过审核,但是小程序内没有显示广告? 4866
企业微信通讯录账号被管理员误/恶意删除,怎么办? 9275
问题? 8796
如何快速搭建抽奖助手小程序(无需代码知识) 5945
许涛 大哥在吗, 要解冻小程序的时候提示信息主体不一致, 能帮忙看下吗? 7238
小程序搜一搜全称搜索不显示 麻烦解决一下!谢谢 6566