JavaScript 对象

一、对象

　　1、引入对象

　　　　当一个函数参数特别多的话，这个时候我们就可以使用对象简化。

　　2、什么是对象

　　　　现实生活中：万物皆对象。对象是一个具体的事物，一个具体的事物就会有行为和特征。

　　Demo：

　　　　　汽车是一类事物，门口停的那一辆车才是对象。

　　　　　特征：蓝色、四个轮子，四个座位

　　　　　行为：驾驶、刹车

二、JavaScript 中的对象

　　1、JavaScript 中的对象其实就是生活中对象一个抽象。

　　2、JavaScript 的对象是无序属性的集合。其属性可以包含基本值、对象或函数。

　　　    对象就是一组没有顺序的值，可以把 JavaScript 中的对象想象成键值对。其中值可以是数据和函数。

　　　  对象的行为和特征：

　　　　　　特征 —— 属性；  事物的特征在对象中用属性来表示。

　　　　　　行为 —— 方法；  事物的行为在对象中用方法来表示。

三、创建对象

　　1、对象字面量创建 （构造函数的简写）

　　　　定义格式：

var 对象名 = {
   属性1：value1,
   属性2：value2,
   方法1：function(){
     // 方法体    
   },
   方法2：function(){
      // 方法体
   }        
}

　　　　Demo：

// 定义一个英雄对象
var hero = {
   name:'后羿',
   age:23,
   weapon:'逐日之弓',
   equipment: ['头盔', '靴子', '盔甲'],
   attack : function () {
       console.log(this.name + ':射箭')；        
  }    
}

　　2、使用 new Object() 创建对象

• •    Object 是一个构造函数，new 的方式来调用构造函数；
  •    JavaScript 可以动态添加属性（动态特性）；
  •    构造函数会在内存中创建一个对象，并用引用变量指向该对象；

　　　定义格式：

var 对象名 = new Object();
对象名.属性1 = value1;
对象名.属性2 = value2;
对象名.方法1 = function () {};
对象名.方法2 = function () {};

　　　　Demo:

var person = new Object();
  person.name = 'Tom';
  person.age = 25;
  person.job = 'actor';
  person.sayHi = function(){
      console.log('Hello,World!');
  }

　　3、工厂函数创建对象

　　　　定义格式：

function 函数名 (参数1,参数2,参数3){           // 定义一个创建对象的函数
     var 对象名 = new Object();
     对象名.属性1 = 参数1;
     对象名.属性2 = 参数2；
     对象名.属性3 = 参数3；
     对象名.方法 = function () {
        // 方法体
    }  
    return 对象名;    
}

var 对象名 = 函数名(参数1，参数2，参数3);         // 调用创建对象函数，并传入参数，返回一个对象

　　　　Demo：

function createPerson(name, age, job) {
  var person = new Object();
  person.name = name;
  person.age = age;
  person.job = job;
  person.sayHi = function(){
    console.log('Hello,World！');
  }
  return person;
}
var p1 = createPerson('Tom', 25, 'actor');

　　4、自定义构造函数（帕斯卡命名：第一个单词的第一个字母大写（大驼峰命名））

　　　　定义格式：

function 构造函数名(参数1，参数2，参数3) {
   this.属性1 = 参数1；
   this.属性2 = 参数2；
   this.属性3 = 参数3；
   this.方法 = function() {
    // 方法体
  }    
}

var 对象名 = new 构造函数(参数1，参数2，参数3);

　　　　Demo：

function Person(name,age,job){             // 定义构造函数
  this.name = name;
  this.age = age;
  this.job = job;
  this.sayHi = function(){
      console.log('Hello,World！');
  }
}
var p1 = new Person('Tom', 25, 'actor');   // 调用构造函数

 

四、对象的属性和方法

　　1、如果一个变量属于一个对象所有，那么该变量就可以称之为该对象的一个属性，属性一般是名词，用来描述事物的特征。

　　2、如果一个函数属于一个对象所有，那么该函数就可以称之为该对象的一个方法，方法一般是动词，用来描述事物的行为和功能。

　　扩展1：函数与对象的区别：

　　　　函数：用来封装一段可以重复利用的代码

　　　　对象：封装一组属性和方法

　　扩展2：函数与方法的区别：

　　　　函数：可以独立存在的函数

　　　　方法：属于对象的函数

五、new 关键字

　　　构造函数：是一种特殊的函数。主要用来在创建对象时初始化对象，即为对象成员变量赋初始值，总与 new 运算符一起使用在创建对象的语句中。

　　   1、构造函数用于创建一类对象，首字母要大写。

　　   2、构造函数要和 new 一起使用才有意义。

　　　new 在执行时会做四件事情：

• • 　new 会在内存中创建一个新的空对象
    
  •     new 会让 this 指向这个新的对象
  •    执行构造函数  目的：给这个新对象加属性和方法
  •    new 会返回这个新对象 return this

六、this 详解

　　　this 关键字的特点：

　　　　1、函数在定义的时候 this 是不确定的，只有在调用的时候才可以确定；

      　　 2、this 出现在函数中 —— this 指向  window

　　　　3、this 出现在方法中 —— this 指向的是这个方法所属的对象

　　　　4、this 出现在构造函数中 —— this 就是构造函数创建的对象

七、对象的使用

　　1、访问属性和方法

　　　　格式：

// 访问属性 
对象名.属性名；
对象名['属性名']；

// 访问方法
对象名.方法名

　　2、遍历对象的属性

　　　　通过 for..in 语法可以遍历一个对象

　　　Demo：

var obj = {};                          // 定义一个空对象
for (var i = 0; i < 10; i++) {
  obj[i] = i * 2;                      // 给对象的每一项进行赋值
}
for(var key in obj) {
  console.log(key + "==" + obj[key]);  // 根据每一项的 key 输出对象的 value
}

　　3、删除对象的属性

　　　　通过 delete 关键字可以删除对象的属性。

　　　Demo：

function Fun() {              // 定义一个构造函数
  this.name = 'mm';
}
var obj = new Fun();          // 创建一个对象
console.log(obj.name);        // mm 
delete obj.name;              // 删除该对象的属性
console.log(obj.name);        // undefined