TypeScript c&oacute; t&aacute;c động rất lớn đến việc viết clean code bằng JavaScript. Ngo&agrave;i ra, c&ograve;n c&oacute; rất nhiều c&aacute;ch kh&aacute;c hỗ trợ lập tr&igrave;nh vi&ecirc;n ph&aacute;t triển phần mềm dễ d&agrave;ng v&agrave; cải thiện code hơn, v&agrave; một trong số đ&oacute; l&agrave; tu&acirc;n theo nguy&ecirc;n l&yacute; thiết kế SOLID design principles do <a class="au ll" href="https://en.wikipedia.org/wiki/Robert_C._Martin" target="_blank" rel="noopener ugc nofollow">Robert C. Martin</a> (c&ograve;n được gọi l&agrave; Uncle Bob) ph&aacute;t minh.
Trong b&agrave;i viết n&agrave;y, <a href="https://tek4.vn/">Tek4.vn</a> sẽ giới thiệu tới bạn c&aacute;c nguy&ecirc;n l&yacute; c&ugrave;ng c&aacute;c v&iacute; dụ được viết bằng TypeScript đ&atilde; được đ&atilde; triển khai tr&ecirc;n <a href="https://github.com/hellokvn/medium-solid-in-typescript">kho lưu trữ Github n&agrave;y</a>.
&nbsp;
<h2 style="text-align: justify;">Single Responsibility Principle (SRP)</h2>
&ldquo;Kh&ocirc;ng bao giờ n&ecirc;n c&oacute; nhiều hơn một l&yacute; do để thay đổi một <a href="https://en.wikipedia.org/wiki/Class_(computer_programming)">lớp</a>.&rdquo; 
Do đ&oacute;, một lớp n&ecirc;n c&oacute; một nhiệm vụ v&agrave; chỉ một l&yacute; do để thay đổi. Tu&acirc;n theo nguy&ecirc;n l&yacute; n&agrave;y sẽ gi&uacute;p việc bảo tr&igrave; m&atilde; tốt hơn v&agrave; giảm thiểu c&aacute;c lỗi tiềm ẩn.
Trong v&iacute; dụ sau đ&acirc;y, bạn sẽ thấy c&oacute; nhiều mục đ&iacute;ch như thế n&agrave;o. Đầu ti&ecirc;n, ch&uacute;ng ta lập m&ocirc; h&igrave;nh một cuốn s&aacute;ch v&agrave; lưu cuốn s&aacute;ch đ&oacute; dưới dạng tệp. Sau đ&oacute; chạy v&agrave;o hai mục đ&iacute;ch ở đ&acirc;y:
<pre class="language-python"><code>class Book {
 public title: string;
 public author: string;
 public description: string;
 public pages: number;

 // constructor and other methods

 public saveToFile(): void {
 // some fs.write method to save book to file
 }
}</code></pre>
V&iacute; dụ thứ hai cho bạn thấy c&aacute;ch giải quyết vấn đề n&agrave;y bằng c&aacute;ch tu&acirc;n theo SRP. Thay v&igrave; chỉ c&oacute; một lớp, ch&uacute;ng ta c&oacute; hai lớp, một lớp cho mỗi mục đ&iacute;ch.
<pre class="language-python"><code>class Book {
 public title: string;
 public author: string;
 public description: string;
 public pages: number;

 // constructor and other methods
}

