TypeScript - ไวยากรณ์พื้นฐาน

ไวยากรณ์กำหนดชุดของกฎสำหรับการเขียนโปรแกรม ข้อกำหนดทุกภาษากำหนดไวยากรณ์ของตัวเอง โปรแกรม TypeScript ประกอบด้วย -

• Modules
• Functions
• Variables
• คำสั่งและนิพจน์
• Comments

รหัส TypeScript แรกของคุณ

เริ่มต้นด้วยตัวอย่าง "Hello World" แบบดั้งเดิม -

var message:string = "Hello World" 
console.log(message)

ในการคอมไพล์จะสร้างโค้ด JavaScript ต่อไปนี้

//Generated by typescript 1.8.10
var message = "Hello World";
console.log(message);

• บรรทัดที่ 1 ประกาศตัวแปรด้วยข้อความชื่อ ตัวแปรเป็นกลไกในการจัดเก็บค่าในโปรแกรม

• บรรทัดที่ 2 พิมพ์ค่าของตัวแปรไปยังพร้อมต์ ในที่นี้คอนโซลหมายถึงหน้าต่างเทอร์มินัล บันทึกฟังก์ชัน()ใช้เพื่อแสดงข้อความบนหน้าจอ

คอมไพล์และรันโปรแกรม TypeScript

ให้เราดูวิธีการคอมไพล์และรันโปรแกรม TypeScript โดยใช้ Visual Studio Code ทำตามขั้นตอนด้านล่าง -

Step 1- บันทึกไฟล์ด้วยนามสกุล. ts เราจะบันทึกไฟล์เป็น Test.ts ตัวแก้ไขโค้ดจะทำเครื่องหมายข้อผิดพลาดในโค้ด (ถ้ามี) ขณะที่คุณบันทึก

Step 2- คลิกขวาที่ไฟล์ TypeScript ภายใต้ตัวเลือก Working Files ในบานหน้าต่างสำรวจของ VS Code เลือกเปิดในตัวเลือกพร้อมรับคำสั่ง

Step 3 - ในการคอมไพล์ไฟล์ให้ใช้คำสั่งต่อไปนี้บนหน้าต่างเทอร์มินัล

tsc Test.ts

Step 4- ไฟล์ถูกคอมไพล์เป็น Test.js ในการรันโปรแกรมที่เขียนขึ้นให้พิมพ์ดังต่อไปนี้ในเทอร์มินัล

node Test.js

ธงคอมไพเลอร์

แฟล็กคอมไพเลอร์ช่วยให้คุณสามารถเปลี่ยนลักษณะการทำงานของคอมไพลเลอร์ในระหว่างการคอมไพล์ แฟล็กคอมไพเลอร์แต่ละรายการจะแสดงการตั้งค่าที่อนุญาตให้คุณเปลี่ยนวิธีการทำงานของคอมไพลเลอร์

ตารางต่อไปนี้แสดงรายการแฟล็กทั่วไปที่เกี่ยวข้องกับคอมไพเลอร์ TSC การใช้งานบรรทัดคำสั่งโดยทั่วไปจะใช้สวิตช์บางส่วนหรือทั้งหมด

ส.	แฟล็กคอมไพเลอร์และคำอธิบาย
1.	--help แสดงคู่มือช่วยเหลือ
2.	--module โหลดโมดูลภายนอก
3.	--target กำหนดเวอร์ชัน ECMA เป้าหมาย
4.	--declaration สร้างไฟล์. d.ts เพิ่มเติม
5.	--removeComments ลบความคิดเห็นทั้งหมดออกจากไฟล์เอาต์พุต
6.	--out รวบรวมไฟล์หลายไฟล์เป็นไฟล์เอาต์พุตเดียว
7.	--sourcemap สร้างไฟล์ sourcemap (.map)
8.	--module noImplicitAny ปิดการใช้งานคอมไพลเลอร์จากการอนุมานประเภทใด ๆ
9.	--watch เฝ้าดูการเปลี่ยนแปลงไฟล์และคอมไพล์ใหม่ได้ทันที

Note - สามารถรวบรวมไฟล์ได้หลายไฟล์พร้อมกัน

tsc file1.ts, file2.ts, file3.ts

ตัวระบุใน TypeScript

ตัวระบุคือชื่อที่กำหนดให้กับองค์ประกอบในโปรแกรมเช่นตัวแปรฟังก์ชัน ฯลฯ กฎสำหรับตัวระบุคือ -

• ตัวระบุอาจมีทั้งอักขระและตัวเลข อย่างไรก็ตามตัวระบุไม่สามารถขึ้นต้นด้วยตัวเลข

• ตัวระบุไม่สามารถใส่สัญลักษณ์พิเศษยกเว้นขีดล่าง (_) หรือเครื่องหมายดอลลาร์ ($)

• ตัวระบุไม่สามารถเป็นคำหลัก

• พวกเขาต้องมีเอกลักษณ์

• ตัวระบุเป็นกรณี ๆ ไป

• ตัวระบุต้องไม่มีช่องว่าง

ตารางต่อไปนี้แสดงตัวอย่างของตัวระบุที่ถูกต้องและไม่ถูกต้อง -

ตัวระบุที่ถูกต้อง	ตัวระบุไม่ถูกต้อง
ชื่อจริง	Var
ชื่อจริง	ชื่อจริง
num1	ชื่อจริง
ผลลัพธ์ $	1 หมายเลข

TypeScript ─คำหลัก

