Ch&agrave;o mừng bạn đến với kh&oacute;a học Lập tr&igrave;nh TypeScript tại TEK4.VN. Trong kh&oacute;a học n&agrave;y, ch&uacute;ng ta sẽ học c&aacute;c kh&aacute;i niệm cơ bản của TypeScript.&nbsp;
<h2 style="text-align: justify;">Y&ecirc;u cầu kiến thức</h2>
Để tham gia kh&oacute;a học, bạn cần c&oacute; kiến thức cơ bản về JavaScript (TEK4.VN đang triển khai). V&igrave; kh&oacute;a học n&agrave;y bao h&agrave;m c&aacute;c kh&aacute;i niệm kh&aacute;c nhau trong TypeScript n&ecirc;n cũng cần nắm th&ecirc;m một số kiến thức về ph&aacute;t triển web như <a href="https://tek4.vn/khoa-hoc/lap-trinh-giao-dien-voi-html-css">HTML &amp; CSS</a>
<h3 style="text-align: justify;">TypeScript cơ bản d&agrave;nh cho người mới bắt đầu</h3>
Giải th&iacute;ch về TypeScript cơ bản v&agrave; c&aacute;c kh&aacute;i niệm li&ecirc;n quan. Bao gồm c&aacute;c chương:
<ol>
<li>Giới thiệu</li>
<li>C&aacute;c kiến thức cơ bản về biến</li>
<li>Enum</li>
<li>Kiểu Generic</li>
<li>H&agrave;m</li>
<li>Kiểu dẫn xuất</li>
<li>Đối tượng</li>
<li>K&yacute; hiệu chỉ số</li>
<li>C&aacute;c kiến thức n&acirc;ng cao về biến</li>
<li>Ngoại lệ</li>
<li>B&iacute; danh</li>
<li>Kiểm tra kiểu</li>
<li>Iterator</li>
<li>Thao t&aacute;c đối tượng v&agrave; mảng</li>
<li>Chia sẻ m&atilde; nguồn</li>
<li>Kết luận</li>
</ol>

Lập trình TypeScript cơ bản

