简单了解javascript对象的属性(一) —— 数据属性

        俗话说得好:“看事情不能看只表面”。日常生活中,我们如果处对象,除了看外貌,还得看内涵。这篇文章不会教你怎么找对象,但却能让你看清ECMAscript中对象的内在。

        ES中的对象有两种属性:数据属性访问器属性。今天我们只谈数据属性。

注:ES5之前,并没有什么直接检测属性特性的方法。

先上一段代码:

var Obj = { a:5 };    //我并不只是一个值,那是因为你不懂我。

        好了,大家看到了什么?没错,只是一个值。下面教你怎么看她的内在。

Object.getOwnPropertyDescriptor(Obj, "a" );

        此方法可得到对象的数据属性,传入两个参数:第一个是要查找的对象名;第二个是要查找的属性名。

输出结果如下:

configurable:可配置。

enumerable:可枚举。

writable:可写。

        以上三个属性取值为true或false。

value:属性值。

        现在你算是对她有一点了解了,下面几招教你如何获取她的芳心。


添加属性的方法:

        思考一下:你知道几种为对象添加属性和值的方法?

第一种:直接在创建的对象里面添加。如:var Obj = { a:5 };

第二种:通过点方法添加。如:Obj.a = 5;

第三种:通过Object.defineProperty()方法添加。此方法可以在添加属性的同时指定它的特性。

看代码:

var Obj = {};
Object.defineProperty( Obj, "a", {
    value: 5,
    writable: true,
    configurable: true,
    enumerable: true
});

        第一和第二种方法创建属性的方法一样。你可能会想,第三种方法要写那么多代码,还是前面两种靠谱。下面通过几个实例来看看是不是真的那样。

实例一:

var Obj1 = {};
Object.defineProperty( Obj1, "a", {
    value: 5,
    writable: false,    //注意,这里改了false了,意思是不可写。
    configurable: true,
    enumerable: true
});
var Obj2 = { a:5 };

        好,我们来修改一下它的值看看。

Obj1.a= 6;
console.log(Obj1.a);        //返回值:5
Obj2.a= 6;
console.log(Obj1.a);        //返回值:6

        对,这就是它的区别一。Obj2一点节操都没有,说变就变。还是Obj1可靠点,始终如一。


实例二:

var Obj1 = {};
Object.defineProperty( Obj1, "a", {
    value: 5,
    writable: true,
    configurable: false,        //注意,这里改了false了,意思是不可配置。
    enumerable: true
});
var Obj2 = { a:5};

        试试删除属性a看看。

delete Obj1.a;
console.log(Obj1.a);        //返回值:5
delete Obj2.a;
console.log(Obj2.a);        //返回值:undefined

        这就是区别二,configurable: false可以禁止删除属性。它还可以禁止通过defineProperty()修改属性的特性。

注意:属性如果设了不可配置,writable还是可以由true改为false,但不能由false改为true。


实例三:

var Obj1 = {};
Object.defineProperty( Obj1, "a", {
    value: 5,
    writable: true,
    configurable: true,
    enumerable: false        //注意,这里改了false了,意思是不可枚举。
});
var Obj2 = { a:5};

        试试通过for-in把属性打印出来。

for( i in Obj1 ){
    console.log( "Obj1[" + i +"]:" + Obj1[i] );
};        //无返回值
for( i in Obj2 ){
console.log( "Obj2[" + i +"]:" + Obj2[i] );
};        //返回值:Obj2[a]:5

        这就是区别三。for-in只能找到可枚举的属性。

        通过下面的方法,可以看到Obj2是有属性a的。

"a" in Obj2;//返回值:true

得注意的是,如果通过defineProperty()方法创建属性而不指定属性的特性,默认都为false。看看下面的代码:

var Obj = {};
Object.defineProperty( Obj,"a", {
    value: 5,
});

        通过console.log的输出结果:(在控制台上可以不打console.log)

       好了,现在应该知道怎么处对象了吧。


        最后,再送大家三个实用方法:

实例:

var Obj = {};
Object.defineProperty( Obj, "a", {
    value: 3,
    enumerable: true    //设为可枚举
});
Object.defineProperty( Obj, "b", {
    value: 4,
    enumerable: false    //设为不可枚举
});
Obj.propertyIsEnumerable("a");        //返回值:true
Obj.propertyIsEnumerable("b");        //返回值:false
Obj.propertyIsEnumerable("c");        //返回值:false

Object.keys(Obj);        //返回值:["a"]
Object.getOwnPropertyNames(Obj);     //返回值:["a", "b"]

propertyIsEnumerable():检查属性名是否存在于对象中(而不是原型链上),并且为可枚举。

Object.keys():返回一个数组,包含所有可枚举的属性。

Object.getOwnPropertyNames():返回一个数组,包含所有属性,不管是否可枚举。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 158,425评论 4 361
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 67,058评论 1 291
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 108,186评论 0 243
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 43,848评论 0 204
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,249评论 3 286
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,554评论 1 216
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,830评论 2 312
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,536评论 0 197
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,239评论 1 241
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,505评论 2 244
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,004评论 1 258
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,346评论 2 253
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 32,999评论 3 235
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,060评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,821评论 0 194
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,574评论 2 271
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,480评论 2 267

推荐阅读更多精彩内容