12JavaScript对象

1、对象

1.1 什么是对象？

• 万物皆对象。对象是一个具体的事物，看得见摸得着的事物。例如：一本书、一辆汽车、一个人、可以是“对象”。一个数据库、一张网页、一个远程服务器的连接也可以是“对象”。

• 对象必须是具体的事物，要特指，不能泛指。

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

• 对象是由属性和方法组成的。属性是事物的特征，在对象中用属性来表示（常用名词）。方法是事物的行为，在对象中用方法来表示（常用动词）。

1.2 为什么需要对象

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

答案：用对象。

2、创建对象的三种方式

2.1 利用字面量创建对象

对象字面量：就是花括号{}，里面包含了表达这个具体事物（对象）的属性和方法。

    <script>
        // var obj = {}; //创建了一个空的对象
        var obj = {
            uname: '张三疯',
            age: 18,
            sex: '男',
            sayHi: function() {
                console.log('hi~');
            }
        }
    </script>

• 里面的属性或者方法我们采取键值对的形式。 键（属性名）：值（属性值）
• 多个属性或者方法用逗号隔开
• 方法后面跟的是一个匿名函数

2.1.1 使用对象

调用对象的属性：

• 方法一：对象名.属性名

        console.log(obj.uname);

• 方法二：对象名[‘属性名’]

        console.log(obj['age']); //返回的是属性值

调用对象的方法：

• 对象名.方法名（千万别忘记加小括号！！！）

        obj.sayHi();

2.1.2 变量、属性、函数、方法的区别

变量和属性：都是用来存储数据的。区别：变量是单独声明并赋值的；而属性在对象里面，不需要声明，使用时必须加上对象名。

函数和方法：都是实现某种功能。区别：函数是单独声明并且调用的。方法在对象里面，调用的时候要加上对象名。

2.2 利用new Object创建对象

跟我们前面学的 new Array() 原理一致

    <script>
        var obj = new Object();
        obj.uname = '张三疯';
        obj.age = 18;
        obj.sayHi = function() {
            console.log('hi~');
        }
    </script>

• 利用等号赋值的方法添加对象的属性和方法
• 每个属性和方法之间用分号结束

2.3 利用构造函数创建对象

因为之前的两种方式只能一次创建一个对象。如果要创建多个对象只能复制，因此可以利用函数的方法重复这些相同的代码，我们就把这个函数称为构造函数。

构造函数里面封装的是对象。构造函数就是把对象里面一些相同的属性和方法抽象出来封装到函数里面。

2.3.1 代码结构

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

    <script>
        function Star(uname, age, sex) {
            this.name = uname;
            this.age = age;
            this.sex = sex;
            this.sing = function(sang) {
                console.log(sang);
            }
        }
        var ldh = new Star('刘德华', 18, '男'); //调用函数返回的是一个对象
        var zxy = new Star('张学友', 19, '男');
        console.log(ldh.name);
        console.log(ldh.sex);
        ldh.sing('冰雨');
    </script>

• 构造函数名字首字母要大写
• 我们构造函数不需要return，就可以返回结果
• 我们调用构造函数，必须使用new
• 我们只要new Star() 调用函数就创建一个对象。
• 属性和方法前面必须加this

2.3.2 构造函数和对象的区别

构造函数是泛指某一大类，如明星；

对象是一个实例，是具体的，如刘德华；

利用构造函数创建对象也叫做对象实例化。

3、new关键字

• new 当构建函数遇到new时会在内存中创建一个新的对象。
• this 就会指向刚才创建的空对象
• 执行构造函数里面的代码 给这个空对象添加属性和方法
• 返回这个对象（所以构造函数里面不需要return）

4、遍历对象属性

4.1 for…in…循环

for (变量 in 对象){}

    <script>
        var obj = {
                name: '吱昂张',
                age: 18,
                sex: '女'
            }
            //遍历属性
        for (var k in obj) {
            console.log(k); //得到的是属性名 name age sex
            console.log(obj[k]); // 得到的属性值 吱昂张 18 女
        }
    </script>

• 我们使用for in 里面的变量 我们喜欢写k 或者 key
• console.log(obj[k]); 这里的k没有引号和使用对象时区分开