JavaScript 对象

对象

创建对象与调用对象

方法:

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);// gzl
console.log(hero.job);//undefined
hero.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 //报错

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值