TS中Class类构造函数和this的使用

最新推荐文章于 2025-06-06 09:04:18 发布

永久旅途

最新推荐文章于 2025-06-06 09:04:18 发布

阅读量1.7k

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.csdn.net/XunLin233/article/details/133343945

TypeScript 专栏收录该内容

22 篇文章

订阅专栏

博客围绕JavaScript展开，介绍了构造函数constructor，它会在对象实例化时调用，还可接收参数。同时讲解了类和方法中this的指向，类中this表示当前实例，可用于添加属性，方法中this指向调用方法的对象。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一、构造函数

constructor是构造函数，构造函数会在对象被实例化时调用

constructor （） { // 构造函数体.. }

如下代码中我们实例化了三个对象，每一次都会调用一次constructor函数，输出“构造函数被调用了”

class Dog{
    constructor() {
        console.log("构造函数被调用了");
    }
}

const dog1 = new Dog();  // 打印：构造函数被调用了
const dog2 = new Dog();  // 打印：构造函数被调用了
const dog3 = new Dog();  // 打印：构造函数被调用了

我们也可以在实例化对象的时候传入参数，例如我们这里传入姓名和年龄，在constructor函数中接收参数

class Dog{
    constructor(name:string, age:number) {
        console.log(name, age);
    }
}

const dog1 = new Dog("大黄", 3);  // 大黄 3
const dog2 = new Dog("旺财", 4);  // 旺财 4
const dog3 = new Dog("小黑", 4);  // 小黑 4

二、类中的this

我们传入参数过后过后并没有赋值给我们的对象的属性，所以每个对象依旧是{ }

this表示的是当前的实例

在构造函数中，当前对象就是当前创建的那个对象，我们可以使用this向当前的对象中添加属性

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

const dog1 = new Dog("大黄", 3);  // {name:"大黄", age:3}
const dog2 = new Dog("旺财", 4);  // {name:"旺财", age:4}
const dog3 = new Dog("小黑", 4);  // {name:"小黑", age:4}

三、方法中的this

方法中的this指向的是调用方法的对象

class Dog {
  name: string;
  age: number;
  constructor(name: string, age: number) {
    this.name = name;
    this.age = age;
  }
  bark() {
    console.log(this.name + "汪汪汪");
  }
}

const dog1 = new Dog("大黄", 3); // {name:"大黄", age:3}
const dog2 = new Dog("旺财", 4); // {name:"旺财", age:4}
const dog3 = new Dog("小黑", 4); // {name:"小黑", age:4}
dog1.bark();  // 打印：大黄汪汪汪
dog2.bark();  // 打印：旺财汪汪汪
dog3.bark();  // 打印：小黑汪汪汪