สวัสดี วันนี้ฉันต้องการแบ่งปันความรู้เกี่ยวกับฟังก์ชันใน typescript
ฟังก์ชั่นในจาวาสคริปต์ธรรมดา
ในจาวาสคริปต์เรามักจะสร้างฟังก์ชันเช่นนี้
function greetings(name, count) {
return "I am a basic javascript greetings function";
}
ชื่อและการนับนี้คือ 2 พารามิเตอร์ที่ส่งไปยังฟังก์ชันนี้ แต่ไม่ทราบประเภทของพารามิเตอร์ที่ส่งผ่าน
และในจาวาสคริปต์ พารามิเตอร์ทั้งหมดเป็นทางเลือก ดังนั้นหากคุณไม่ส่งพารามิเตอร์ใด ๆ เหล่านี้ไปยังฟังก์ชันของคุณ จะไม่ทำให้คุณมีข้อผิดพลาด นอกจากนี้หากคุณส่งพารามิเตอร์มากกว่า 2 พารามิเตอร์ไปยังฟังก์ชันด้านบน มันก็จะไม่เกิดข้อผิดพลาดใดๆ
ฟังก์ชั่นใน typescript
ดังนั้นเราจึงสามารถปรับปรุงฟังก์ชั่นของเราเพื่อทำความเข้าใจโค้ดและแก้ไขข้อผิดพลาดด้วย typescript
function greetings(name: string, count?: number): string {
return "I am a better javascript greetings function";
}
ที่นี่เรากำหนดประเภทพารามิเตอร์ของเราด้วย string
และ number
หมายความว่าพารามิเตอร์ชื่อจะเป็นสตริงเสมอ และพารามิเตอร์การนับจะเป็นตัวเลขเสมอ
นอกเหนือจากนั้น พารามิเตอร์ name
นั้นจำเป็นต้องระบุ และ ?
ข้างพารามิเตอร์ count
จะกำหนดให้เป็นพารามิเตอร์ทางเลือกที่นี่
ดังนั้นจึงหมายความว่าหาก คุณไม่ให้ name
พารามิเตอร์กับฟังก์ชันด้านบน มันจะทำให้เกิดข้อผิดพลาด และหากคุณส่งพารามิเตอร์มากกว่า 2 พารามิเตอร์ไปยังฟังก์ชันด้านบน มันก็จะทำให้เกิดข้อผิดพลาดอีกครั้ง
และคำ : string
หลังวงเล็บฟังก์ชันแสดงว่าฟังก์ชันคำทักทายจะส่งกลับเอาต์พุตในประเภท string
ตรงนี้เราได้เรียนรู้สิ่งเหล่านี้เกี่ยวกับฟังก์ชันต่างๆ
- ประเภทพารามิเตอร์ของฟังก์ชัน
- พารามิเตอร์ทั้งหมดจำเป็นในฟังก์ชัน typescript
- อย่างไรก็ตาม เราสามารถกำหนดพารามิเตอร์เพิ่มเติมได้ด้วยเครื่องหมาย
?
- ประเภทการส่งคืนฟังก์ชัน
พารามิเตอร์เริ่มต้นเริ่มต้น
นอกจากนี้เรายังสามารถเริ่มต้นพารามิเตอร์ของเราด้วยค่าเริ่มต้น และมันทำให้เรามีความยืดหยุ่นในการเรียกใช้ฟังก์ชันของเราโดยไม่ต้องใช้พารามิเตอร์
function greetings(name: string = 'Human'): string {
return `Hello ${name}`;
}
greetings(); //Hello Human
greetings('Ben'); //Hello Ben
ฟังก์ชันลูกศรใน typescript
ตอนนี้ฉันจะแปลงฟังก์ชันด้านบน greetings
เป็นฟังก์ชันลูกศร
const greetings = (name: string = 'Human'): string => {
return `Hello ${name}`;
}
ถ้าฟังก์ชันของคุณเป็นแบบซับเดียว คุณก็เขียนแบบนี้ได้เช่นกัน
const greetings = (name: string = 'Human'): string => return `Hello ${name}`;
ประเภทของฟังก์ชัน
ประเภทของฟังก์ชันประกอบด้วยประเภทของอาร์กิวเมนต์และประเภทการส่งคืน ตัวอย่างเช่นที่นี่
let logOutput: (value: string) => void;
ประเภทของพารามิเตอร์ logOutput
ต้องเป็น 'ฟังก์ชันที่ยอมรับสตริงและส่งกลับประเภทเป็นโมฆะ'
เราสามารถใช้มันเช่นนี้
const logMessage = (message: string): void => console.log(message);
const logError = (err: string): void => console.error(err);
ที่นี่ทั้งสองฟังก์ชันใช้พารามิเตอร์สตริงและส่งคืนประเภทโมฆะหรือคุณอาจบอกว่าไม่มี return
บล็อก ตอนนี้เราใช้ logOutput
เช่นนี้
if(value === '') {
logOutput = logError;
} else {
logOutput = logMessage;
}
บทสรุป
- ฟังก์ชัน typescript ใช้งานง่ายและอ่านง่าย
- รวมความยืดหยุ่นไว้เช่นเดียวกับที่คุณสามารถกำหนดพารามิเตอร์เสริมให้กับฟังก์ชันได้
- ทำความสะอาดไวยากรณ์ด้วยฟังก์ชันลูกศรใน typescript
อย่าลังเลที่จะเชื่อมต่อกับ Twitter