Object.defineProperty和Object.defineProperties
'use strict';
(function(){
if(!Object.defineProperty){
console.log('浏览器不支持defineProperty');
return;
} var person = {}; //向person添加name属性和它的访问器
Object.defineProperty(person, 'name', {
set : function(n){
console.log('set 访问器');
this.nameValue = n; //一个新的属性,如果同样是name的话,就死循环了。
},
get : function(){
console.log('get 访问器');
return 'my name is ' + this.nameValue;
},
//value : 'jeck', //如果在这里有value或writable特性,就会报错:Uncaught TypeError: Invalid property. A property cannot both have accessors and be writable or have a value。
enumerable: true,
configurable: true
});
person.name = "haha"; //触发set访问器
console.log(person.name); //触发get访问器 output: my name is haha
console.log(person.nameValue); //output: haha //向person添加id数据属性。
Object.defineProperty(person, 'id', {
value : '1234567890',
writable : false,
enumerable : false,
configurable : false
});
console.log(person.id); //output: 1234567890
//person.id = '0987654321'; //报错,因为id是只读的,不可写。 //列出对象的属性
var propertyNames = Object.getOwnPropertyNames(person);
for(var i = 0, len = propertyNames.length; i < len; i++){
var name = propertyNames[i]
console.log(name + ': ' + person[name]);
}
/*output:
name: my name is haha
nameValue: haha
id: 1234567890*/ //列出某一属性的所有特性。
var descriptor = Object.getOwnPropertyDescriptor(person, 'id');
descriptor.writable = true;//这里将原来的writable特性改为了true。
for(var prop in descriptor){
console.log(prop + ': ' + descriptor[prop]);
}
/*output:
value: 1234567890
writable: true
enumerable: false
configurable: false*/ //defineProperty的复数版:
Object.defineProperties(person, {
sex : {
value : 'boy',
writable : true,
enumerable : false,
configurable : true
},
age : {
set : function(x){
this.ageValue = x;
},
get : function(){
return this.ageValue;
}
}
}); person.sex = 'girl'; //变性成功!
person.age = 23; console.log('sex: ' + person.sex);
console.log('age: ' + person.age);
/*output:
sex: girl
age: 23*/
})();
Object.defineProperty和Object.defineProperties的更多相关文章
- 对象是否拥有某个属性,in和for in以及object.hasOwnProperty('×××')的异同,以及Object.defineProperty(),Object.keys(),Object.getOwnPropertyNames()的用法
1.在某个对象是否拥有某个属性,判断的方法有很多,常用的方法就是object.hasOwnProperty('×××'),这个方法是不包括对象原型链上的方法的,举个例子: var obj = { na ...
- Object.defineProperty和Object.freeze、Object.seal
目录 一 Object.defineProperty 1.1 用法 1.2 数据描述 1.2.1 value 1.2.2 writable 1.2.3 enumerable 1.2.4 configu ...
- MVVM双向绑定实现之Object.defineProperty
随着web应用的发展,直接操作dom的应用已渐行渐远,取而代之的是时下越来越流行的MVVM框架,dom操作几乎绝迹,这里面自然是框架底层封装的结果.MVVM框架的双向数据绑定使开发效率大大提高:然后在 ...
- 关于Object.defineProperty 的基础知识
Object.defineProperty 这个方法大家耳熟能详,可以对 对象的属性进行添加或修改的操作.即可以进行 数据劫持 .vue就是通过这个方法来劫持数据的. 平时我们创建对象的时候,一般通 ...
- Object.defineProperty实现数据绑定
1.Object.defineProperty方法 Object.defineProperty(obj, prop, descriptor); (1)参数: obj:目标对象 prop:需要定义的属 ...
- vue实现双向数据绑定之Object.defineProperty()篇
前言 vue.js中使用ES5的Object.defineProperty()实现数据的双向绑定 Object.defineProperty()原理 Object.defineProperty()可以 ...
- JS属性描述符之Object.defineProperty()定义对象属性特性
一.Object.defineProperty的作用 用来给对象新增属性,和修改对象中的属性. 二.JS对象中的描述符 js对象中两种属性描述符:数据描述符和存取描述符(访问描述符). 注意事项: 1 ...
- Object.defineProperty和proxy
Object.defineProperty问题 Object.defineProperty() 无法监控到数组下标的变化.vue只能通过以下几种方法来监听 pop() shift() unshift( ...
- js中的Object.defineProperty()和defineProperties()详解
ECMAS-262第5版在定义只有内部采用的特性时,提供了描述了属性特征的几种属性.ECMAScript对象中目前存在的属性描述符主要有两种,数据描述符(数据属性)和存取描述符(访问器属性),数据描述 ...
随机推荐
- 开源的PaaS方案:在OpenStack上部署CloudFoundry (三)部署BOSH
BOSH是CloudFoundry提供的用来安装部署和升级CloudFoundry的自动化工具,可是说是CloudFoundry的一部分.总体来说,BOSH是Client/Server结构, BOSH ...
- 【BZOJ2329/2209】[HNOI2011]括号修复/[Jsoi2011]括号序列 Splay
[BZOJ2329/2209][HNOI2011]括号修复/[Jsoi2011]括号序列 题解:我们的Splay每个节点维护如下东西:左边有多少多余的右括号,右边有多少多余的左括号,同时为了反转操作, ...
- highmaps如何自定义 区间的颜色刻度
https://api.highcharts.com/highmaps/colorAxis.dataClassColor http://jsfiddle.net/gh/get/library/pure ...
- jvm原理之内存机制
转自:https://www.cnblogs.com/dreamowneryong/p/6381633.html JVM栈由堆.方法区,栈.本地方法栈.程序计数器等部分组成,结构图如下所示: 还有一张 ...
- 详解Go语言中的屏蔽现象
在刚开始学习Go语言的过程中,难免会遇到一些问题,尤其是从其他语言转向Go开发的人员,面对语法及其内部实现的差异,在使用Go开发时也避免不了会踩"坑".本文主要针对Go设计中的屏蔽 ...
- 微信小程序 --- 绘画
cavans及context详解 绘画API的使用 游戏的制作
- Jquery Uploadify使用参数详解
开始上传 $('#uploadify_1').uploadifyUpload(); 1 uploader uploadify.swf文件的相对路径,该swf文件是一个带有文字BROWSE的按钮,点击 ...
- 原来css可以直接覆盖内联style
今天阅读博文新手如何在gdb中存活时,发现行距太小,阅读起来不舒服. 查看了一下html代码,发现是博文内容中的内联style(line-height: normal)覆盖了博客模板的css引起的. ...
- Educational Codeforces Round 28
A. Curriculum Vitae 题目链接:http://codeforces.com/contest/846/problem/A 题目意思:给你一个只包含0-1的数组,现在要求去可以去掉一些元 ...
- Oracle安装部署之RAC安装环境配置脚本
#!/bin/bash#Usage:Log on as the superuser('root'),and then execute the command:#./1preusers.sh group ...