JS 对象

JS 对象

1.1 什么是对象？

现实生活中：万物皆对象，对象是个具体的事物，看得见摸得着的实物。

在JavaScript中，对象是一组无序的相关属性和方法的集合，所有的事物都是对象，例如 字符串、数值、数组、函数等

对象是由属性和方法组成的。

• 属性：事物的特征，在对象中用属性表示(常用名词)
• 方法：事物的行为，在对象中用方法来表示(常用动词)

1.2 为什么需要对象

保存一个值时，可以使用变量，保存多个值时(一组值)，可以使用数组。如果要保存一个人的完整信息呢？

• 此时，若用变量，过于麻烦

• 若用数组

var arr = ['张三丰', '男', 128,  154];

此例中便很难弄清楚128 154 代表了什么

• 用对象表示便清楚明了，结构清晰

  person.name = '张三丰'；
  person.sex = '男';
  person.age = 128;
  person.heihgt = 154;
  

2. 创建对象的三种方式

2.1 利用对象字面量创建对象

var obj = {};//1.创建一个空对象
//或
var obj = {
    name:'yyqx',
    age:20,
    length:180,
    sayHi: function() {
        console.log('hi');
    }
}
//2. 使用对象
//(1) 调用对象的属性1： 对象名.属性名
console.log(obj.name);
//(2) 调用对象属性2：对象名['属性名']
console.log(obj.age);
//(3) 调用对象的方法
obj.sayHi();

2.2 利用new Object创建对象

var obj = new Object();//创建一个空对象
obj.name = 'yyqx';
obj.age = 18;
obj.sayHi = function() {
    console.log('hi');
}
//（1）利用等号赋值，添加对象的属性和方法
//(2) 分号隔开

2.3 利用构造函数创建对象

• 因为前面两种方式一次只能创建一个对象
• 对象里面的属性和方法是大量相同的
• 因此可以利用函数的方法重复这些相同的代码，这个函数称为构造函数
• 又因为这个函数里面封装的不是普通代码，而是对象
• 构造函数就是把对象里面一些相同的属性和方法抽象出来封装到函数里面。

构造函数的语法格式：

function 构造函数() {
    this.属性 = 值;
    this.方法 = function() {}
}
// 调用
new 构造函数名();

创建四大天王的对象，相同属性：姓名 年龄 性别 相同的方法：唱歌

function Star( uname, age, sex) {
    
    //1. 构造函数名首字母大写
    this.name = uname;
    this.age = age;
    this.sex = sex;
    this.sing = function(song) {
        console.log(song);
    }
}

//2. 构造函数不需要return就可以返回结果
//3. 调用构造函数必须使用 new
//4. 只要new Star() 调用函数就创建了一个对象
//5. 属性和方法前面必须加 this

var ldh = new Star('刘德华', 18, '男');//调用函数返回的是一个对象

var zxy = new Star('张学友', 19, '男');

2.4 构造函数和对象

• 构造函数，如Star(),抽象了对象的公共部分，封装到了函数里面，它泛指某一大类(class)
• 创建对象，如new Star(), 特指某一个，通过new 关键字创建对象的过程称之为对象实例化。

3. new关键字的执行过程

1. new 构造函数 在内存中创建了一个空的对象
2. this 就会指向刚才创建的空对象
3. 执行构造函数里面的代码，给空对象添加属性和方法
4. 返回这个对象(所以不需要return)

4. 遍历对象

for in 遍历对象

语法格式

for (变量 in 对象) {
    
}

案例

var obj = {
    name:'pink',
    age: 18,
    sex:'男',
    fn:function() {}
}
for (var k in obj) {
    console.log(k);//打印的是属性名：name age sex
    console.log(obj[k]);//打印的是属性值(方法也可遍历出来)
}

1. 变量、属性的异同

1. 变量和属性的相同点：都是用来存储数据
2. 变量和属性的不同点：
   • 变量：单独声明并赋值 使用的时候直接写变量名（单独存在）
   • 属性：在对象里面不需要声明，使用的时候 对象.属性(寄托于对象)

2. 函数、方法的异同

1. 函数和方法的相同点：都是实现某种功能 做某件事

2. 函数和方法的不同点：

   • 函数是单独声明并且调用的, 函数名() 单独存在的
   • 方法 在对象里面，调用的时候 对象.方法()