数据结构
网络
关系型数据库管理系统
操作系统
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 语言编程
C++
C#
MongoDB
MySQL
Javascript
PHP
物理学
化学
生物学
数学
英语
经济学
心理学
社会学
时尚研究
法律研究如何在 TypeScript 中创建对象数组？
在 TypeScript 中，数组包含数据或不同的值，也可以包含对象。对象包含 TypeScript 中的属性和方法。我们可以通过引用对象来访问对象属性并调用对象方法。
在本教程中，我们将学习如何在 TypeScript 中创建多个对象的数组。我们还将学习执行一些操作，例如对对象数组进行排序。
语法
这里，我们给出了创建对象数组需要遵循的语法。
let obj_array: Array<Object_Type> = [{object properties}]
在上述语法中，Object_Type 是一种对象类型，它定义了数组中所有对象将包含的属性及其数据类型。
示例
在这个例子中，我们使用了类型别名来创建对象类型。objType 包含数字类型的 obj_id 和字符串类型的 obj_value。
我们创建了包含五个不同对象（具有不同属性值）的 objType 对象数组。此外，我们还从第一个索引访问对象并读取其属性值。
// Creating the type for the object
type objType = {
obj_id: number;
obj_value: string;
};
// creating the array of objects
let objArray: Array<objType> = [
{ obj_id: 1, obj_value: "TutorialsPoint" },
{ obj_id: 2, obj_value: "TypeScript" },
{ obj_id: 3, obj_value: "Shubham" },
{ obj_id: 4, obj_value: "TutorialsPoint" },
{ obj_id: 5, obj_value: "TypeScript" },
];
console.log(
"The properties values of the object at the first index in objArray is "
);
// accessing the object and its properties
console.log(objArray[0].obj_id);
console.log(objArray[0].obj_value);
编译后，它将生成以下 JavaScript 代码：
// creating the array of objects
var objArray = [
{ obj_id: 1, obj_value: "TutorialsPoint" },
{ obj_id: 2, obj_value: "TypeScript" },
{ obj_id: 3, obj_value: "Shubham" },
{ obj_id: 4, obj_value: "TutorialsPoint" },
{ obj_id: 5, obj_value: "TypeScript" },
];
console.log("The properties values of the object at the first index in objArray is ");
// accessing the object and its properties
console.log(objArray[0].obj_id);
console.log(objArray[0].obj_value);
输出
以上代码将产生以下输出：
The properties values of the object at the first index in objArray is 1 TutorialsPoint
遍历对象数组
我们可以使用循环遍历对象数组。在遍历数组时，我们可以使用基于零的数组索引访问特定对象。从数组中访问对象后，我们还可以访问对象属性。
语法
用户可以按照以下语法遍历对象数组。
for (let obj of objArray) {
obj.property
}
在上述语法中，我们使用了 for-of 循环遍历对象数组。我们可以通过引用 obj 来访问属性。
示例
在这个例子中，我们使用了 for-of 循环来遍历包含具有不同属性值的多个对象的数组。在 for 循环中，我们得到一个名为 obj 的单个对象，我们可以使用它来访问其属性值。
// creating the array of objects
let objArray = [
{ obj_id: 1, obj_value: "TutorialsPoint" },
{ obj_id: 2, obj_value: "TypeScript" },
{ obj_id: 3, obj_value: "Shubham" },
{ obj_id: 4, obj_value: "TutorialsPoint" },
{ obj_id: 5, obj_value: "TypeScript" },
];
console.log(
"Iterating through the array of objects using the for-of loop and accessing its properties."
);
// using the for-of loop to iterate through the array of objects
for (let obj of objArray) {
console.log("obj_id " + obj.obj_id + " obj_value " + obj.obj_value);
}
编译后，它将生成以下 JavaScript 代码
// creating the array of objects
var objArray = [
{ obj_id: 1, obj_value: "TutorialsPoint" },
{ obj_id: 2, obj_value: "TypeScript" },
{ obj_id: 3, obj_value: "Shubham" },
{ obj_id: 4, obj_value: "TutorialsPoint" },
{ obj_id: 5, obj_value: "TypeScript" },
];
console.log("Iterating through the array of objects using the for-of loop and accessing its properties.");
// using the for-of loop to iterate through the array of objects
for (var _i = 0, objArray_1 = objArray; _i < objArray_1.length; _i++) {
var obj = objArray_1[_i];
console.log("obj_id " + obj.obj_id + " obj_value " + obj.obj_value);
}
输出
以上代码将产生以下输出：
Iterating through the array of objects using the for-of loop and accessing its properties. obj_id 1 obj_value TutorialsPoint obj_id 2 obj_value TypeScript obj_id 3 obj_value Shubham obj_id 4 obj_value TutorialsPoint obj_id 5 obj_value TypeScript
请按照以下步骤进行下一个示例
步骤 1 - 创建一个包含 id、tree_name 和 age 属性的 Tree 接口。还可以使用问号使 age 属性可选。
步骤 2 - 创建名为 trees 的数组，它可以包含 Tree 类型的对象。
步骤 3 - 使用一些对象初始化数组。在下面的示例中，一些对象包含 age 属性，而一些对象不包含，因为它是可选的
步骤 4 - 使用 Array 的 filter() 方法过滤所有年龄大于 20 的对象。
步骤 5 - 在 filter 方法的参数中，传递回调函数，该函数以特定树对象作为参数，并根据树对象是否包含 age 属性以及是否包含 age 属性，以及其值是否大于 20 返回布尔值。
步骤 6 - 打印 filteredTrees 数组。
示例
在这个例子中，我们实现了上述步骤来创建 Tree 对象的数组。此外，我们还使用了 Array 库的 filter() 方法来过滤所有年龄大于 20 的对象。
// Creating the interface for the Tree object
// age is the optional property
interface Tree {
id: number;
tree_name: string;
age?: number;
}
// creating the array of trees
let Trees: Array<Tree> = [
{ id: 10, tree_name: "Palm tree" },
{ id: 15, tree_name: "Guava tree", age: 30 },
{ id: 20, tree_name: "Papita tree", age: 15 },
{ id: 25, tree_name: "Grass tree" },
{ id: 35, tree_name: "Neem tree", age: 21 },
];
// filtering all trees whose age is above 20 years
let filteredTrees: Array<Tree> = Trees.filter((tree) => {
return tree.age ? tree.age > 20 : false;
});
console.log("The all trees whose age is above 20 are");
console.log(filteredTrees);
编译后，它将生成以下 JavaScript 代码：
// creating the array of trees
var Trees = [
{ id: 10, tree_name: "Palm tree" },
{ id: 15, tree_name: "Guava tree", age: 30 },
{ id: 20, tree_name: "Papita tree", age: 15 },
{ id: 25, tree_name: "Grass tree" },
{ id: 35, tree_name: "Neem tree", age: 21 },
];
// filtering all trees whose age is above 20 years
var filteredTrees = Trees.filter(function (tree) {
return tree.age ? tree.age > 20 : false;
});
console.log("The all trees whose age is above 20 are");
console.log(filteredTrees);
输出
以上代码将产生以下输出：
所有年龄大于 20 的树是
[ { id: 15, tree_name: 'Guava tree', age: 30 },
{ id: 35, tree_name: 'Neem tree', age: 21 } ]
用户学习了如何创建对象数组。此外，我们还学习了如何创建具有可选属性的对象并将它们添加到数组中。
此外，我们学习了如何使用 for-of 循环遍历对象数组，但用户也可以使用 for 或 while 循环。此外，我们学习了如何在对象数组中使用 filter() 方法，并且用户还可以使用其他方法，例如 find() 和 sort()。我们需要根据需求优化回调函数。
15K+ 浏览量
