JavaScript 对象

最新推荐文章于 2021-11-10 16:38:37 发布

少年张狂

最新推荐文章于 2021-11-10 16:38:37 发布

阅读量801

点赞数

本文链接：https://blog.csdn.net/weixin_41909678/article/details/118760127

版权

目标

能够说出为什么需要对象
能够使用字面量创建对象
能够使用构造函数创建对象
能够说出 new 的执行过程
能够遍历对象

对象

什么是对象

1. 在现实生活中：

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

2. 在 JavaScript 中：

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

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

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

例如一部手机：

大小、颜色、重量、屏幕尺寸、厚度都是属性
打电话、发短信、玩游戏、砸核桃则是方法

为什么需要对象

保存某个值，可以使用变量；保存多个值（一组值），可以使用数组
保存一个事物的完整信息（属性和方法），需要使用对象
JS 中的对象表达结构更清晰、更强大

<script>
    person.name = '张三';
    person.sex = '男';
    person.age = 20;
    person.height = 120;
</script>

创建对象的三种方式

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

利用字面量创建对象
利用 new Object 创建对象
利用构造函数创建对象

利用字面量创建对象

对象字面量：花括号 { } 。里面包含了表达某个具体事物（对象）的属性和方法
var person = {}; 创建一个空对象

创建对象

里面的属性和方法采取键值对的形式
键：属性名；值：属性值
多个属性或方法之间用逗号隔开
方法冒号后面定义的是一个匿名函数

使用对象

调用对象的属性

方法1：对象名.属性名
方法2：对象名['属性名']

调用对象的方法

对象名.方法名()

    <script>
        // 利用字面量 {} 创建对象
        // var person = {}; 创建一个空对象

        // 创建对象
        // 里面的属性和方法采取键值对的形式
        // 键：属性名 值：属性值
        // 多个属性或方法用逗号隔开
        // 方法冒号后面定义的是一个匿名函数

        // 使用对象
        // 调用对象的属性第一种方法：对象名.属性名
        // console.log(person.pername);
        // 调用对象的属性第二种方法：对象名['属性名']
        // console.log(person['pername']);
        // 调用对象的方法 sayHi(): 对象名.方法名
        // persom.sayHi();

        var person = {
            pername: '张三',
            age: 20,
            sex: '男',
            sayHi: function() {
                console.log('hi~~');
            }
        }
    </script>

案例

    <script>
        var dog = {
            pername: '可可', // 属性和属性值之间千万不能用 = ，而应该用 :
            type: '阿拉斯加犬',
            age: 5,
            color: '棕红色',
            bark: function() {
                console.log('汪~汪~汪');
            }, // 对象的两个方法之间的逗号也不能忽视
            showFilm: function() {
                console.log('可可小狗');
            }
        }
        console.log(dog.pername);
        console.log(dog['color']);
        dog.bark();
        dog.showFilm();
    </script>

注意：

多个属性或方法之间用逗号隔开，必须注意
属性和属性值之间应该用 " : "；而不是 " = "