Typescript và những vùng đất mới

Thế là đã hết tuần trước tiên của 2017, mọi người đã học được gì mới chưa? Giờ rãnh rỗi mới dành chút thời gian viết về Typescript, một thứ “tiếng nói” mới đã tranh thủ học được trong mấy ngày qua và san sớt một số góc nhìn cá nhân về Typescript. Đây cũng là bài khai trương năm 2017, hy vọng cả năm thăng hoa với nghiệp code và tổ nghiệp phù trì làm ăn phát đạt.

Typescript là gì

Typescript là một tiếng nói lập trình “mới”, giúp tạo ra code Javascript nhưng viết bằng một loại Javascript “cao cấp” hơn. Typescript được phát hành bởi Microsoft, tạo ra bởi kiến trúc sư trưởng của C#, cha đẻ của Pascal và Delphi, do đó, hơi hướng phong cách của nó được coi là khá giống C# (cái này là nghe nói, vì không có code C# mấy chục năm từ thời sinh viên rồi).

vì sao lại là Typescript?

Số là cuối năm vừa rồi, có code thử với React Native, nhưng sao thấy nó gò bó, hạn chế và không tự nhiên, nên quyết định tìm một bến đỗ mới cho hybrid app, thế là tìm đến với Ionic. Theo như review cũng như trải nghiệm app component của Ionic trên Android cùi thì thấy trải nghiệm khá mượt, đáng để tâm, thế là dấn thân vào Ionic.

Tuy nhiên, khi vừa bước vào cửa Ionic framework thì đập ngay vào mặt là AngularJs 2. Nghe nói đến Angular là sợ sim vina giá gốc xanh mặt, vì có ảm ảnh với AngularJs 1 (bị ám thị bởi cộng đồng dev, chứ chưa đích thực làm project nào với Angular 1). Tuy nhiên, cũng nghe nói Angular 2 đã khác, lợi hại hơn xưa nên quyết tâm dấn thân, vì ngày nay stack đã có ReactJs, giờ thêm AngularJs nữa chắc thêm đồ chơi.

Vừa gõ cửa Angular 2 thì hỡi ôi, lại thấy hắn được viết bằng Typescript (cái đang đề cập trong bài này) và khuyến khích bà con làm Javascript sử dụng Typescript. Thế là từ Ionic, đành phải học Typescript trước, rồi leo thang sang Angular 2, rồi hoạ chăng mới có vé làm Ionic một cách bài bản.

Đó là con đường dẫn tôi đến với Typescript.

Typescript và ES6

Có lẽ không giống nhiều Js dev, mình không tiếp xúc với ES6 trước vì thấy cú pháp nó thật là “chán”, “lạ” và vả lại, ngày nay stack của mình đang ngon, tội tình gì học thêm cái mới, thêm quy trình chuyển đổi code. vì đến với Typescript là thiên duyên tiền định nên đi sâu vào nó, và phát hiện là Typescript là một tiếng nói có thể gọi là đã đắp lên cả ES6, tức thị cung cấp các tính năng mà ES6 cung cấp. Thế là vô tình cũng được tìm hiểu ES6.

Typescript có gì hay?

Sau khi đọc hàng chục bài viết về Typescript, học hết course của Lynda về Typescript ( https://www.lynda.com/Typescript-tutorials/TypeScript-Essential-Training/421807-2.html ) thì thấy Typescript cũng có cái hay thiệt và có thể ứng dụng khá nhiều kỹ thuật vào cách code javascript kiểu mới. Dưới đây mình san sớt 1 số tính năng mà mình thấy có thể sẽ sử dụng nhiều trong tương lai và cũng là một số lợi thế của việc dùng Typescript.

1. Môi trường Strongly Type

Như các bạn biết là Javascript không quy định chặt chẽ về kiểu dữ liệu, một biến có thể đổi thay sang các kiểu dữ liệu khác nhau, khiến cho nảy sinh nhiều lỗi logic rất khó phát hiện hoặc các lỗi truy cập thuộc tính undefined object. Với môi trường strongly type của Typescript, sẽ giúp phát hiện các lỗi liên quan đến kiểu dữ liệu và bảo đảm dữ liệu đối tượng luôn được truy xuất đúng tính chất.

2. Lập trình hướng đối tượng (OOP)

Một trong những đặc điểm thú vị của Typescript là tương trợ cú pháp lập trình hướng đối tượng. Hầu hết các kỹ thuật lập trình hướng đối tượng đều có thể khai triển như kế thừa, constructor, tính chất, access modifier (public, protected, private), abstract, interface, implement, override…Rất tốt cho những ai quen thiết kế ứng dụng theo mô hình lập trình hướng đối tượng.

3. Fat Arrow

thay đổi cách khai báo các closure ngắn gọn hơn và dễ dàng truy xuất biến this ngay trong khi xử lý closure mà không phải dùng cách workaround vẫn hay dùng như là cách gán this vào 1 biến bên ngoài (ví dụ self ) rồi trong closure block code thì sử dụng biến self để truy xuất.

4. Template string

Giúp chóng vánh tạo multiline text và nhúng biến ngay trong nội dung chuỗi.

5. External Module

Cơ chế giúp kiến trúc hệ thống code theo hướng module, giúp xây dựng các dự án lớn và nhiều dev có thể làm việc chung với nhau, như cách include mà chúng ta vẫn hay dùng ở server side để sử dụng các thư viện.

6. Parameter Default Value

Giờ đây, khi khai báo hàm có thể khai báo giá trị mặc định cho một số tham số đầu vào.

—

Ở trên chỉ là một trong những đặc tính hữu ích mà Typescript mang lại. Có thể tham khảo đầy đủ tại https://www.typescriptlang.org/docs/tutorial.html

Quy trình làm việc với Typescript

Cũng như Javascript, bạn có thể viết code Typescript bằng Text Editor nào cũng được, mình thấy Visual Studio Code (của Microsoft) đã tích hợp sẵn trình phân tích cú pháp nên có thể phát hiện lỗi ngay trong khi code.

hiện tại, để trình duyệt chạy được code từ Typescript thì phải dịch sang code Javascript cân xứng. Để làm việc với Typescript thì mình dùng bộ compile download từ Microsoft hoặc npm tên là tsc, sẽ giúp chuyển từ code Typescript sang code Javascript để chạy trên trình duyệt hoặc trên môi trường Javascript khác, với điều kiện là mình cấu hình để compiler này sẽ compile source sang chuẩn nào (es5, es6…)

—-

Như vậy, việc tiếp cận với Typescript đã giúp mở rộng thêm được một ngôn ngữ mới cũng như hiểu được các đặc điểm mới của ES6, giúp cung cấp thêm đồ chơi cho kho khí giới lập trình của mình. Mặc dù mới chỉ ra được 2 năm, nhưng Typescript hiện được cộng đồng chú ý và sử dụng khá nhiều, các bạn cũng nên nghiên cứu và trang bị kiến thức là vừa, kẻo lạc hậu thì sau này khó mà nghiên cứu các open source, framework viết bằng Javascript.

Hy vọng tuần tiếp theo sẽ có thể tự tín hơn trong việc nghiên cứu AngularJs 2 để hoàn tất sứ mạng là sử dụng được Ionic framework.

Techtalk via bloghoctap