class Persistence {
 public saveToFile(book: Book): void {
 // some fs.write method to save book to file
 }
}</code></pre>
&nbsp;
<h2 id="da4f" class="mb mc ja bn md me mf mg mh mi mj mk ml kg mm kh mn kj mo kk mp km mq kn mr ms gc" style="text-align: justify;">Open-Close Principle (OCP)</h2>
&ldquo;C&aacute;c thực thể phần mềm&hellip; n&ecirc;n open để mở rộng, nhưng close để sửa đổi.&rdquo;
Thay v&igrave; ghi đ&egrave; lớp của bạn, tốt hơn n&ecirc;n mở rộng n&oacute;. Sẽ dễ d&agrave;ng mở rộng m&atilde; với c&aacute;c t&iacute;nh năng mới khi chạm v&agrave;o m&atilde; cũ. V&iacute; dụ: việc triển khai một giao diện hoặc một lớp sẽ rất hữu &iacute;ch ở đ&acirc;y. Trong v&iacute; dụ sau, bạn sẽ thấy c&aacute;ch thực hiện bị sai. Lớp thứ ba được sử dụng c&oacute; t&ecirc;n l&agrave; AreaCalculator để t&iacute;nh diện t&iacute;ch của c&aacute;c lớp h&igrave;nh chữ nhật v&agrave; h&igrave;nh tr&ograve;n. H&atilde;y tưởng tượng ch&uacute;ng ta sẽ th&ecirc;m một h&igrave;nh dạng kh&aacute;c sau đ&oacute;, c&oacute; nghĩa l&agrave; ch&uacute;ng ta cần tạo một lớp mới. Trong trường hợp đ&oacute;, ch&uacute;ng ta cũng cần sửa đổi lớp AreaCalculator để t&iacute;nh diện t&iacute;ch của lớp mới. Điều đ&oacute; đi ngược lại nguy&ecirc;n tắc Open-Close.&nbsp;
<pre class="language-python"><code>class Rectangle {
 public width: number;
 public height: number;

 constructor(width: number, height: number) {
 this.width = width;
 this.height = height;
 }
}

class Circle {
 public radius: number;

 constructor(radius: number) {
 this.radius = radius;
 }
}

class AreaCalculator {
 public calculateRectangleArea(rectangle: Rectangle): number {
 return rectangle.width * rectangle.height;
 }

 public calculateCircleArea(circle: Circle): number {
 return Math.PI * (circle.radius * circle.radius);
 }
}</code></pre>
Vậy ch&uacute;ng ta c&oacute; thể l&agrave;m g&igrave; để cải thiện m&atilde; n&agrave;y? Để tu&acirc;n theo nguy&ecirc;n tắc Open-Close, ch&uacute;ng t&ocirc;i th&ecirc;m một giao diện c&oacute; t&ecirc;n l&agrave; Shape, v&igrave; vậy mọi lớp h&igrave;nh dạng (H&igrave;nh chữ nhật, H&igrave;nh tr&ograve;n, v.v.) c&oacute; thể phụ thuộc v&agrave;o giao diện n&agrave;y bằng c&aacute;ch triển khai n&oacute;. Bằng c&aacute;ch n&agrave;y, ch&uacute;ng ta c&oacute; thể đơn giản h&oacute;a lớp AreaCalculator th&agrave;nh chỉ một h&agrave;m, h&agrave;m n&agrave;y nhận đối số v&agrave; đối số n&agrave;y dựa tr&ecirc;n giao diện vừa tạo.
&nbsp;
<h2 id="e2cb" class="mb mc ja bn md me mf mg mh mi mj mk ml kg mm kh mn kj mo kk mp km mq kn mr ms gc" style="text-align: justify;">Liskov Substitution Principle (LSP)</h2>
&ldquo;C&aacute;c h&agrave;m sử dụng con trỏ hoặc tham chiếu đến c&aacute;c lớp cơ sở c&oacute; thể sử dụng c&aacute;c đối tượng của c&aacute;c lớp dẫn xuất m&agrave; kh&ocirc;ng cần biết trước.&rdquo;&nbsp;
Những tầng lớp thấp hơn n&ecirc;n mở rộng tầng lớp tr&ecirc;n chứ kh&ocirc;ng phải thay đổi n&oacute;. V&Iacute; dụ: Ch&uacute;ng t&ocirc;i c&oacute; hai lớp học. Lớp Square mở rộng lớp Rectangle. Nhưng như ch&uacute;ng ta c&oacute; thể thấy, tiện &iacute;ch n&agrave;y kh&ocirc;ng c&oacute; &yacute; nghĩa g&igrave; v&igrave; ch&uacute;ng t&ocirc;i đ&atilde; thay đổi logic bằng c&aacute;ch ghi đ&egrave; chiều rộng v&agrave; chiều cao thuộc t&iacute;nh.
<pre class="language-python"><code>class Rectangle {
 public width: number;
 public height: number;

 constructor(width: number, height: number) {
 this.width = width;
 this.height = height;
 }

 public calculateArea(): number {
 return this.width * this.height;
 }
}