B&agrave;i học n&agrave;y giới thiệu về c&uacute; ph&aacute;p destructure mảng.
<h2 style="text-align: justify;">Trường hợp 1: Di chuyển dữ liệu v&agrave;o biến</h2>
Array Destructuring (B&oacute;c t&aacute;ch dữ liệu từ mảng) l&agrave; một kỹ thuật cho ph&eacute;p bạn di chuyển dữ liệu từ mảng v&agrave;o c&aacute;c biến ri&ecirc;ng biệt, ho&aacute;n đổi dữ liệu hoặc thu thập c&aacute;c phần tử c&ograve;n lại của mảng.
Trường hợp đầu ti&ecirc;n l&agrave; di chuyển dữ liệu v&agrave;o biến. Ph&eacute;p g&aacute;n bắt đầu bằng c&aacute;ch đặt ở ph&iacute;a b&ecirc;n tr&aacute;i của dấu bằng c&aacute;c biến kh&aacute;c nhau trong dấu ngoặc vu&ocirc;ng, ph&acirc;n t&aacute;ch bằng dấu phẩy. Ở ph&iacute;a b&ecirc;n phải l&agrave; mảng.
<pre class="language-ts" data-content="let%20%5Barr1%2C%20arr2%5D%20%3D%20%5B1%2C%202%5D%3B%20%2F%2F%201%20and%202%0Alet%20%5Barr3%2C%20arr4%5D%20%3D%20%5B1%2C%202%2C%203%2C%204%5D%3B%20%2F%2F%201%20and%202%0Aconsole.log(arr1)%3B%0Aconsole.log(arr2)%3B%0Aconsole.log(arr3)%3B%0Aconsole.log(arr4)%3B" data-language="ts" data-ace-language="typescript" data-name-language="TypeScript" data-main-file="main.ts"><code>let [arr1, arr2] = [1, 2]; // 1 and 2
let [arr3, arr4] = [1, 2, 3, 4]; // 1 and 2
console.log(arr1);
console.log(arr2);
console.log(arr3);
console.log(arr4);</code></pre>
<h2 style="text-align: justify;">Trường hợp 2: Sử dụng to&aacute;n tử rest</h2>
Bạn c&oacute; thể sử dụng to&aacute;n tử rest (...) để đưa tất cả c&aacute;c phần tử c&ograve;n lại của mảng v&agrave;o một mảng nhỏ hơn. To&aacute;n tử n&agrave;y c&oacute; thể hữu &iacute;ch khi bạn c&oacute; nhiều dữ liệu v&agrave; muốn lấy một tập dữ liệu con v&agrave; vẫn giữ một tham chiếu đến c&aacute;c phần tử c&ograve;n lại. Một trường hợp cụ thể l&agrave; khi bạn biết rằng ba phần tử đầu chứa dữ liệu cố định, nhưng c&aacute;c phần tử c&ograve;n lại th&igrave; thay đổi linh hoạt t&ugrave;y v&agrave;o t&igrave;nh huống. Bạn c&oacute; thể bỏ qua một số phần tử bằng c&aacute;ch sử dụng dấu phẩy m&agrave; kh&ocirc;ng chỉ định biến.
<pre class="language-ts" data-content="let%20%5Barr1%2C%20arr2%5D%20%3D%20%5B1%2C%202%5D%3B%20%2F%2F%201%20and%202%0Alet%20%5Barr3%2C%20arr4%5D%20%3D%20%5B1%2C%202%2C%203%2C%204%5D%3B%20%2F%2F%201%20and%202%0Alet%20%5Barr5%2C%20arr6%2C%20...elements%5D%20%3D%20%5B1%2C%202%2C%203%2C%204%2C%205%5D%3B%20%2F%2F%201%20and%202%20and%20%5B3%2C4%2C5%5D%0Alet%20%5Barr7%2C%20arr8%2C%20%2C%20...elements2%5D%20%3D%20%5B1%2C%202%2C%203%2C%204%2C%205%5D%3B%20%2F%2F%201%20and%202%20and%20%5B4%2C5%5D%0Aconsole.log(arr1)%3B%0Aconsole.log(arr2)%3B%0Aconsole.log(arr3)%3B%0Aconsole.log(arr4)%3B%0Aconsole.log(arr5)%3B%0Aconsole.log(arr6)%3B%0Aconsole.log(elements)%3B%0Aconsole.log(arr7)%3B%0Aconsole.log(arr8)%3B%0Aconsole.log(elements2)%3B" data-language="ts" data-ace-language="typescript" data-name-language="TypeScript" data-main-file="main.ts"><code>let [arr1, arr2] = [1, 2]; // 1 and 2
let [arr3, arr4] = [1, 2, 3, 4]; // 1 and 2
let [arr5, arr6, ...elements] = [1, 2, 3, 4, 5]; // 1 and 2 and [3,4,5]
let [arr7, arr8, , ...elements2] = [1, 2, 3, 4, 5]; // 1 and 2 and [4,5]
console.log(arr1);
console.log(arr2);
console.log(arr3);
console.log(arr4);
console.log(arr5);
console.log(arr6);
console.log(elements);
console.log(arr7);
console.log(arr8);
console.log(elements2);</code></pre>
<h2 style="text-align: justify;">Trường hợp 3: Ho&aacute;n đổi gi&aacute; trị của hai biến</h2>
Ngo&agrave;i ra, khi destructure mảng, bạn c&oacute; thể ho&aacute;n đổi gi&aacute; trị của hai biến. Trước ti&ecirc;n bạn cần phải c&oacute; hai biến c&ugrave;ng kiểu dữ liệu. Sau đ&oacute;, bạn mở dấu ngoặc vu&ocirc;ng, đặt hai biến cần ho&aacute;n đổi, ph&acirc;n t&aacute;ch bằng dấu phẩy, sau đ&oacute; đ&oacute;ng dấu ngoặc vu&ocirc;ng. Sau dấu bằng vẫn l&agrave; hai biến đ&oacute; đặt trong cặp dấu ngoặc vu&ocirc;ng nhưng đảo ngược thứ tự.
<pre class="language-ts" data-content="let%20swap1%20%3D%201%3B%0Alet%20swap2%20%3D%202%3B%20%5Bswap1%2C%20swap2%5D%20%3D%20%5Bswap2%2C%20swap1%5D%3B%0Aconsole.log(swap1%2C%20swap2)%3B" data-language="ts" data-ace-language="typescript" data-name-language="TypeScript" data-main-file="main.ts"><code>let swap1 = 1;
let swap2 = 2; [swap1, swap2] = [swap2, swap1];
console.log(swap1, swap2);</code></pre>
Destructure mảng l&agrave; một c&aacute;ch tiện lợi để di chuyển dữ liệu một c&aacute;ch nhanh ch&oacute;ng m&agrave; kh&ocirc;ng phải dựa v&agrave;o c&aacute;c thao t&aacute;c rườm r&agrave; để ho&agrave;n th&agrave;nh c&aacute;c nhiệm vụ đơn giản.

Destructuring an Array