【JavaScript】17_面向对象,类与属性

举报
魔天伦 发表于 2023/02/23 13:09:38 2023/02/23
【摘要】 1、面向对象面向对象编程(OOP)程序是干嘛的?   - 程序就是对现实世界的抽象(照片就是对人的抽象)对象是干嘛的?   - 一个事物抽象到程序中后就变成了对象   - 在程序的世界中,一切皆对象面向对象的编程   - 面向对象的编程指,程序中的所有操作都是通过对象来完成   - 做任何事情之前都需要先找到它的对象,然后通过对象来完成各种操作一个事物通常由两部分组成:数据和功能一个对象由...

1、面向对象

面向对象编程(OOP)

  1. 程序是干嘛的?
       - 程序就是对现实世界的抽象(照片就是对人的抽象)
  2. 对象是干嘛的?
       - 一个事物抽象到程序中后就变成了对象
       - 在程序的世界中,一切皆对象
  3. 面向对象的编程
       - 面向对象的编程指,程序中的所有操作都是通过对象来完成
       - 做任何事情之前都需要先找到它的对象,然后通过对象来完成各种操作
  • 一个事物通常由两部分组成:数据和功能

  • 一个对象由两部分组成:属性和方法

  • 事物的数据到了对象中,体现为属性

  • 事物的功能到了对象中,体现为方法

                - 数据:
                    姓名
                    年龄
                    身高
                    体重

                - 功能:
                    睡
                    吃    
<script>
    const five = {
            // 添加属性
            name:"王老五",
            age:48,
            height:180,
            weight:100,

            // 添加方法
            sleep(){
                console.log(this.name + "睡觉了~")
            },

            eat(){
                console.log(this.name + "吃饭了~")
            }
       }
    </script>

2、类

使用Object创建对象的问题:

  1. 无法区分出不同类型的对象
  2. 不方便批量创建对象

在JS中可以通过类(class)来解决这个问题:

  1. 类是对象模板,可以将对象中的属性和方法直接定义在类中
       定义后,就可以直接通过类来创建对象
  2. 通过同一个类创建的对象,我们称为同类对象
       可以使用instanceof来检查一个对象是否是由某个类创建
       如果某个对象是由某个类所创建,则我们称该对象是这个类的实例

语法:
class 类名 {} // 类名要使用大驼峰命名
const 类名 = class {}

通过类创建对象
new 类()

    <script>
        // const Person = class {}

        // Person类专门用来创建人的对象
        class Person {

        }
        // Dog类式专门用来创建狗的对象
        class Dog {

        }

        const p1 = new Person()
        const p2 = new Person()
       
        const d1 = new Dog()
        const d2 = new Dog()

        console.log(p1 instanceof Person)//调用构造函数创建对象
        console.log(d1 instanceof Dog)//true
        console.log(d1 instanceof Person)//false

        const five = {
                // 添加属性
                name: "王老五",
                age: 48,
                height: 180,
                weight: 100,

                // 添加方法
                sleep() {
                    console.log(this.name + "睡觉了~")
                },

                eat() {
                    console.log(this.name + "吃饭了~")
                },
            }

            const yellow = {
                name: "大黄",
                age: 3,
                sleep() {
                    console.log(this.name + "睡觉了~")
                },

                eat() {
                    console.log(this.name + "吃饭了~")
                },
            }
    </script>

3、属性

类是创建对象的模板,要创建第一件事就是定义类

类的代码块,默认就是严格模式,

类的代码块是用来设置对象的属性的,不是什么代码都能写

    <script>
        class Person {
            name = '孙悟空'
            age = 18

            static test = 'test静态属性'// 使用static声明的属性,是静态属性(类属性) Person.test
            static hh = '静态属性'// 静态属性只能通过类去访问 Person.hh
        }

        const p1 = new Person()
        const p2 = new Person()

        console.log(p1)
        console.log(p2)
    </script>
【版权声明】本文为华为云社区用户原创内容,转载时必须标注文章的来源(华为云社区)、文章链接、文章作者等基本信息, 否则作者和本社区有权追究责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@huaweicloud.com
  • 点赞
  • 收藏
  • 关注作者

评论(0

0/1000
抱歉,系统识别当前为高风险访问,暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称,即可参与社区互动!

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。