คำหลักมีความหมายพิเศษในบริบทของภาษา ตารางต่อไปนี้แสดงรายการคำหลักบางคำใน TypeScript

หยุดพัก	เช่น	ใด ๆ	สวิตซ์
กรณี	ถ้า	โยน	อื่น
หลากหลาย	จำนวน	สตริง	ได้รับ
โมดูล	ชนิด	อินสแตนซ์ของ	ประเภทของ
สาธารณะ	เอกชน	enum	ส่งออก
ในที่สุด	สำหรับ	ในขณะที่	เป็นโมฆะ
โมฆะ	สุดยอด	นี้	ใหม่
ใน	กลับ	จริง	เท็จ
ใด ๆ	ขยาย	คงที่	ปล่อย
แพ็คเกจ	ดำเนินการ	อินเตอร์เฟซ	ฟังก์ชัน
ใหม่	ลอง	ผลผลิต	const
ดำเนินการต่อ	ทำ	จับ

ช่องว่างและเส้นแบ่ง

TypeScript ละเว้นช่องว่างแท็บและบรรทัดใหม่ที่ปรากฏในโปรแกรม คุณสามารถใช้ช่องว่างแท็บและบรรทัดใหม่ได้อย่างอิสระในโปรแกรมของคุณและคุณมีอิสระในการจัดรูปแบบและเยื้องโปรแกรมของคุณอย่างเป็นระเบียบและสม่ำเสมอซึ่งทำให้โค้ดอ่านและเข้าใจได้ง่าย

TypeScript คำนึงถึงขนาดตัวพิมพ์

TypeScript คำนึงถึงขนาดตัวพิมพ์ ซึ่งหมายความว่า TypeScript แยกความแตกต่างระหว่างอักขระตัวพิมพ์ใหญ่และตัวพิมพ์เล็ก

อัฒภาคเป็นทางเลือก

คำสั่งแต่ละบรรทัดเรียกว่า a statement. อัฒภาคเป็นทางเลือกใน TypeScript

Example

console.log("hello world")
console.log("We are learning TypeScript")

บรรทัดเดียวสามารถมีหลายคำสั่ง อย่างไรก็ตามข้อความเหล่านี้ต้องคั่นด้วยอัฒภาค

ความคิดเห็นใน TypeScript

ความคิดเห็นเป็นวิธีหนึ่งในการปรับปรุงความสามารถในการอ่านของโปรแกรม ข้อคิดเห็นสามารถใช้เพื่อรวมข้อมูลเพิ่มเติมเกี่ยวกับโปรแกรมเช่นผู้เขียนโค้ดคำแนะนำเกี่ยวกับฟังก์ชัน / โครงสร้าง ฯลฯ คอมไพเลอร์ไม่สนใจความคิดเห็น

TypeScript รองรับความคิดเห็นประเภทต่อไปนี้ -

• Single-line comments ( // ) - ข้อความใด ๆ ระหว่าง a // และท้ายบรรทัดจะถือว่าเป็นความคิดเห็น

• Multi-line comments (/* */) - ความคิดเห็นเหล่านี้อาจครอบคลุมหลายบรรทัด

Example

//this is single line comment 
 
/* This is a  
   Multi-line comment 
*/

TypeScript และ Object Orientation

TypeScript คือ JavaScript เชิงวัตถุ Object Orientation เป็นกระบวนทัศน์การพัฒนาซอฟต์แวร์ที่เป็นไปตามการสร้างแบบจำลองในโลกแห่งความจริง Object Orientation ถือว่าโปรแกรมเป็นชุดของอ็อบเจ็กต์ที่สื่อสารกันผ่านกลไกที่เรียกว่าเมธอด TypeScript สนับสนุนส่วนประกอบเชิงวัตถุเหล่านี้ด้วย

• Object- วัตถุคือการแสดงตามเวลาจริงของเอนทิตีใด ๆ ตาม Grady Brooch วัตถุทุกชิ้นต้องมีคุณสมบัติสามประการ -

  • State - อธิบายโดยคุณลักษณะของวัตถุ

  • Behavior - อธิบายว่าวัตถุจะทำงานอย่างไร

  • Identity - ค่าเฉพาะที่แยกความแตกต่างของวัตถุจากชุดของวัตถุที่คล้ายกัน

• Class- คลาสในแง่ของ OOP คือพิมพ์เขียวสำหรับสร้างวัตถุ คลาสห่อหุ้มข้อมูลสำหรับออบเจ็กต์

• Method - วิธีการอำนวยความสะดวกในการสื่อสารระหว่างวัตถุ

Example: TypeScript and Object Orientation

class Greeting { 
   greet():void { 
      console.log("Hello World!!!") 
   } 
} 
var obj = new Greeting(); 
obj.greet();

ตัวอย่างข้างต้นกำหนดระดับอวยพร ชั้นมีวิธีการทักทาย () วิธีนี้จะพิมพ์สตริง“ Hello World” บนเทอร์มินัล newคีย์เวิร์ดสร้างอ็อบเจกต์ของคลาส (obj) วัตถุที่เรียกวิธีการทักทาย ()

ในการคอมไพล์จะสร้างโค้ด JavaScript ต่อไปนี้

//Generated by typescript 1.8.10
var Greeting = (function () {
   function Greeting() {
   }
   Greeting.prototype.greet = function () {
      console.log("Hello World!!!");
   };
	return Greeting;
}());

var obj = new Greeting();
obj.greet()

ผลลัพธ์ของโปรแกรมข้างต้นแสดงไว้ด้านล่าง -

Hello World!!!