class Square extends Rectangle {
 public _width: number;
 public _height: number;

 constructor(width: number, height: number) {
 super(width, height);

 this._width = width;
 this._height = height;
 }
}</code></pre>
V&igrave; vậy, thay v&igrave; ghi đ&egrave;, ch&uacute;ng t&ocirc;i loại bỏ lớp Square v&agrave; đưa logic của n&oacute; v&agrave;o lớp Rectangle v&agrave; thay đổi mục đ&iacute;ch của n&oacute;.
<pre class="language-python"><code>class Rectangle {
 public width: number;
 public height: number;

 constructor(width: number, height: number) {
 this.width = width;
 this.height = height;
 }

 public calculateArea(): number {
 return this.width * this.height;
 }

 public isSquare(): boolean {
 return this.width === this.height;
 }
}</code></pre>
&nbsp;
<h2 id="3e36" class="mb mc ja bn md me mf mg mh mi mj mk ml kg mm kh mn kj mo kk mp km mq kn mr ms gc" style="text-align: justify;">Interface Segregation Principle (ISP)</h2>
&ldquo;Giao diện d&agrave;nh ri&ecirc;ng cho nhiều kh&aacute;ch h&agrave;ng tốt hơn một giao diện c&oacute; mục đ&iacute;ch chung.&rdquo;&nbsp;
N&oacute;i một c&aacute;ch đơn giản, nhiều giao diện sẽ tốt hơn l&agrave; c&oacute; qu&aacute; &iacute;t. V&iacute; dụ, ch&uacute;ng ta c&oacute; một lớp gọi l&agrave; <code>troll</code>, lớp n&agrave;y thực hiện một giao diện c&oacute; t&ecirc;n l&agrave; Character. Nhưng giao diện Character n&agrave;y c&oacute; vẻ kh&ocirc;ng ph&ugrave; hợp với lớp của ch&uacute;ng t&ocirc;i. Vậy c&acirc;u hỏi đặt ra l&agrave; ch&uacute;ng ta cần phải l&agrave;m g&igrave;? Cần loại bỏ giao diện Character v&agrave; thay v&agrave;o đ&oacute; chia c&aacute;c t&iacute;nh năng của n&oacute; th&agrave;nh bốn giao diện v&agrave; chỉ phụ thuộc v&agrave;o lớp Troll tr&ecirc;n c&aacute;c giao diện cần thiết.&nbsp;
<pre class="language-python"><code>interface Character {
 shoot(): void;
 swim(): void;
 talk(): void;
 dance(): void;
}

class Troll implements Character {
 public shoot(): void {
 // some method
 }
 
 public swim(): void {
 // a troll can't swim
 }

 public talk(): void {
 // a troll can't talk
 }

 public dance(): void {
 // some method
 }
}</code></pre>
V&igrave; vậy, ch&uacute;ng ta c&oacute; thể l&agrave;m g&igrave; với n&oacute; bằng c&aacute;ch tu&acirc;n theo nguy&ecirc;n tắc cụ thể n&agrave;y? Ch&uacute;ng t&ocirc;i loại bỏ giao diện Character v&agrave; thay v&agrave;o đ&oacute; chia c&aacute;c t&iacute;nh năng của n&oacute; th&agrave;nh bốn giao diện v&agrave; chỉ phụ thuộc v&agrave;o lớp Troll của ch&uacute;ng t&ocirc;i tr&ecirc;n c&aacute;c giao diện n&agrave;y m&agrave; ch&uacute;ng t&ocirc;i cần.
<pre class="language-python"><code>interface Talker {
 talk(): void;
}

interface Shooter {
 shoot(): void;
}

interface Swimmer {
 swim(): void;
}

interface Dancer {
 dance(): void;
}

class Troll implements Shooter, Dancer {
 public shoot(): void {
 // some method
 }

