Jangan Hanya Salin dan Tampal Kod, Jadikan Ia Boleh Digunakan Semula

Latar belakang

Menyalin dan menampal kod daripada Internet adalah perkara biasa. Malah, kebanyakan isu pengekodan yang kami hadapi—sama ada pepijat, cabaran penggayaan atau keperluan untuk pemuat halaman yang kemas dalam CSS biasa—selalunya mempunyai penyelesaian yang tersedia dalam talian. Kami mencari jawapan, dan internet menawarkan banyak coretan dan panduan kod. Sudah tentu, adalah penting untuk menapis dan mengesahkan penyelesaian ini untuk memastikan penyelesaian ini sesuai untuk keperluan kita.

Apabila menulis kod, mudah untuk terpengaruh dengan kemudahan menyalin dan menampal kod. Walau bagaimanapun, dari masa ke masa, kami mungkin mula menyedari bahawa kod kami telah menjadi kucar-kacir dan sukar untuk dikekalkan. Coraknya selalunya begini:

1. Kami menghadapi masalah.
2. Cari penyelesaian dalam talian.
3. Salin kod yang kami temui.
4. Tampalkannya ke dalam pangkalan kod kami.
5. Teruskan.

Seperti yang dinyatakan sebelum ini, ada kemungkinan besar kita akhirnya akan menghadapi isu yang sama sekali lagi. Kitaran ini berulang, dan kami akhirnya menyemak semula dan menyalin semula penyelesaian tanpa benar-benar menyepadukan atau memahaminya (cabaran yang dihadapi orang lain kini telah menjadi milik kita?). Jadi, kita kembali ke Langkah 1: Hadapi masalah—dan kitaran diteruskan.

Penyelesaian

Untuk mengelakkan lingkaran neraka ini, prinsip KERING mungkin penyelesaiannya. Prinsip DRY, yang bermaksud "Jangan Ulangi Diri Sendiri", ialah prinsip pembangunan perisian yang bertujuan untuk mengurangkan pertindihan kod dan corak berulang. Menggunakan prinsip DRY pada kod anda akan menggantikan kod dan logik berulang dengan kod modular dan boleh dirujuk. Atau dalam artikel ini, untuk mengelakkan anda kembali lagi dari langkah 5 hingga langkah 1 untuk masalah yang sama.

Mari kita lihat contoh ini:

Menggunakan Fungsi untuk Mengelakkan Pengulangan

Fungsi datang untuk menyelesaikan kod berulang. Adalah salah jika anda menulis fungsi tetapi anda masih meninggalkan kod berulang dalam pangkalan kod anda.

Jika anda mendapati blok logik yang serupa diulang, masukkan semula ke dalam fungsi boleh guna semula.

// Before

function calculateAreaRectangle(width: number, height: number): number {
    return width * height;
}

function calculateAreaTriangle(base: number, height: number): number {
    return 0.5 * base * height;
}

Buat fungsi tujuan umum untuk pengiraan luas.

// after

function calculateArea(shape: "rectangle" | "triangle", dimension1: number, dimension2: number): number {
    if (shape === "rectangle") return dimension1 * dimension2;
    if (shape === "triangle") return 0.5 * dimension1 * dimension2;
    throw new Error("Invalid shape");
}

// Usage
const rectangleArea = calculateArea("rectangle", 5, 10);
const triangleArea = calculateArea("triangle", 5, 10);

Mencipta Fungsi Utiliti

Saya masih bercakap tentang fungsi: mencipta fungsi utiliti ialah salah satu cara untuk mencapai kod bersih. Contoh, jika beberapa bahagian kod anda menukar rentetan kepada huruf besar, ekstrak itu ke dalam fungsi utiliti.

// before

let title1 = "hello world".split(' ').map(word => word[0].toUpperCase() + word.slice(1)).join(' ');
let title2 = "good morning".split(' ').map(word => word[0].toUpperCase() + word.slice(1)).join(' ');

Pertimbangkan untuk mencipta fungsi untuk menangani masalah ini.

// after
function toTitleCase(input: string): string {
    return input.split(' ').map(word => word[0].toUpperCase() + word.slice(1)).join(' ');
}

let title1 = toTitleCase("hello world");
let title2 = toTitleCase("good morning");

Pemalar untuk Nilai Bersama

Berapa kali anda memanggil API yang mempunyai titik akhir yang sama? Saya percaya, ia lebih daripada sekali.

Jika nilai tertentu seperti URL atau pilihan konfigurasi digunakan merentas apl anda, tentukan nilai tersebut sekali sebagai pemalar.

// Before

function calculateAreaRectangle(width: number, height: number): number {
    return width * height;
}

function calculateAreaTriangle(base: number, height: number): number {
    return 0.5 * base * height;
}

Bagaimana jika bahagian belakang menukar URL? Jika anda masih menulis kod ini seperti contoh di atas, anda akan menukar semua kod yang mengandungi URL. Adalah bijak jika anda mengalihkan titik akhir kepada pemalar yang anda boleh menukarnya sekali dan semua panggilan API masih berfungsi kerana ia mengikut pemalar yang telah anda buat.

// after

function calculateArea(shape: "rectangle" | "triangle", dimension1: number, dimension2: number): number {
    if (shape === "rectangle") return dimension1 * dimension2;
    if (shape === "triangle") return 0.5 * dimension1 * dimension2;
    throw new Error("Invalid shape");
}

// Usage
const rectangleArea = calculateArea("rectangle", 5, 10);
const triangleArea = calculateArea("triangle", 5, 10);

Ada idea lain?

Contoh tersebut hanyalah sedikit untuk menerangkan betapa pentingnya mengekalkan kod kami untuk menunjuk dan tidak menyimpan kod berulang berulang kali. Jangan ragu untuk berkongsi dalam kotak komen di bawah pemikiran anda.

Ringkasan

Prinsip DRY (Don't Repeat Yourself) ialah amalan pengekodan asas yang menggalakkan pembangun mengelakkan lebihan dengan menggunakan semula kod di mana mungkin. Menggunakan prinsip DRY boleh meningkatkan kebolehselenggaraan, kebolehbacaan dan kecekapan dengan ketara merentas pangkalan kod, kerana ia meminimumkan bilangan tempat perubahan perlu dibuat apabila kemas kini diperlukan. Prinsip DRY ialah tentang mencipta kod yang boleh digunakan semula dan boleh diselenggara. Dengan memanfaatkan keupayaan TypeScript—seperti fungsi, generik, antara muka dan enum—anda boleh memastikan pangkalan kod anda bersih dan mengurangkan lebihan.

Atas ialah kandungan terperinci Jangan Hanya Salin dan Tampal Kod, Jadikan Ia Boleh Digunakan Semula. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!