JavaScript 对象

一、对象

（一）什么是对象

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

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

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

（1）属性：事物的特征，在对象中用属性来表示（常用名词）

（2）方法：事物的行为，在对象中用方法来表示（常用动词）

（二）为什么需要对象

1、保存一个值时，可以使用变量，保存多个值（一组值）时，可以使用数组。但是要保存一个人的完整信息呢？

（1）例如：将"张三丰"的个人信息保存在数组中的方式为：

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

（2）JS中的对象表达结构更清晰，更强大。张三丰的个人信息在对象中的表达结构如下：

张三丰.姓名 = '张三丰';　　　　　　person.name = '张三丰';

张三丰.性别 = '男';　　　　　　　　person.sex = '男';

张三丰.年龄 = 128;　　　　　　　   person.age = 128;

张三丰.身高 = 154;　　　　　　　   person.height = 154;

二、创建对象的三种方式

1、在JavaScript中，现阶段我们可以采用三种方式创建对象（object）：

（1）利用字面量创建对象；

（2）利用 new Object 创建对象；

（3）利用构造函数创建对象。

（一）利用字面量创建对象

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

2、利用对象字面量创建对象 {}

        // var obj = {}; //创建了一个空的对象 

　　var obj = {

                uname: '张三疯',

                age: 18,

                sex: '男',

                sayHi: function() {

                    console.log('hi~');

                }

            }

        (1)里面的属性或者方法我们采取键值对的方式  键 属性名 : 值 属性值

        (2)多个属性或者方法中间用逗号隔开的

        (3)方法冒号后面跟的是一个匿名函数

3、使用对象

 (1)调用对象属性，我们采取  对象名.属性名   . 我们理解为 的

            console.log(obj.uname);

(2)调用属性还有一种方法  对象名['属性名']

        console.log(obj['age']);

(3)调用对象的方法 sayHi  对象名.方法名()   千万别忘记添加小括号

        obj.sayHi();

（二）变量、属性、函数、方法总结

1、变量：单独声明赋值，单独存在

2、属性：对象里面的变量称为属性，不需要声明，用来描述该对象的特征

3、函数：单独存在的，通过"函数名()"的方式就可以调用

4、方法：对象里面的函数称为方法，方法不需要声明，使用"对象.方法名()"的方式就可以调用，方法用来描述该对象的行为和功能

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

（1）①变量和属性的相同点：它们都是用来存储数据的

        

var num = 10;

        var obj = {

            age: 18,

            fn:function() {

            }

        }

        function fn() {

        }

        console.log(obj.age);

       ② 不同点：

        ● 变量：单独声明并赋值，使用的时候直接写变量名，单独存在

        ● 属性：在对象里面的不需要声明，使用的时候必须是：对象.属性

（2）①函数和方法的相同点：都是实现某种功能，做某件事

         ②不同点

       ● 函数：是单独声明，并且调用的，函数名() 单独存在

       ● 方法：在对象里面，调用的时候，对象.方法()

（三）利用new Object创建对象

        var obj = new Object(); //创建了一个空的对象

        obj.uname = '张三疯';

        obj.age = 18;

        obj.sex = '男';

        obj.sayHi = function() {

            console.log('hi~');

        }

        (1)我们利用 等号 = 赋值的方法 添加对象的属性和方法

        (2)每个属性和方法之间用 分号结束

（四）利用构造函数创建对象

1、构造函数：是一种特殊的函数，主要用来初始化对象，即为对象成员变量赋初始值，它总与new运算符一起使用。我们可以把对象中一些公共的属性和方法抽取出来，然后封装到这个函数里面。

2、利用构造函数创建对象

        // 我们需要创建四大天王的对象  相同的属性：名字 年龄 性别   相同的方法：唱歌

        // 构造函数的语法格式：

        // function 构造函数名() {

        //     this.属性 = 值;

        //     this.方法 = function() {}

        // }

        // new 构造函数名();

        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, '男'); //调用函数返回的是一个对象

        // console.log(typeof ldh);

        console.log(ldh.name);

        console.log(ldh['sex']);

        ldh.sing('冰雨');

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

        console.log(zxy.name);

        console.log(zxy.age);

        zxy.sing('李兰香');

3、构造函数名字首字母要大写

4、我们构造函数不需要return 就可以返回结果

5、我们调用构造函数 必须使用 new

6、我们只要new Star() 调用函数就创建一个对象 ldh {}

7、我们的属性和方法前面必须添加 this

（五）构造函数和对象

1、构造函数，如Stra()，抽象了对象的公共部分，封装到了函数里面，它泛指某一大类（class）

2、创建对象，如new Stars()，特指某一个，通过 new 关键字创建对象的过程我们也称为对象实例化。

// 构造函数和对象

        //1.构造函数  明星 泛指的某一大类 它类似于 Java 语言里面的 类(class)

        function Star(uname, age, sex) {

            this.name = uname;

            this.age = age;

            this.sex = sex;

            this.sing = function(sang) {

                console.log(sang);

            }

        }

        //2.对象  特指  是一个具体的事物 刘德华 == {name: '刘德华', age: 18, sex: '男', sing: ƒ}

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

        console.log(ldh);

        //3.我们利用构造函数创建对象的过程我们也称为对象的实例化

三、new关键字

1、new 在执行时会做的四件事情：　　　　　　　　　　　　　　　　New和构造函数确认了眼神

（1）在内存中创建一个新的空对象；　　　　　　　　　　　　　　　1.他们俩生了一个宝宝

（2）让 this 指向这个新的对象；　　　　　　　　　　　　　　　　　2.这个宝宝必须是亲生的this指向

（3）指向构造函数里面的代码，给这个新对象添加属性和方法；　　　 3.教孩子读书一肚子墨水

（4）返回这个新对象（所以构造函数里面不需要return）　　　　　　   4.长大挣钱回报父母

四、遍历对象属性

1、for...in语句用于对数组或者对象的属性进行循环操作

var obj = {

                name: 'pink老师',

                age: 18,

                sex: '男',

                fn: function() {

                }

            }

 for (var k in obj) {

            console.log(k); //k 变量 输出  得到的是 属性名

            console.log(obj[k]); //obj[k]  得到的是 属性值

        }

        //我们使用 for in 里面的变量 我们喜欢写 k  或者  key

五、小结

1、对象可以让代码结构更清晰

2、对象复杂数据类型object

3、本质：对象就是一组无序的相关属性和方法的集合

4、构造函数泛指某一大类，比如苹果，不管是红色苹果还是绿色苹果，都统称为苹果

5、对象实例特指一个事物，比如这个苹果、正在给你们讲课的pink老师等。

6、foi...in语句用于对对象的属性进行循环操作