 public dance(): void {
 // some method
 }
}</code></pre>
&nbsp;
<h2 id="179b" class="mb mc ja bn md me mf mg mh mi mj mk ml kg mm kh mn kj mo kk mp km mq kn mr ms gc" style="text-align: justify;">Dependency Inversion Principle (DIP)</h2>
&ldquo;Phụ thuộc v&agrave;o sự trừu tượng, [kh&ocirc;ng] cụ thể.&rdquo;
Trong v&iacute; dụ n&agrave;y, ch&uacute;ng ta c&oacute; một lớp SoftwareProject, lớp n&agrave;y khởi tạo c&aacute;c lớp FrontendDeveloper v&agrave; BackendDeveloper. Nhưng đ&acirc;y l&agrave; c&aacute;ch sai v&igrave; hai lớp n&agrave;y rất giống nhau. V&igrave; vậy, c&oacute; một c&aacute;ch tốt hơn để thực hiện c&aacute;c y&ecirc;u cầu đạt được mục ti&ecirc;u của nguy&ecirc;n tắc Dependency Inversion.
<pre class="language-python"><code>class FrontendDeveloper {
 public writeHtmlCode(): void {
 // some method
 }
}

class BackendDeveloper {
 public writeTypeScriptCode(): void {
 // some method
 }
}

class SoftwareProject {
 public frontendDeveloper: FrontendDeveloper;
 public backendDeveloper: BackendDeveloper;

 constructor() {
 this.frontendDeveloper = new FrontendDeveloper();
 this.backendDeveloper = new BackendDeveloper();
 }

 public createProject(): void {
 this.frontendDeveloper.writeHtmlCode();
 this.backendDeveloper.writeTypeScriptCode();
 }
}</code></pre>
Vậy ch&uacute;ng ta cần l&agrave;m g&igrave; với n&oacute;? N&oacute; kh&aacute; đơn giản v&agrave; thậm ch&iacute; c&ograve;n dễ d&agrave;ng hơn v&igrave; ch&uacute;ng ta đ&atilde; học tất cả c&aacute;c nguy&ecirc;n tắc kh&aacute;c trước đ&oacute;. Trước hết, ch&uacute;ng ta tạo một giao diện c&oacute; t&ecirc;n l&agrave; Developer. V&igrave; <code>FrontendDeveloper</code> v&agrave; <code>BackendDeveloper</code> l&agrave; c&aacute;c lớp tương tự nhau n&ecirc;n bạn sẽ phụ thuộc v&agrave;o ch&uacute;ng tr&ecirc;n giao diện Developer.
Thay v&igrave; khởi tạo <code>FrontendDeveloper</code> v&agrave; <code>BackendDeveloper</code> theo một c&aacute;ch duy nhất b&ecirc;n trong lớp <code>SoftwareProject</code>, h&atilde;y lấy ch&uacute;ng dưới dạng danh s&aacute;ch để lặp qua v&agrave; gọi từng phương thức <code>Develop ()</code>.&nbsp;
<pre class="language-python"><code>interface Developer {
 develop(): void;
}

class FrontendDeveloper implements Developer {
 public develop(): void {
 this.writeHtmlCode();
 }

 private writeHtmlCode(): void {
 // some method
 }
}

class BackendDeveloper implements Developer {
 public develop(): void {
 this.writeTypeScriptCode();
 }

 private writeTypeScriptCode(): void {
 // some method
 }
}

class SoftwareProject {
 public developers: Developer[];

 public createProject(): void {
 this.developers.forEach((developer: Developer) =&gt; {
 developer.develop();
 });
 }
}</code></pre>
&nbsp;
Kết luận
Tr&ecirc;n đ&acirc;y l&agrave; chi tiết về 5 nguy&ecirc;n l&yacute; S.O.L.I.D trong Typescript.
Hi vọng b&agrave;i viết phần n&agrave;o c&oacute; &iacute;ch trong c&ocirc;ng việc của c&aacute;c bạn. Ch&uacute;c c&aacute;c bạn th&agrave;nh c&ocirc;ng!

Admin

Nguyên lý SOLID trong TypeScript

Cùng tác giả

Admin

Có liên quan