資料結構
網路
關係資料庫管理系統(RDBMS)
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C語言程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會研究
服裝研究
法律研究如何在TypeScript中建立物件？
物件包含其屬性的鍵值對，或者它可以是TypeScript中類的例項。類及其物件是面向物件程式設計的基礎。因此，沒有物件，OOP就不存在。主要使用物件來呼叫類的非靜態方法。
在TypeScript中定義物件有多種方法。我們將在下面逐一學習所有定義物件的方法。
使用物件字面量表示法建立物件
物件字面量表示法意味著我們可以使用兩個大括號建立物件。透過逗號分隔，我們需要在大括號內定義物件的鍵值對屬性。
語法
下面的語法顯示瞭如何使用物件字面量表示法定義物件並插入屬性。
let object = {
key1: Value1,
key2: value2,
}
示例1
在下面的示例中，我們建立了Employee介面，我們將使用它來定義員工物件的型別。Employee介面包含emp_name、department和joining_date共3個屬性。
之後，我們建立了型別為Employee的emp物件，其中包含不同的屬性值。最後，我們列印了emp物件的屬性值。
// Employee interface to define the object type
interface Employee {
emp_name: string;
department: string;
joining_date: Date;
}
// Creating an object of the Employee type
let emp: Employee = {
emp_name: "Shubham",
department: "Writing",
joining_date: new Date(),
};
// Printing the object information
console.log(
"The joining date of the " +
emp.emp_name +
" into the " +
emp.department +
" department is " +
emp.joining_date
)
編譯後，它將生成以下JavaScript程式碼：
// Creating an object of the Employee type
var emp = {
emp_name: "Shubham",
department: "Writing",
joining_date: new Date()
};
// Printing the object information
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()函式。
// Type declaration for the Car object
interface Car {
model: string;
color: string;
model_year: number;
}
// function whic returns the car info
function object_func(car: Car): string {
return "The " + car.model + " is developed in the year " + car.model_year;
}
// Calling the object_func with anonymous object of the Car type
console.log(object_func({ model: "Verna SX", color: "black", model_year: 2016 }));
編譯後，它將生成以下JavaScript程式碼：
// function whic returns the car info
function object_func(car) {
return "The " + car.model + " is developed in the year " + car.model_year;
}
// Calling the object_func with anonymous object of the Car type
console.log(object_func({ model: "Verna SX", color: "black", model_year: 2016 }));
輸出
上述程式碼將產生以下輸出：
The Verna SX is developed in the year 2016
使用建構函式定義物件
建構函式是一種類或物件方法，當我們建立物件時，它總是首先被呼叫。建構函式將值作為引數，我們可以使用該引數值來初始化物件或類的屬性。
語法
使用者可以按照以下語法定義Number類的物件。此外，我們還將value作為建構函式的引數傳遞。
let number_obj = new Number(value);
在上面的語法中，我們使用了箭頭函式作為回撥函式。
示例1
下面的示例包含table類。在table類中，我們為table定義了color和size屬性。此外，我們使用constructor關鍵字為table類建立了建構函式，它將table_color和table_size作為引數。每次我們建立table類的物件並初始化table類的table和size屬性時，都會呼叫建構函式。
之後，我們使用table類建構函式建立了table1物件，並將table的顏色和大小作為引數傳遞。在輸出中，使用者可以看到table1物件的屬性值已更改。
// Creating the table class
class table {
// defining the properties of the table class with default values
color: string = "black";
size: string = "19 x 19 inches";
// constructor of the table class
constructor(table_color: string, table_size: string) {
this.color = table_color;
this.size = table_size;
}
}
// creating the object of the table class with constructor arguments
let table1 = new table("white", "4 x 4 feet");
// printing the information of the table1 object
console.log("The color of table1 is " + table1.color);
console.log("The size of the table1 is " + table1.size);
編譯後，它將生成以下JavaScript程式碼：
// Creating the table class
var table = /** @class */ (function () {
// constructor of the table class
function table(table_color, table_size) {
// defining the properties of the table class with default values
this.color = "black";
this.size = "19 x 19 inches";
this.color = table_color;
this.size = table_size;
}
return table;
}());
// creating the object of the table class with constructor arguments
var table1 = new table("white", "4 x 4 feet");
// printing the information of the table1 object
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
在下面的示例中，我們定義了名為constructor的函式。它將字串值作為第一個引數，數字值作為第二個引數，函式作為第三個引數，並將這些值分配給它的屬性，即property1、property2和property3。
在TypeScript中，我們可以使用任何函式作為建構函式並建立其物件例項。在這裡，我們使用了constructor()函式作為建構函式來建立一個new_object。之後，我們呼叫了new_object的property3()函式。
// Define the constructor function
function constructor(value1: string, value2: number, value3: Function) {
this.property1 = value1;
this.property2 = value2;
// It takes the function as a value
this.property3 = value3;
}
// Creating the new object by passing arguments to constructor,
// Third argument is the function.
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程式碼：
// Defininf the constructor function
function constructor(value1, value2, value3) {
this.property1 = value1;
this.property2 = value2;
// It takes the function as a value
this.property3 = value3;
}
// Creating the new object by passing arguments to constructor,
// Third argument is the function.
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是一個我們要從中建立克隆的物件。
示例
在下面的示例中，我們建立了包含一些屬性的obj物件。之後，我們使用Object.create()方法將obj物件的所有屬性克隆到clone_obj。在輸出中，使用者可以觀察到clone_obj包含與obj相同的屬性及其值。
// Creating the object with key-value pairs
let obj = {
message: "Hello Users!",
property1: "TutorialsPoint",
Property2: 90
};
// cloning the obj using the Object.create() method
let clone_obj = Object.create(obj);
console.log(
"Printing the information of the clone_obj is " +
clone_obj.message +
" " +
clone_obj.property1
);
編譯後，它將生成以下JavaScript程式碼：
// Creating the object with key-value pairs
var obj = {
message: "Hello Users!",
property1: "TutorialsPoint",
Property2: 90
};
// cloning the obj using the Object.create() method
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中建立物件的方法。使用者可以根據需要建立物件的情況，使用物件字面量表示法或建構函式表示法。
17K+ 次瀏覽
