如何在 TypeScript 中创建对象?
对象包含其属性的键值对，也可以是 TypeScript 中类的实例。类及其对象是面向对象编程的基础。因此，没有对象，OOPS 就不存在。对象主要用于调用类的非静态方法。
在 TypeScript 中有多种定义对象的方法。我们将在下面逐一学习定义对象的所有方法。
使用对象文字表示法创建对象
对象文字表示法意味着我们可以使用两个花括号创建对象。通过逗号分隔，我们需要在花括号内定义对象属性的键值对。
语法
以下语法显示如何使用对象文字表示法定义对象并插入属性。
let object = {
key1: Value1,
key2: value2,
}
示例 1
在下面的示例中，我们创建了 Employee 接口，我们将使用该接口来定义员工对象的类型。Employee 接口包含 emp_name、department 和 join_date 共 3 个属性。
之后，我们创建了包含不同属性值的 Employee 类型的 emp 对象。最后，我们打印了 emp 对象的属性值。
// Employee 接口定义对象类型
interface Employee {
emp_name: string;
department: string;
joining_date: Date;
}
// 创建 Employee 类型的对象
let emp: Employee = {
emp_name: "Shubham",
department: "Writing",
joining_date: new Date(),
};
// 打印对象信息
console.log(
"The joining date of the " +
emp.emp_name +
" into the " +
emp.department +
" department is " +
emp.joining_date
)
编译后，它将生成以下 JavaScript 代码 -
// 创建 Employee 类型的对象
var emp = {
emp_name: "Shubham",
department: "Writing",
joining_date: new Date()
};
// 打印对象信息
console.log("The joining date of the " +
emp.emp_name +
" into the " +
emp.department +
" department is " +
emp.joining_date);
输出
上述代码将产生以下输出 -
The joining date of the Shubham into the Writing department is Sun Dec 25 2022 09:01:09 GMT+0000 (UTC)
示例 2
在下面的例子中，我们创建了接口 car，其中包含一些汽车属性，例如型号和颜色。object_func() 函数将 car 对象作为参数并返回汽车信息。
之后，我们通过将 Car 类型的匿名对象作为参数传递来执行 object_func() 函数。
// Car 对象的类型声明
interface Car {
model: string;
color: string;
model_year: number;
}
// 返回汽车信息的函数
function object_func(car: Car): string {
return "The " + car.model + " is developed in the year " + car.model_year;
}
// 使用 Car 类型的匿名对象调用 object_func
console.log(object_func({ model: "Verna SX", color: "black", model_year: 2016 }));
编译后，它将生成以下 JavaScript 代码 -
// 返回汽车信息的函数
function object_func(car) {
return "The " + car.model + " is developed in the year " + car.model_year;
}
// 使用 Car 类型的匿名对象调用 object_func
console.log(object_func({ model: "Verna SX", color: "black", model_year: 2016 }));
输出
上述代码将产生以下输出 -
The Verna SX is developed in the year 2016
使用构造函数定义对象
构造函数是一种类或对象方法，当我们创建对象时，它总是首先调用。构造函数将值作为参数，我们可以使用该参数值初始化对象或类属性。
语法
用户可以按照以下语法定义 Number 类的对象。此外，我们将值作为构造函数的参数传递
let number_obj = new Number(value);
在上述语法中，我们使用箭头函数作为回调函数。
示例 1
以下示例包含表类。在表类中，我们定义了表的颜色和大小属性。此外，我们使用构造函数关键字为表类创建了构造函数，该构造函数将 table_color 和 table_size 作为参数。每次我们创建表类的对象并初始化表类的表和大小属性时，构造函数都会调用。
之后，我们使用表类构造函数创建了 table1 对象，并将表的颜色和大小作为参数传递。在输出中，用户可以看到 table1 对象的属性值已更改。
// 创建表类
class table {
// 使用默认值定义表类的属性
color: string = "black";
size: string = "19 x 19 inches";
// 表类的构造函数
constructor(table_color: string, table_size: string) {
this.color = table_color;
this.size = table_size;
}
}
// 使用构造函数参数创建表类的对象
let table1 = new table("white", "4 x 4 feet");
// 打印 table1 对象的信息
console.log("The color of table1 is " + table1.color);
console.log("The size of the table1 is " + table1.size);
编译后，它将生成以下 JavaScript 代码 -
// 创建表类
var table = /** @class */ (function () {
// 表类的构造函数
function table(table_color, table_size) {
// 使用默认值定义表类的属性
this.color = "black";
this.size = "19 x 19 inches";
this.color = table_color;
this.size = table_size;
}
return table;
}());
// 使用构造函数参数创建表类的对象
var table1 = new table("white", "4 x 4 feet");
// 打印 table1 对象的信息
console.log("The color of table1 is " + table1.color);
console.log("The size of the table1 is " + table1.size);
输出
上述代码将产生以下输出 -
The color of table1 is white The size of the table1 is 4 x 4 feet
示例 2
在下面的示例中，我们定义了函数名称构造函数。它将字符串值作为第一个参数，将数字值作为第二个参数，将函数作为第三个参数，并将这些值分配给其属性，即 property1、property2 和 property3。
在 TypeScript 中，我们可以使用任何函数作为构造函数并创建其对象实例。在这里，我们使用了constructor()函数作为构造函数来创建一个 new_object。之后，我们调用了 new_object 的 property3() 函数。
// 定义构造函数
function constructor(value1: string, value2: number, value3: Function) {
this.property1 = value1;
this.property2 = value2;
// It takes the function as a value
this.property3 = value3;
}
// 通过将参数传递给构造函数来创建新对象，
// 第三个参数是函数。
let new_object = new constructor("shubham", 22, () => {
return "Hello World";
});
console.log("The property1 value of the new object is " + new_object.property1);
console.log(
"Invoking the function of the property3, " + new_object.property3()
);
编译后，它将生成以下 JavaScript 代码 -
// 定义构造函数
function constructor(value1, value2, value3) {
this.property1 = value1;
this.property2 = value2;
// 它将函数作为值
this.property3 = value3;
}
// 通过将参数传递给构造函数来创建新对象，
// 第三个参数是函数。
var new_object = new constructor("shubham", 22, function () {
return "Hello World";
});
console.log("The property1 value of the new object is " + new_object.property1);
console.log("Invoking the function of the property3, " + new_object.property3());
输出
上述代码将产生以下输出 -
The property1 value of the new object is shubham Invoking the function of the property3, Hello World
使用 Object.create() 方法克隆现有对象
在 TypeScript 中，我们可以使用 Object.create() 方法克隆现有对象。
语法
在下面的语法中，我们使用 Object.create() 方法克隆了 obj 方法并定义了 clone_obj。
let obj = {
message: "Hello Users!",
};
let clone_obj = Object.create(obj);
此处 Obj 是我们要从中创建 clone 的对象。
示例
在下面的示例中，我们创建了包含一些属性的 obj 对象。之后，我们使用 Object.create() 方法将 obj 对象的所有属性克隆到 clone_obj。在输出中，用户可以观察到 clone_obj 包含与 obj 相同的属性及其值。
// 使用键值对创建对象
let obj = {
message: "Hello Users!",
property1: "TutorialsPoint",
Property2: 90
};
// 使用 Object.create() 方法克隆 obj
let clone_obj = Object.create(obj);
console.log(
"Printing the information of the clone_obj is " +
clone_obj.message +
" " +
clone_obj.property1
);
编译后，它将生成以下 JavaScript 代码 -
// 使用键值对创建对象
var obj = {
message: "Hello Users!",
property1: "TutorialsPoint",
Property2: 90
};
// 使用 Object.create() 方法克隆 obj
var clone_obj = Object.create(obj);
console.log("Printing the information of the clone_obj is " +
clone_obj.message + " " +
clone_obj.property1);
输出
上述代码将产生以下输出 -
Printing the information of the clone_obj is Hello Users! TutorialsPoint
我们学习了在 TypeScript 中创建对象的两种不同方法。用户可以根据需要创建对象的情况使用对象字面量表示法或构造函数表示法。
