JavaScript 对象

来源:互联网 发布:北京婚纱照 知乎 编辑:程序博客网 时间:2024/06/06 05:48

对象

创建对象与调用对象

方法:

1 对象的初始化器方式

相关代码:var obj={              //定义对象的属性             name:'gzl',             //定义对象的方法             sayMe=function (){                  console.log('I am gzl');             }           }          **1.//调用对象的属性和方法**           //调用对象的属性           console.log(obj.name);           //调用对象的方法           obj.sayMe();          **2.//调用对象的属性和方法-->通用方法**          //调用对象的属性          console.log(obj['name']);          //调用对象的方法          obj.['sayMe']();

2 构造函数(Object)方式定义

相关代码:var obj=new Object();//定义对象的属性obj.name='gzl';//定义对象的方法obj.sayMe=function (){    console.log('I am gzl');}//创建String/Number类型的方法var str=new String();var num=new Number();//调用对象的属性和方法console.log(obj.name);obj['sayMe']();

3 利用Object.create()方法创建对象

相关代码:var obj=Object.create();//定义对象的属性obj.name='gzl';//定义对象的方法obj.sayMe=function(){   console.log('I am gzl');}//对象obj与对象str对象具有相同的属性和方法var obj=Object.create(str);//调用对象的属性和方法console.log(obj['name']);obj.sayMe();

调用对象的属性和方法示例图
这里写图片描述
遍历对象

JavaScript 提供了三种原生方法用于遍历或枚举对象的属性:

1 for…in 循环 :该方法依次访问一个对象及其原生链中所有可枚举的属性。

相关代码:var hero={name:'gzl',age:23,sayMe=function(){console.log('I am gzl');}}//遍历对象中的属性和方法//propertyName 得到对象的属性名和方法名for ( var propertyName in hero){    if( hero[propertyName]  instanceof Function){         //表示当前是对象的方法         hero[propertyName]();    }else{         //表示当前是对象的属性         console.log(hero[propertyName]);    }}

2 Object.keys(object)方法:该方法返回一个对象的所有属性的名称为数组

相关代码:var hero={name:'gzl',age:23,sayMe=function(){console.log('I am gzl');}}var result=Object.keys(hero);for (var i=0;i<=result.length;i++){    if( hero[result[i]] instenceof Function){        //表示当前是对象的方法        hero[result[i]]();    }else{        //表示当前是对象的属性        console.log(hero[result[i]]);    }}

3 Object.getOwnPropertyNames( object ) 方法:得到遍历对象的所有属性和方法名,是数组类型。

相关代码:var result =Object.getOwnPropertyNames(hero);console,log(result);

访问出错

相关代码:var hero = {    name : 'gzl',    sayMe : function(){        console.log('I am gzl');    }}console.log(hero.name);// gzlconsole.log(hero.job);//undefinedhero.sayYou();//报错:hero.sayYou is not a function 

检测对象的属性和方法

相关代码:var hero = {    name : 'gzl',    sayMe : function(){        console.log('I am gzl');    }}

一、属性的检测
1. 检测对象的属性是否存在

console.log(hero.name == undefined);
if (hero.job !== undefined){
console.log(hero.name);
}else {
console.log(“该属性不存在”);
}

2、使用 in 关键字

console.log(‘job’ in hero);
if (‘job’ in hero) {
console.log(hero.job);
}else {
console.log(“该属性不存在”);
}

3、Object 提供了 hasOwnProperty() 方法

Object 是所有对象的父级,Object的属性和方法所有对象都可以直接使用
console.log(hero.hasOwnProperty(‘job’));
if (hero.hasOwnProperty(‘job’)) {
console.log(hero.job);
}else {
console.log(“该属性不存在”);
}

4、条件语句

if (hero.job !== undefined){
console.log(hero.job);
}else {
console.log(“该属性不存在”);
}

5、条件运算符

hero.job !== undefined ? ‘存在’ : ‘不存在’;

6、定义默认值

hero.job = undefined || ”

二、方法的检测

console.log(‘sayYou’ in hero);
console.log(hero.sayMe !== undefined);

操作对象的属性和方法

相关代码:var hero={    name:'gzl',    sayMe=fuction(){         console.log('I am gzl');    }}console.log(hero.name);hero.sayMe();

上述代码输出的结果为:

gzl
I am gzl

添加属性和方法

hero.age=23;
hero.sayYou=fuction(){console.log(‘this is gzl’);}
hero.sayYou();

显示结果:

gzl
I am gzl
23
this is gzl

修改属性和方法

hero.name=’gzl’,
console.log(hero.name);
hero.sayMe=function(){console.log(‘this is g’);}
hero.sayMe();

显示结果:

gzl
I am gzl
zlx
this is z

删除属性和方法

delect hero.name;
console.log(hero.name);
delect hero.sayMe;
hero.sayMe();

显示结果

gzl
I am gzl
undefined
hero.sayMe is not a function //报错

原创粉丝点击