[Pattern] Adapter - làm thế nào để giúp các đối tượng làm việc với nhau?

[Pattern] Adapter - làm thế nào để giúp các đối tượng làm việc với nhau?

Tin ngắn hàng ngày dành cho bạn
  • Manus đã chính thức mở cửa cho tất cả người dùng rồi đấy mọi người. Cho những ai chưa biết thì đây là một công cụ viết báo cáo (làm mưa làm gió) giống như Deep Research của OpenAI á. Mỗi ngày được miễn phí 300 Credits để nghiên cứu. Mỗi lượt nghiên cứu tiêu tốn tuỳ thuộc vào độ phức tạp của yêu cầu. À với cả họ đang có chương trình tặng miễn phí Credits hay sao á. Như mình thì vào thấy được hẳn 2000.

    Mình dùng thử, so sánh với cùng một lệnh giống như đợt trước dùng bên Deep Research thì nội dung khác biệt nhau hoàn toàn. Manus báo cáo như kiểu viết văn hơn so với OpenAI là các gạch đầu dòng và bảng biểu.

    À lúc đăng ký xong có bắt nhập số điện thoại để xác minh, nếu lỗi thì các bạn đợi qua ngày thử lại xem có được không nhé.

    » Xem thêm
  • Mọi người chắc nghe nhiều về xu hướng tìm kiếm thông tin bằng AI chứ không cần công cụ tìm kiếm như Google nữa rồi đúng không? Không đâu xa ánh xạ vào bản thân thì thấy đúng thật, thi thoảng mới tìm kiếm thôi chứ còn đâu toàn hỏi tụi AI.

    Ngay từ đầu viết blog, thứ mà mình hướng đến là chia sẻ kinh nghiệm chứ không phải là những bài mang nặng tính kỹ thuật, máy móc, hướng dẫn từ đầu... Vì thời điểm đó đã có quá nhiều người làm nội dung này rồi và họ làm rất tốt, tại sao mình phải cố phát minh lại bánh xe? Một điều nữa là tin tưởng độc giả của mình có khả năng tìm hiểu vấn đề. Nếu bạn đọc đủ nhiều các bài viết trên blog thì thấy mình luôn cố gắng chèn thêm các liên kết tham khảo ngoài bài viết, nêu ra vấn đề mở và rất ít khi kết luận chắc chắn một điều gì đó.

    Mình đã cố gắng rèn luyện kỹ năng viết, kỹ năng trình bày và cả cách tương tác với độc giả để mang lại giá trị cho họ. Nhiều lúc ngồi lật lại các con số thống kê thấy lượng đọc bài viết tăng lên lại cảm thấy vui. Nhưng khi nguồn truy cập đến từ Google thì lại thấy buồn, vì điều đó chứng tỏ họ biết đến mình chỉ khi đang cố đi tìm giải pháp, có thể họ chỉ đọc chớp nhoáng, may ra tìm được cách giải quyết và thế là đóng cửa sổ trình duyệt rồi đi như một cơn gió.

    Chừng vài tháng đổ lại đây, một điều khiến mình rất vui đó là lượng người truy cập thẳng vào trang chủ mà không thông qua công cụ tìm kiếm đang tăng dần lên, có nhiều hôm lượng truy cập tự nhiên còn cao hơn cả đến từ Google. Điều đó chứng tỏ độc giả đã có thói quen quay lại trang của mình nhiều hơn và họ tìm thấy được giá trị từ blog mang lại. Vui mừng khôn xiết 🤩

    Bên cạnh đó thì lượng truy cập vào chuyên mục Threads - tức là mục mình đang viết bài này đang cao hơn bao giờ hết. Điều đó chứng tỏ xu hướng đi theo tin nhanh là đúng đắn. Mình có thể ngồi cả ngày để viết tin ngắn cho bạn đọc vì nó rất nhanh mà tiện, không tốn công đi tìm tài liệu để viết, không tốn cả thời gian viết nữa, còn mình thì có rất nhiều thứ để chia sẻ 😅. Nhưng không vì thế mà bỏ bê các bài viết dài, vì dài thì có nhiều thông tin để chia sẻ hơn.

    Vài lời tâm sự thế thôi chứ hơn một tháng nay mình chưa viết bài viết mới nào vì công việc bận quá. Xong lâu dần cứ trì hoãn lại thành lười. À với cả tháng 5 này rất thích hợp để đọc các cuốn sách về cách mạng á. Có hôm đọc đến 2 giờ sáng mới đi ngủ 🥱

    » Xem thêm
  • Mình mới nhìn thấy một trang web khá thú vị nói về các cột mốc đáng nhớ trong lịch sử phát triển Internet toàn cầu: Internet Artifacts

    Chỉ từ 1977 - khi Internet còn nằm trong hộp thí nghiệm thì nhìn xem - giờ đây Internet đã khiến mọi thứ phát triển đến mức nào 🫣

    » Xem thêm

Vấn đề

Hãy tưởng tượng bạn là một lập trình viên Front-end, bạn đã hoàn thiện xong phần giao diện và chỉ chờ kết nối với API nữa thôi. Nhưng đến ngày đội Back-end bảo chưa thể bàn giao ngay cho bạn được thế nên đành phải phải chờ đến lúc có API thì mới tiếp tục công việc.

Hay ở một tình huống khác, bạn được sếp giao cho công việc kết nối hệ thống với một bên đối tác thông qua API. Tài liệu họ đã cung cấp đầy đủ còn bạn chỉ tiến hành kết nối với dữ liệu như đã mô tả. Nhưng đến ngày gần làm xong, đối tác báo lại đã thay đổi dữ liệu ở một vài nơi, bạn cảm thấy bực bội vì phải ngồi rà soát và sửa lại mã ở rất nhiều nơi trong dự án.

