class类的概念

101 阅读2分钟

u=57681699,3753862228&fm=253&fmt=auto&app=138&f=JPEG.webp

要创建对象,必须要定义类,类可以理解为对象的模型,可以根据类创建指定类型的对象,我在学习的时候常常把静态属性和实例属性搞混了,海豹海报傻傻分不清楚

为了分清这两个属性,以及类中可能用到的关键字,简单上代码介绍一下

    class Person {
        //定义实例属性
        name: string = '张三'
        // 在属性前使用static关键字可以定义类属性(静态属性)
        static age: number = 18
        // readonly开头的属性表示一个只读的属性无法修改
        readonly sex: string = '男'
         // 定义方法
        say() {
            console.log('你好ts')
          }
    }
    const per = new Person()
    //调用实例属性
    console.log(per.name)
    per.say()
    //调用静态属性
    console.log(Person.age)
    

其实在实际开发中常用的还是类的实例属性,当然要忽略在原型上的方法哈,如果以后涉及到静态成员调用的方法也会整理的

补充构造函数的概念

我们要传多个信息用上述类的方法岂不是把值固定死了?那类能不能用参数的形式来传值呢?这里就要说到constructor了

class Person{
    name: string;
    age: number;

    constructor(name: string, age: number){
        this.name = name;
        this.age = age;
    }

    sayHello(){
        console.log(`大家好,我是${this.name}`);
    }
}
const p = new Person('法外狂徒张三', 18);
p.sayHello();

构造函数的第二种使用方法(函数的方式创建对象)

    function Person(name, age, sex) {
        this.name = name; 
        this.age= age; 
        this.sex= sex; 
    }
    var p1 = new Person('法外狂徒张三', '18', '男'); 
    var p2 = new Person('技术狂人李四', '18', '男');

写到这里突然想到当时面试的时候遇到的一个问题,new创建对象的执行过程在这里也一并写出来

  1. 当以new关键字调用,会创建出一个新的工作空间,标记为Person的实例
  2. 将空对象的原型绑定为new操作符后面的构造函数的原型
  3. 函数体内部的 this 指向该内存,并执行构造函数的函数体,创建相关属性和方法
  4. 判断执行结果是否返回了新的对象,如果有返回新对象,就是用返回的新对象,没有的话,返回原来创建的对象(obj)