JavaScript 操作对象属性(设置属性, setter/getter, 序列化)
参考自<<JavaScript权威指南 第6版>>, 文字太多反而不易理清其中的关系, 直接上代码和注释
/*
* 对象的setter和getter属性:
* 定义为一个或者两个和属性同名的函数, 这个函数不用function,而是使用get 或 set,
* 作用和java中的getter/setter很类似. 但是他们并不是函数,所以调用方式也比较特别.
*/
var demo = {
data: ,
get get_data(){
return this.data;
},
set set_data(data){
this.data = data;
}
};
console.log(demo.get_data);
demo.set_data = ;
console.log(demo.get_data); //ECMScript 5 中定义了对象 propertyDescriptor 对象, 用来实现属性特性的查询和设置操作.
console.log(Object.getOwnPropertyDescriptor({x:},"x")); // 查询自有属性描述符 /*
* Object.defineProperty():为已存在的对象添加自有属性或者修改自有属性,但是不能修改继承属性.
* 如果需要同时修改多个属性, 则需要使用Object.defineProperties().
*/ /* js 代码默认创建的对象是: 可读,可写,可配置,可枚举的和可扩展的
* 可扩展指: 可以添加新属性.
* 判断方式: Object.isExtensible(obj);
* 禁止方式: Object.preventExtensions(obj);
*/
//为obj对象添加一个不可枚举的变量x, 所以输出的是{}
var obj = {};
Object.defineProperty(obj,"x",{value:, writable:true,enumerable:false, configurable:true});
console.log(obj); //"{}"
console.log("x" in obj);//"true", 属性x是存在的
Object.defineProperty(obj,"x",{writable:false});
obj.x = ; // 不会报错, 但是什么都不会做.在严格模式中抛出 TypeError
console.log(obj.x); //输出: 1, 没有被改变
//通过配置来修改属性x
Object.defineProperty(obj,"x",{value:}); // 修改x的值, 直接修改不可以,通过配置修改就ok
console.log(obj.x);//输出: 2
Object.defineProperty(obj,"x",{get:function(){return ;} }); // 修改属性x为一个存取器
console.log(obj.x); // 输出: 100
/*
* Object.defineProperties()直接为要修改的对象添加3个属性, 然后返回到新对象r
*/
var t = {s:};
var p = Object.defineProperties(t,{
x:{value:,writable:true,enumerable:true,configurable:true},
y:{value:,writable:true,enumerable:true,configurable:true},
r:{
get: function(){
return Math.sqrt(this.x * this.x + this.y * this.y);
},
enumerable:true,
configurable:true
}
});
console.log(p); // { s: 100, x: 1, y: 1, r: [Getter] }
console.log(p.r); //1.4142135623730951
console.log(t); //{ s: 100, x: 1, y: 1, r: [Getter] } 原来的对象t也被修改了, 和p对象一样 /*
* 使用js自带的extend()函数只能简单复制属性名和值,不能复制属性的特性和getter/setter(简单地转换为静态的数据属性),
* 下面进行深拷贝.
*/
Object.defineProperty(Object.prototype,
"extend", //定义Object.prototype.extend
{
writable:true,
enumerable:false,
configurable:true,
value:function(obj){
var names = Object.getOwnPropertyNames(obj); //得到所有的自有属性
for(var i=;i<names.length;++i){
if(names[i] in this)
continue; //跳过已有属性
var desc = Object.getOwnPropertyDescriptor(obj,names[i]);
Object.defineProperty(this,names[i],desc); // 复制属性和属性的配置.
}
}
}); var r ={};
r.extend(p);
console.log(r); //复制了p的属性和属性配置.
console.log(Object.getOwnPropertyDescriptor(r,"x")); /*设置对象的可扩展性:
* - 对象转换为不可扩展后就无法转成可扩展了.
* - preventExtensions 只影响对象本身, 原型链上新加入的属性也会加入到不可扩展的对象上.
*更多方法: Object.seal()/Object.isSealed(), Object.freeze()/Object.isFreeze()
*/
console.log(Object.isExtensible(r)); //"true"
Object.preventExtensions(r);
console.log(Object.isExtensible(r)); //"false" /*
* 对象的序列化
* - JSON.stringify() 序列化对象可枚举的自有属性.
* - JSON.parse() 还原js对象
*/
var obj = {x:,y:{
z:[false,null,""]
}};
var s = JSON.stringify(obj);
var t = JSON.parse(s); //t 是 s 的深拷贝
console.log(s);
console.log(t);
-->
JavaScript 操作对象属性(设置属性, setter/getter, 序列化)的更多相关文章
- 自定义类属性设置及setter、getter方法的内部实现
属性是可以说是面向对象语言中封装的一个体现,在自定义类中设置属性就相当于定义了一个私有变量.设置器(setter方法)以及访问器(getter方法),其中无论是变量的定义,方法的声明和实现都是系统自动 ...
- javascript操作html元素CSS属性
下面先记录一下JS控制CSS所使用的方法. 1.使用javascript更改某个css class的属性... <style type="text/css"> .ori ...
- 遍历JavaScript某个对象所有的属性名称和值
/* * 用来遍历指定对象所有的属性名称和值 * obj 需要遍历的对象 */ function allPrpos(obj) { // 用来保存所有的属性名称和值 var props = " ...
- javascript Date对象 之 设置时间
之前对js的date对象总是感觉熟悉,而不愿细细深究其所以然,所以每当自己真正应用起来的时候,总会糊里糊涂的,今日花费2个小时的时间仔细钻研了一下,感觉 豁然开朗,故,以此记录,一来 供以后查阅,二来 ...
- javascript中对象访问自身属性的方式
在javascript中,通过对象的方法访问对象自身属性时,必须采用this.fieldName的方式. 原因是javascript中Function是无状态的,访问对象的属性时,必须指定当前的上下文 ...
- JavaScript检测对象的类属性
function classof(o) { if(o === null) { return "Null"; } if(o === undefined) { return " ...
- javascript获取对象中的属性及值
function displayProp(obj){ var names=""; for(var name in obj){ names+=name+": "+ ...
- javascript操作对象的方法
with 确定某个对象的作用区域,在with代码段内的次对象的属性或方法可以直接使用. 例: //比如stu中有name,age属性和walk方法 with(stu) { alert(name+&qu ...
- JQuery 操作对象的属性值
通过JQuery去操作前台对象(div,span...)的属性是很常见的事情,本文就简单的介绍几种操作情形. 1):通过属性值去获取对象 2):用JQuery去修改对象的属性值 3):获取并修改对象的 ...
随机推荐
- Oracle密码中含有特殊字符时exp,imp的使用
今天通过exp迁移Oracle 数据,由于密码含有很有很多特殊字符,弄了好久,都没成功,后发在网上找到方法. 1 exp用法Linux 下(密码用一对双引号, 整体userid用对单引号括住)exp ...
- 在linux下利用nohup来后台运行java程序
nohup java -jar /etc/deny/denyHttp_fat.jar & http://limaoyuan.iteye.com/blog/900928 http://zshou ...
- 异步编程 In .NET(转载)
概述 在之前写的一篇关于async和await的前世今生的文章之后,大家似乎在async和await提高网站处理能力方面还有一些疑问,博客园本身也做了不少的尝试.今天我们再来回答一下这个问题,同时我们 ...
- (5)函数式接口的简单使用之Predicate
我们经常操作List,例如现在有一个功能要求在所有人中筛选出年龄在20岁以上的人. public class MyTest { private final List<Person> ...
- popup控件代码示例
1.jsp页面input框中的代码 <td class="value"> <input name="demos[0].id" type=&qu ...
- linux Posix 信号量 二
一.Posix信号量 1.Posix信号量分为两种: 1. 有名信号量:使用Posix IPC名字标识(有名信号量总是既可用于线程间的同步,又可以用于进程间的同步) 2. 内存信号量:存放在共 ...
- mysql-6正则表达式
mysql正则表达式 匹配的两种方式: 1.模糊匹配:like 2.正则表达式 正则表达式语法: 语法 说明 ^ 起始位置.如果设置了RegExp对象的Multiline属性,^也匹配'\n'或'\r ...
- SpringAOP的两种实现方式
1.SpringAOP,面向切面编程.在实际应用汇总很常见,一般用于日志.异常保存.也可以针对于相应的业务做处理 AOP核心概念 1.横切关注点 对哪些方法进行拦截,拦截后怎么处理,这些关注点称之为横 ...
- Vue 获取数据、事件对象、todolist
vue中在方法里获取data里的msg:this.msg 在微信小程序里this.data.msg 改变data里的msg:this.msg="改变后的msg" 可以通过list. ...
- usaco 2009 12 过路费
最近学的图论,oj上的这道题卡了我一上午,写一下总结. 题目描述: 跟所有人一样,农夫约翰以着宁教我负天下牛,休教天下牛负我(原文:宁我负人,休教人负我)的伟大精神,日日夜夜苦思生财之道.为了发财,他 ...