Bên trên là hai tình huống khá phổ biến trong công việc của mỗi lập trình viên, nếu bạn đã từng gặp rồi và còn lúng túng khi phải đối diện với cảnh như vậy thì bài viết này tôi xin trình bày một Pattern có tên là Adapter để phần nào giúp bạn trải qua được nỗi đau này.

Mẫu thiết kế - Adapter

Adapter là một mẫu thiết kế cấu trúc cho phép các đối tượng có giao diện (interface) không tương thích có thể hoạt động với nhau.

Adapter đóng vai trò trong việc chuyển đổi dữ liệu (đối tượng) của một đối tượng này để đối tượng khác có thể hiểu được nó. Adapter che giấu sự phức tạp của quá trình chuyển đổi đó, đối tượng nhận dữ liệu thậm chí không cần quan tâm đến dữ liệu từ đối tượng kia mà tất cả hãy thông qua một Adapter.

Ví dụ một thư viện vẽ biểu đồ chỉ hoạt động với dữ liệu nhận vào ở dạng JSON nhưng dữ liệu bạn lấy ra trong hệ thống là XML. Lúc đó bạn cần tạo một hàm để chuyển đổi dữ liệu từ XML thành JSON đưa vào thư viện, hàm đó được gọi là Adapter.

... -> XML -> Adapter (function) -> JSON -> Library -> ...

Quay trở lại vấn đề một khi đã biết đến Adapter bạn không hoàn toàn bị phụ thuộc vào dữ liệu ở API nữa. Việc cần làm là tạo tối tượng chứa dữ liệu cần cho giao diện hiển thị hoặc xử lý, sau đó tạo hàm Adapter để chuyển đổi dữ liệu từ API thành đối tượng đó là xong.

<template>
  <a-list item-layout="horizontal" :data-source="data.list">
    <template #renderItem="{ item }">
      <a-list-item>
        <a-list-item-meta :description="item.description" >
          <template #title>
            <a :href="item.url">{{ item.title }}</a>
          </template>
          <template #avatar>
            <a-avatar :src="item.avatar" />
          </template>
        </a-list-item-meta>
      </a-list-item>
    </template>
  </a-list>
</template>
<script lang="ts">
import { defineComponent, onMounted, reactive } from "vue";

// dữ liệu được lấy từ server có định dạng
// [{
//   tieu_de: "xxx",
//   mo_ta: "xxx",
//   anh_dai_dien: "xxx",
//   lien_ket: "xxx"
// }]
const fetchData = () => {
  return fetch("https://api.example.com/list");
}

// hàm adapter chuyển dữ liệu từ API vào data
const convertRespToData = (resp: any) => {
  return resp.map((item: any) => {
    return {
      title: item.tieu_de,
      description: item.mo_ta,
      avatar: item.anh_dai_dien,
      url: item.lien_ket
    };
  });
}

export default defineComponent({
  setup() {
    // data là biến giao diện cần ghép
    const data = reactive<any>({
      list: [],
    });

    // tải dữ liệu và ghép vào data
    onMounted(() => {
      fetchData().then(resp => {
        data.list = convertRespToData(resp);
      });
    });

    return {
      data,
    };
  },
});
</script>

Hơn nữa việc tạo trước và kiểm soát dữ liệu ở client sẽ hạn chế được lỗi phát sinh từ dữ liệu không tương thích từ API. Thay vì nhận dữ liệu trực tiếp từ API để ghép thẳng vào giao diện thì hãy thông qua một Adapter.

Tương tự với vấn đề hai, chúng ta không nên quá phụ thuộc vào dữ liệu từ API của một bên thứ ba mà hãy tự tạo dữ liệu và viết hàm Adapter để chuyển đổi dữ liệu từ chúng. Tránh nhận và sử dụng dữ liệu trực tiếp, có thể những trường dữ liệu họ cung cấp không truyền đạt đúng và đầy đủ nội dung cần cho hệ thống, cho nên nếu có một hàm chuyển đổi ở giữa thì có thể dễ đàng xử lý dữ liệu tập trung và phát hiện lỗi sớm nhất có thể.

Ưu điểm là nhiều tuy nhiên Adapter cũng có một ít hạn chế đó là bạn phải viết nhiều mã hơn một ít, độ phức tạp của mã có thể tăng dần lên nếu như càng có nhiều Adapter và chúng gắn kết với nhau. Thế nên hãy cố gắng tổ chức mã của bạn gọn gàng nhất có thể.

Tổng kết

Trên đây là hai ví dụ tôi nêu ra trong thực tế để áp dụng Adapter hy vọng nó sẽ giúp ích cho mọi người. Adapter còn có nhiều cách triển khai tuỳ thuộc vào từng loại ngôn ngữ và tuỳ bài toán áp dụng. Để tìm hiểu chi tiết hơn bạn đọc có thể bấm vào liên kết tham khảo bên dưới.

Tài liệu tham khảo:

Cao cấp
Hello

Bí mật ngăn xếp của Blog

Là một lập trình viên, bạn có tò mò về bí mật công nghệ hay những khoản nợ kỹ thuật về trang blog này? Tất cả bí mật sẽ được bật mí ngay bài viết dưới đây. Còn chờ đợi gì nữa, hãy bấm vào ngay!

Là một lập trình viên, bạn có tò mò về bí mật công nghệ hay những khoản nợ kỹ thuật về trang blog này? Tất cả bí mật sẽ được bật mí ngay bài viết dưới đây. Còn chờ đợi gì nữa, hãy bấm vào ngay!

Xem tất cả

Đăng ký nhận thông báo bài viết mới

hoặc
* Bản tin tổng hợp được gửi mỗi 1-2 tuần, huỷ bất cứ lúc nào.

Bình luận (0)

Nội dung bình luận...