object.defineProperty
1、object.defineProperty
给一个对象定义一个新的属性或者在修改一个对象现有的属性,并返回这个对象 语法: Object.defineProperty(参数1,参数2,参数3) 参数1:目标对象 参数2:要修改或者添加的属性名称 参数3:目标对象属性的一些特征 (是一个对象) 参数1: value:属性值 参数2: writable:对象属性值是否可以被修改 true允许 false不允许 参数3: configurable:对象属性是否可以被删除 true允许 false不允许 参数4: enumerable:对象属性是否可被枚举 参数5: get():给一个属性提供getter方法,当访问这个对象的属性值得时候触发该方法 参数6: set():给一个属性提供setter方法,当设置属性值得时候触发该方法
2、valuevar obj = {}; Object.defineProperty(obj,"name",{value:"张三" })Object.defineProperty(obj,"age",{value:"28" })console.log(obj)
3、writable
var obj = {}; Object.defineProperty(obj,"name",{value:"张三",writable:false//当设置为false的时候当前对象的属性值不允许被修改 })obj.name="李四" console.log(obj.name)//张三var obj = {}; Object.defineProperty(obj,"name",{value:"张三",writable:true//当设置为true的时候当前对象的属性值允许被修改 })obj.name="李四" console.log(obj.name)//李四
4、configurable
var obj = {}; Object.defineProperty(obj,"name",{value:"张三",configurable:false//当设置为false的时候对象的属性不允许被删除 })delete obj.name;console.log(obj.name)//张三var obj = {}; Object.defineProperty(obj,"name",{value:"张三",configurable:true//当设置为true的时候对象的属性允许被删除 })delete obj.name;console.log(obj.name)//undefined
5、enumerable
var obj = {name:"张三",age:"李四"}Object.defineProperty(obj,"name",{enumerable:false//当设置为false的时候对象的属性不可被枚举 })Object.defineProperty(obj,"age",{enumerable:false })console.log(Object.keys(obj))//[]var obj = {name:"张三",age:"李四"}Object.defineProperty(obj,"name",{enumerable:true//当设置为true的时候对象的属性可被枚举 })Object.defineProperty(obj,"age",{enumerable:true })console.log(Object.keys(obj))//["name",age]
6、for in && Object.keys()的区别
//for in 与Object.keys()的区别 function Person(name,age){this.name = name;this.age = age; } Person.prototype = {sex:"男" }var man = new Person("张三",18);console.log(Object.keys(man));//["name","age"]for(var key in man){console.log(key);//name age sex }
var obj = {name:"张三"}Object.defineProperty(obj,"name",{get(){console.log("被访问了")//当被访问的时候会触发get()方法},set(newVal){console.log("被设置了"+newVal)//当被设置的时候会触发set()方法} }) obj.name//输出:被访问了 obj.name="李四";//输出:被设置了李四
转载于:https://www.cnblogs.com/xiaoniaohhl/p/11093613.html
object.defineProperty相关推荐
- Object.defineProperty()
let obj = {}; let song = '发如雪'; obj.singer = '周杰伦'; Object.defineProperty(obj, 'music', { // 1. valu ...
- Vue、angular等框架实现双向绑定的原理,核心机制是使用了Object.defineProperty
<div id="name"></div> var obj = {};Object.defineProperty(obj, "name" ...
- 对javscript中Object.defineProperty的理解
自己在使用vue的过程中经常会用到听到数据双向绑定这个词,而且我们还可以直接通过调用this.msg(this表示vue实例),来获取data上的数据,以前一直不太明白为什么可以这样获取,直到有一 ...
- vue 数据绑定实现的核心 Object.defineProperty()
vue深入响应式原理 现在是时候深入一下了!Vue 最独特的特性之一,是其非侵入性的响应式系统.数据模型仅仅是普通的 JavaScript 对象.而当你修改它们时,视图会进行更新.这使得状态管理非常简 ...
- Object.defineProperty的理解
一.Object.defineProperty:给一个对象定义一个新的属性或修改一个对象现有的属性,并且返回这个对象 1.语法:Object.defineProperty(参数1,参数2,参数3) 参 ...
- vue中实现双向数据绑定原理,使用了Object.defineproperty()方法,方法简单
在vue中双向数据绑定原理,我们一般都是用v-model来实现的 ,但一般在面试话会问到其实现的原理, 方法比较简单,就是利用了es5中的一个方法.Object.defineproperty(),它有 ...
- Object.defineProperty()方法的用法详解
Object.defineProperty()函数是给对象设置属性的. Object.defineProperty(object, propertyname, descriptor); 一共有三个参数 ...
- Object.defineProperty与双向绑定、数据监听
一.对象赋值的两种方式 一是"="赋值,一是Object.defineProperty方法,而当下流行框架中广泛应用的双向绑定和数据监听等,就是利用的第二种方式,关于此方法不多讲, ...
- Object.defineProperty方法
Object.defineProperty() (一次添加/修改一个属性) 用法:Object.defineProperty(obj, prop, descriptor) 方法会直接在一个对象上定义一 ...
- 基于Object.defineProperty实现双向数据绑定
双向数据绑定可算是前端领域经久不衰的热词,不管是前端开发还是面试都会有所涉及.而且不同的框架也想尽一切办法去实现这一特性,比如: Knockout / Backbone --- 发布-订阅模式 Ang ...
最新文章
- idea 整合SSM(spring spring-mvc mybatis)
- android画一个圆形图片组件
- ThreadLocal 中的ThreadLocalMap
- selenium自动向下滚动页面,并指定最大滑动距离
- input只改变光标的颜色 不改变字的颜色
- 华为 EC169 3G上网卡在MacPro中的使用
- python九九乘法表矩形_用Python实现九九乘法表
- numpy和pandas的参考手册
- x61 linux 驱动 无线网卡,联想thinkpadx61无线网卡驱动下载-联想x61无线网卡驱动 win7官方版 - 极光下载站...
- 计算机主板设置中的英语,技嘉主板bios设置教程,技嘉主板bios中英文对照表
- 测试内存条是否兼容软件,内存条不兼容有什么表现
- nagios监控系统环境部署安装(LAMP环境)
- wps单独文档无法连接服务器,为什么wps没有云服务器
- yocto 更新补丁方法
- 怎样引流推广?一文讲透引流的核心秘密
- java里getter和setter的作用和区别是什么?
- 前端实现页面变灰功能(含 Flutter )
- 小李的电商日记 22.10.14
- ssd用HD软件测试准确吗,用HDTune测试固态硬盘?只有菜鸟才会这样做!
- SE01(理解重要)
热门文章
- Java方法重载与方法重写
- Java未被捕获的异常
- php fpm listen.owner,php-fpm配置解释
- JZOJ 5434. 【NOIP2017提高A组集训10.30】Matrix
- JZOJ 100046. 【NOIP2017提高A组模拟7.14】收集卡片
- abaqus linux 下载64位,SIMULIA ABAQUS 2016.0 Win64 Linux64 2DVD工程模拟的有限元
- Qt 数据库操作(二)
- 百度2019暑期实习计算机视觉岗位笔试题
- 谁拿了最多奖学金pascal程序
- 【学习笔记】有向无环图上的DP