对象-Object

一、对象的简单操作

(一)对象的建立

1.通过var建立

    var person={
            name:'大青',
            sex:'female',
            age:16,
    };

2.通过function建立

    function PersonInfo(name,sex,age){
            this.name=name;
            this.sex=sex;
            this.age=age;
        }
        var person=new PersonInfo('daqing','female',16);

注意:必须在PersonInfo前面加new

(二)对象的读取

1.直接读取

person.name或者Person['name']

2.通过其它赋值读取

    key='name';
    person[key]

此时用person.key读取是错误的

(三)对象属性的添加

person.addr='北京';
或者person['addr']='北京';

(四)对象属性的修改

person.addr='Beijing';
或者person.['addr']='Beijing';

(五)对象属性的删除

delete person.addr;
或者delete person['addr'];

(六)通过for/in遍历属性

for(x in person){
            document.write(x+' : '+person[x]+'<br />');
        }

结果为:

name : 大青
sex : female
age : 16

(七)对象中添加方法

var person={
            sayhi:function(){
                return 'hello,world!';
            },
        };
        document.write(person.sayhi()+'<br />');

结果为:

hello,world!

(八)对象方法内的属性自调用

var person={
            name:'大青',
            sex:'female',
            age:16,
            sayhi:function(){
                return 'hello,world!';
            },
            info:function(){
                return 'name: '+this.name+'<br />'+'sex: '+this.sex
            }
        };
        document.write(person.info()+'<br />');

结果为:

name: 大青
sex: female

二、对象的属性

(一)对象的原型

一般来讲,每个对象都有原型,对象的原型也是一个对象,对象可从对象的原型那里继承属性与方法,类似于Python中类的继承。例如:

function foo(){};
foo.prototype.z=3;
var obj=new foo();
document.write(obj.z+'<br />');

结果为:

3

obj自身没有属性z,但是obj继承foo()的原型(foo.prototype)的z属性。
原型的继承关系如下:obj==>foo.prototype==>Object.prototype==>null。注:Object对象是所有对象的父级对象。
若此时直接在obj上设置z属性,则obj.z访问的就是对象本身的属性,不是对象原型的属性,如:

function foo(){};
foo.prototype.z=3;
var obj=new foo();
document.write(obj.z+'<br />');
obj.z=5;
document.write(obj.z+'<br />');

结果为:

5

(二)检查对象是否有某属性

1.可用下面的方法,检查对象是否具有某属性:

'属性名' in obj

例如:

document.write('z' in obj);

结果为:

true

注意:若对象本身没有某属性,但对象的原型(或对象原型的原型...)拥有该属性,用此种方式判断,则结果仍然为true。例如:

function foo(){};
foo.prototype.z=3;
var obj=new foo();
document.write(('z' in obj)+'<br />');
document.write(('toString' in obj)+'<br />');

结果为:

true
true

2.若只想检测对象本身是否具有某属性,可使用hasOwnProperty方法,例如:

function foo(){};
foo.prototype.z=3;
var obj=new foo();
obj.x=1;
document.write(obj.hasOwnProperty('x')+'<br />');
document.write(obj.hasOwnProperty('z')+'<br />');
document.write(obj.hasOwnProperty('toString')+'<br />');

结果为:

true
false
false

因此,对于如下代码:

var obj=Object.create({x:1});
document.write(obj.hasOwnProperty('x')+'<br />');
document.write(('x' in obj)+'<br />');

结果为:

false
true

即可分析得出:通过Object.create()方法创建的对象,x不是obj本身的属性,而是obj原型的属性。

3.propertyIsEnumerable()方法
检测属性是否属于对象,若返回true,需要满足以下两个条件:

  • 属性属于实例,不属于原型;
  • 属性必须可枚举,即可用for...in循环遍历;

例如:

function Foo(){};
Foo.prototype.z=3;
var obj=new Foo();
obj.x=1;
document.write(obj.propertyIsEnumerable('x')+'<br />');
document.write(obj.propertyIsEnumerable('z')+'<br />');

输出为:

true
false

4.Object.getOwnPropertyNames()或Object.keys()
返回一个指定对象的所有自身属性的属性名组成的数组,区别是Object.getOwnPropertyNames()返回的属性包括不可枚举属性,而Object.keys()返回的属性只包括可枚举属性。
例子:

function Foo(){};
Foo.prototype.z=3;
var obj=new Foo();
obj.x=1;
obj.y=2;
obj['addr']='北京';
for(var p in obj){
        console.log(p);
}
console.log(Object.getOwnPropertyNames(obj));
console.log(Object.keys(obj));

输出为:

x 
y 
addr 
z
["x", "y", "addr"]
["x", "y", "addr"]

注意:for...in输出了z,其余两个方法没有输出z

(三)对象的属性特性

1.Object.defineProperty

Object.defineProperty(object, propertyname, descriptor)
参数:
object:必需。要在其上添加或修改属性的对象。这可能是一个本机 JavaScript 对象(即用户定义的对象或内置对象)或 DOM 对象。
propertyname:必需。一个包含属性名称的字符串。

descriptor必需。属性描述符。它可以针对数据属性或访问器属性。

  • configurable:当且仅当这个属性描述符值为true时,该属性可能会改变,也可能会被从相应的对象删除。默认为false。
  • enumerable:当且仅当属性值为true时,该属性可枚举。默认为false。
  • value:与属性有关的值,可以是任何有效的JavaScript值。默认为undefined。
  • writable:值为true时,能用运算符改变与属性相关的值。默认为false。

示例:

var obj={};
Object.defineProperty(obj,'x',{
        value:12,
});
console.log(obj.x);
obj.x=456;
console.log(obj.x);//判断是否可写,writable
for(p in obj){
        console.log('对象中的属性:'+p+'\\n');//判断是否可枚举,enumerable
}
console.log(Object.keys(obj));//列出自身所有的可枚举属性,判断是否可枚举。
console.log(Object.getOwnPropertyNames(obj));//列出自身所有属性,包括不可枚举。

输出为:

12 
12 //值未改变,说明属性不可写,writable为false。
//for...in...无输出,说明对象无枚举属性。
[] //Object.keys(obj)的输出,值为空,说明无枚举属性。
["x"] //Object.getOwnPropertyNames(obj)的输出,说明‘x’为不可枚举属性。

示例:验证configurable

var obj={};
Object.defineProperty(obj,'z',{
        value:'this is a test',
        configurable:false,
});
console.log(obj.z);
delete obj.z;
console.log(obj.z);//验证configurable为false时,能否删除属性。
Object.defineProperty(obj,'x',{
        value:'this is a test',
        configurable:true,
});
console.log(obj.x);
delete obj.x;
console.log(obj.x);//验证configurable为true时,能否删除属性

输出为:

this is a test 
this is a test //说明configurable为false时,不能删除属性
this is a test 
undefined //说明configurable为true时,能删除属性

示例:configurable为false时,不能配置属性

var obj={};
Object.defineProperty(obj,'z',{
        value:'this is a test',
        configurable:false,
});
Object.defineProperty(obj,'z',{ //验证是否可重新配置属性
        writable:true,
});

输出为:

"Uncaught TypeError: Cannot redefine property: z"//说明configurable为false时,不能重新配置属性。

示例:通过函数调用获取值

var obj={};
Object.defineProperty(obj,'x',{
        get : function(){
                return 123;
        },
});
console.log(obj.x);

输出为:

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

推荐阅读更多精彩内容