JavaScript...对象...

对象

• 对象是什么

JavaScript中的对象 和其他编程语言中的对象一样 可以比照现实上活中的对象来理解它
JavaScript中对象的概念可以比照现实生活中实实在在的物体来理解
在JavaScript中 一个对象可以是一个单独的拥有属性和类型的实体 拿它和一个杯子做下类比 一个杯子是一个对象 拥有属性 杯子有颜色 图案 重量等等 同样JavaScript对象也有属性来定义它的特征

对象的分类

1.内置对象/原生对象
就是JavaScript语言预定义的对象 在ECMAScript标准定义 由JavaScript解释器/引擎提供具体实现
2.宿主对象
指的是JavaScript运行环境提供的对象 一般是由浏览器厂商提供实现(目前也有独立的JavaScript解释器/引擎提供实现)主要分为BOM和DOM
3.自定义对象
就是由开发人员自主创建的对象

Object对象

-Object对象是什么
Object类型与Array Math等一样都是JavaScript的引用类型 不过Object类型是JavaScript中所有类型的父级(所有类型的对象都可以使用Object的属性和方法)
JavaScript可以通过Object的构造函数来创建自定义对象 当以非构造函数形式被调用时 Object等同于new Object()0

创建对象

• 对象初始化器方式

使用对象初始化器也被称作通过字面值创建对象

/*
    1. 对象的初始化器创建方式
      var 对象名 = {
         属性名: 属性值,
         方法名: function(){
             方法体
         }
     }
*/
var boj1 = {
    name : 'xxx',
    age : 38 ,
    sayMe : function () {
        console.log('我是xxx')
    }
}

• 构造函数方式

1.通过JavaScript提供的预定义类型的构造函数来创建对象

var num = new Number();//Number类型
var str = new String();//String类型
var boo = new Boolean();//Boolean类型

2.通过JavaScript提供的Object类型的构造函数来创建自定义对象

var obj = new Object();//创建一个自定义对象

• Object.create()方法

Object.create()方法创建一个拥有指定原型和若干个指定属性的对象
var 对象名 = Object.create(null) - 创建一个空对象
var 对象名 = Object.create(obj)
obj - 表示另一个对象
特点 - 当前创建的新对象拥有与obj对象相同的属性和方法

• 对象与变量

var obj = 100;
console.log(obj);//100

obj = {
    name : 'xxx',
    sayMe : function () {
        console.log('这是xxx');
    }
};
//{ name: 'xxx', sayMe: [Function: sayMe] }
console.log(obj);

• 对象的复制

var obj1 = {
    name : 'xxx',
    sayMe : function () {
        console.log('这是xxx')
    }
}
console.log(obj1);

var obj2 = obj1;
console.log(obj2);

//修改obj1对象的name属性
obj1.name = 'yyy';
console.log(obj1);
console.log(obj2);

//循环遍历对象 - for...in 语句
for(var attr in obj1){
    console.log(attr);
}

对象的属性

• 调用对象的属性

var obj={
    name:'xxx',
    age:18,
    sayMe:function(){
        console.log('我是xxx');
    }
}

• 新增对象的属性

var obj = {
    name : 'xxx',
    sayMe : function () {
        console.log('我是xxx');
    }
}
/*
     1.对象名 .新的属性名 = 属性值
     2.对象名[新的属性名] = 属性值
*/
obj.age = 18;
console.log(obj);

/*
     空对象默认没有自身属性和方法(父级Object)
*/
var obj1 = {};
console.log(obj1);

obj1.name = 'yyy';
console.log(obj1);

• 修改对象的属性

var obj = {
    name : 'xxx',
    sayMe : function(){
        console.log('我是xxx');
    }
}
/*
    1.对象名.已存在的属性名 = 属性值
    2.对象名[已存在的属性名] = 属性值
 */
obj.name = 'yyy';
console.log(obj);

• 删除对象的属性

var obj = {
    name : 'xxx',
    sayMe : function(){
        console.log('我是xxx');
    }
}
/*
    1.delete 对象名.属性名
    2.delete 对象名[属性名]
 */
delete obj.name;
console.log(obj.name);// undefined

• 检测对象的属性

可以使用下面四种方法检测对象中是否存在指定属性:

var obj = {
    name : 'xxx',
    age : 18
}

console.log(obj.age);// undefined

// 1.判断对象的属性值是否为 undefined
if (obj.age !== undefined) {
    console.log('obj对象的age属性存在...');
} else {
    console.log('请先定义obj对象的age属性...');
}

// 2.判断对象的属性值 - 先转换为Boolean类型
if (obj.age) {
    console.log('obj对象的age属性存在...');
}

// 3.利用in关键字进行判断
if ('age' in obj) {
    console.log('obj对象的age属性存在...');
} else {
    console.log('obj对象的age属性不存在...')
}

// 4.Object类型提供了hasOwnProperty()方法
if (obj.hasOwnProperty('age')) {
    console.log('obj对象的age属性存在...');
} else {
    console.log('obj对象的age属性不存在...')
}

• 遍历对象的属性

JavaScript属性提供了三种原生方法用于遍历或枚举对象的属性:
1.for..in循环:该方法依次访问一个对象及其原型链中所有可枚举的属性
2.Object.keys(object)方法:该方法返回一个对象 o 自身包含(不包括原型中)的所有属性的名称的数组
3.Object.getOwnPropertyNames(object)方法:该方法返回一个数组 它包含了对象 o 所有拥有的属性(无论是否可枚举)的名称

对象的方法

• 调用对象的方法

对象方法的调用类似于对象属性的调用

var obj = {
    name : 'xxx',
    age : 18,
    sayMe : function(){
        console.log('我是xxx');
    }
}
// 1.对象名.方法名()
obj.sayMe();
// 2.对象名[方法名]()
obj['sayMe']();

• 新增对象的用法

var obj = {
    name : 'xxx',
    age : 18,
    sayMe : function(){
        console.log('我是xxx');
    }
}
// 对象名.新的方法名 = function(){}
obj.sayYou = function(){
    console.log('你是yyy');
}
console.log(obj);

• 删除对象的方法

var obj = {
    name : 'xxx',
    age : 18,
    sayMe : function(){
        console.log('我是xxx');
    }
}
// delete 对象名.方法名
delete obj.sayMe;
// 访问对象中不存在的方法 -> 报错(TypeError: obj.sayMe is not a function)
// obj.sayMe();
console.log(obj.sayMe);// undefined
console.log(obj);

// 以属性是否存在的方式进行判断
if ('sayMe' in obj) {
    // 确认目前是一个方法
    if (obj.sayMe instanceof Function) {
        obj.sayMe();// 方法调用
    }
}
// 以上代码可以优化为以下代码
if ('sayMe' in obj && obj.sayMe instanceof Function) {
    obj.sayMe();// 方法调用
}