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):获取并修改对象的 ...
随机推荐
- [Luogu4609][FJOI2016]建筑师
luogu description 一个\(1...n\)的排列,其前缀最大值有\(A\)个,后缀最大值有\(B\)个,求满足要求的排列数. 一个位置\(i\)满足前缀最大当且仅当不存在\(j< ...
- html模拟组织架构横向展开
近期看到不少人有相似的需求.实现组织架构的横向展开,显示.无聊就做了一下.先看下终于的效果图 兼容各大主流浏览器,而且支持IE6.7,8,不同的是排除标签圆角效果外,资源文件:文件下载地址 主流浏览器 ...
- 基于ffmpeg静态库的应用开发
最近几天在试着做基本ffmpeg静态库的开发,只有main中包含了avdevice_register_all 或avfilter_register_all,编译就通不过,undefined refre ...
- moodle搭建相关的笔记
关于moodle内网外网访问问题的解决方案(转) http://blog.chinaunix.net/uid-656828-id-3106027.html
- 冒泡排序算法-Python实现
#-*- coding: UTF-8 -*- import numpy as np def BubbleSort(a): for i in xrange(0, a.size): for j in xr ...
- /etc/sysctl.conf参数解释(转)
来自<深入理解Nginx模块开发与架构解析> P9 #表示进程(例如一个worker进程)可能同时打开的最大句柄数,直接限制最大并发连接数fs.file max = 999999 #1代表 ...
- Django Admin定制
Django内置的Admin是对于model中对应的数据表进行增删改查提供的组件,使用方式有: 依赖APP: django.contrib.auth django.contrib.contenttyp ...
- 异步FIFO中空满信号如何产生?
异步FIFO中,空满信号该如何产生呢? 在复位的时候,读指针和写指针相等,读空信号有效(这里所说的指针其实就是读地址.写地址)当读指针赶上写指针的时候,写指针等于读指针意味着最后一个数据被读完,此时读 ...
- 添加APP右上角数字提醒标识
mui.plusReady(function() { plus.nativeUI.closeWaiting(); mui.currentWebview.show(); //1.设置app右上角数字提醒 ...
- 删除TFS项目上的文件
1.用vs(版本)开发人员命令提示输入命令进行删除 1.