TypeScript - Cú pháp cơ bản
Cú pháp xác định một tập hợp các quy tắc để viết chương trình. Mỗi đặc tả ngôn ngữ xác định cú pháp riêng của nó. Một chương trình TypeScript bao gồm:
- Modules
- Functions
- Variables
- Tuyên bố và biểu thức
- Comments
Mã TypeScript đầu tiên của bạn
Chúng ta hãy bắt đầu với ví dụ “Hello World” truyền thống -
var message:string = "Hello World"
console.log(message)Khi biên dịch, nó sẽ tạo mã JavaScript sau.
//Generated by typescript 1.8.10
var message = "Hello World";
console.log(message);Dòng 1 khai báo một biến bằng thông báo tên. Biến là một cơ chế để lưu trữ các giá trị trong một chương trình.
Dòng 2 in giá trị của biến vào dấu nhắc. Ở đây, bảng điều khiển đề cập đến cửa sổ đầu cuối. Hàm log () được sử dụng để hiển thị văn bản trên màn hình.
Biên dịch và thực thi chương trình TypeScript
Hãy để chúng tôi xem cách biên dịch và thực thi chương trình TypeScript bằng Visual Studio Code. Làm theo các bước dưới đây -
Step 1- Lưu tệp với phần mở rộng .ts. Chúng tôi sẽ lưu tệp dưới dạng Test.ts. Trình chỉnh sửa mã đánh dấu các lỗi trong mã, nếu có, trong khi bạn lưu nó.
Step 2- Nhấp chuột phải vào tệp TypeScript trong tùy chọn Tệp Làm việc trong Ngăn Khám phá của Mã VS. Chọn tùy chọn Mở trong Dấu nhắc Lệnh.
Step 3 - Để biên dịch tập tin, sử dụng lệnh sau trên cửa sổ terminal.
tsc Test.tsStep 4- Tập tin được biên dịch thành Test.js. Để chạy chương trình đã viết, hãy nhập dòng sau vào terminal.
node Test.jsCờ biên dịch
Cờ trình biên dịch cho phép bạn thay đổi hành vi của trình biên dịch trong quá trình biên dịch. Mỗi cờ trình biên dịch hiển thị một cài đặt cho phép bạn thay đổi cách trình biên dịch hoạt động.
Bảng sau liệt kê một số cờ phổ biến được liên kết với trình biên dịch TSC. Cách sử dụng dòng lệnh điển hình sử dụng một số hoặc tất cả các công tắc.
| Không. | Cờ biên dịch & Mô tả |
|---|---|
| 1. | --help Hiển thị hướng dẫn trợ giúp |
| 2. | --module Tải các mô-đun bên ngoài |
| 3. | --target Đặt phiên bản ECMA mục tiêu |
| 4. | --declaration Tạo tệp .d.ts bổ sung |
| 5. | --removeComments Xóa tất cả nhận xét khỏi tệp đầu ra |
| 6. | --out Biên dịch nhiều tệp thành một tệp đầu ra duy nhất |
| 7. | --sourcemap Tạo tệp bản đồ nguồn (.map) |
| số 8. | --module noImplicitAny Không cho phép trình biên dịch suy ra bất kỳ loại nào |
| 9. | --watch Theo dõi các thay đổi tệp và biên dịch lại chúng một cách nhanh chóng |
Note - Nhiều tệp có thể được biên dịch cùng một lúc.
tsc file1.ts, file2.ts, file3.tsSố nhận dạng trong TypeScript
Số nhận dạng là tên được đặt cho các phần tử trong một chương trình như biến, hàm, v.v. Các quy tắc cho số nhận dạng là:
Số nhận dạng có thể bao gồm cả ký tự và chữ số. Tuy nhiên, mã định danh không thể bắt đầu bằng một chữ số.
Số nhận dạng không được bao gồm các ký hiệu đặc biệt ngoại trừ dấu gạch dưới (_) hoặc dấu đô la ($).
Số nhận dạng không được là từ khóa.
Chúng phải là duy nhất.
Số nhận dạng phân biệt chữ hoa chữ thường.
Số nhận dạng không được chứa khoảng trắng.
Các bảng sau liệt kê một số ví dụ về số nhận dạng hợp lệ và không hợp lệ:
| Số nhận dạng hợp lệ | Số nhận dạng không hợp lệ |
|---|---|
| tên đầu tiên | Var |
| tên đầu tiên | tên đầu tiên |
| num1 | tên đầu tiên |
| $ kết quả | 1 số |
TypeScript ─ Từ khóa
Từ khóa có một ý nghĩa đặc biệt trong ngữ cảnh của một ngôn ngữ. Bảng sau liệt kê một số từ khóa trong TypeScript.
| phá vỡ | như | bất kì | công tắc điện |
| trường hợp | nếu | phi | khác |
| var | con số | chuỗi | được |
| mô-đun | kiểu | ví dụ | loại |
| công cộng | riêng tư | enum | xuất khẩu |
| cuối cùng | cho | trong khi | vô hiệu |
| vô giá trị | siêu | điều này | Mới |
| trong | trở về | thật | sai |
| bất kì | kéo dài | tĩnh | để cho |
| gói hàng | dụng cụ | giao diện | chức năng |
| Mới | thử | năng suất | hăng sô |
| tiếp tục | làm | nắm lấy |
Khoảng trắng và ngắt dòng
TypeScript bỏ qua khoảng trắng, tab và dòng mới xuất hiện trong chương trình. Bạn có thể thoải mái sử dụng khoảng trắng, tab và dòng mới trong chương trình của mình và bạn có thể tự do định dạng và thụt lề chương trình của mình theo cách gọn gàng và nhất quán giúp mã dễ đọc và dễ hiểu.
TypeScript phân biệt chữ hoa chữ thường
TypeScript phân biệt chữ hoa chữ thường. Điều này có nghĩa là TypeScript phân biệt giữa các ký tự viết hoa và viết thường.
Dấu chấm phẩy là tùy chọn
Mỗi dòng lệnh được gọi là statement. Dấu chấm phẩy là tùy chọn trong TypeScript.
Example
console.log("hello world")
console.log("We are learning TypeScript")Một dòng đơn có thể chứa nhiều câu lệnh. Tuy nhiên, các câu lệnh này phải được phân tách bằng dấu chấm phẩy.
Nhận xét trong TypeScript
Nhận xét là một cách để cải thiện khả năng đọc của chương trình. Nhận xét có thể được sử dụng để bao gồm thông tin bổ sung về một chương trình như tác giả của mã, gợi ý về một hàm / cấu trúc, v.v. Nhận xét bị trình biên dịch bỏ qua.
TypeScript hỗ trợ các loại nhận xét sau:
Single-line comments ( // ) - Bất kỳ văn bản nào giữa // và cuối dòng đều được coi là bình luận
Multi-line comments (/* */) - Những bình luận này có thể kéo dài nhiều dòng.
Example
//this is single line comment
/* This is a
Multi-line comment
*/TypeScript và Hướng đối tượng
TypeScript là JavaScript hướng đối tượng. Hướng đối tượng là một mô hình phát triển phần mềm tuân theo mô hình thế giới thực. Hướng đối tượng coi một chương trình là một tập hợp các đối tượng giao tiếp với nhau thông qua cơ chế gọi là các phương thức. TypeScript cũng hỗ trợ các thành phần hướng đối tượng này.
Object- Một đối tượng là một đại diện thời gian thực của bất kỳ thực thể nào. Theo Grady Brooch, mọi vật thể phải có ba đặc điểm:
State - được mô tả bởi các thuộc tính của một đối tượng
Behavior - mô tả cách đối tượng sẽ hoạt động
Identity - một giá trị duy nhất để phân biệt một đối tượng với một tập hợp các đối tượng tương tự như vậy.
Class- Một lớp về mặt OOP là một bản thiết kế để tạo các đối tượng. Một lớp đóng gói dữ liệu cho đối tượng.
Method - Phương pháp tạo điều kiện giao tiếp giữa các đối tượng.
Example: TypeScript and Object Orientation
class Greeting {
greet():void {
console.log("Hello World!!!")
}
}
var obj = new Greeting();
obj.greet();Ví dụ trên định nghĩa một lời chào lớp . Lớp có một phương thức welcome () . Phương thức in chuỗi “Hello World” trên thiết bị đầu cuối. Cácnewtừ khóa tạo một đối tượng của lớp (obj). Đối tượng gọi phương thức welcome () .
Khi biên dịch, nó sẽ tạo mã JavaScript sau.
//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()Đầu ra của chương trình trên được đưa ra dưới đây:
Hello World!!!