JavaScript の単一責(zé)任原則を理解する
クリーンで保守しやすいコードを作成する場(chǎng)合、従うべき最も重要な原則の 1 つは単一責(zé)任原則 (SRP) です。これはソフトウェア開発における 5 つの SOLID 原則の 1 つであり、コードの読み取り、テスト、変更が容易になります。

単一責(zé)任原則とは何ですか?

ロバート?C?マーティンによる?yún)g一責(zé)任原則では次のように述べられています。

クラスまたは関數(shù)には、変更する理由が 1 つだけある必要があります。

もっと簡(jiǎn)単に言うと、コードの各単位 (関數(shù)、クラス、モジュールなど) は、1 つのことを?qū)g行し、それを適切に実行する責(zé)任を負(fù)う必要があります。責(zé)任が分離されると、コードの 1 つの領(lǐng)域の変更が他の領(lǐng)域に予期せず影響を與えることがなくなり、バグのリスクが軽減され、アプリケーションの保守とテストが容易になります。

SRP が重要な理由

SRP がないと、次のような問題に直面する可能性があります。

1. もつれた依存関係: 関數(shù)またはクラスに複數(shù)の責(zé)任がある場(chǎng)合、1 つに変更を加えると、誤って別の責(zé)任が壊れてしまう可能性があります。
2. テスト容易性の低下: コード単位で実行しすぎると、無(wú)関係な依存関係を模擬する必要があるため、テストが困難になります。 可読性が低い: 大規(guī)模で多目的な関數(shù)やクラスは、特にプロジェクトに參加する新しい開発者にとっては理解しにくくなります。
3. 難しいメンテナンス: 部門の責(zé)任が増えるほど、バグの切り分けと修正、または新機(jī)能の追加に多くの労力がかかります。

JavaScript での SRP の適用

JavaScript で SRP を適用する実際の例をいくつか見てみましょう。

例 1: 関數(shù)のリファクタリング

希望小売価格なし

function handleUserLogin(userData) {
    // Validate user data
    if (!userData.email || !userData.password) {
        logger.error("Invalid user data");
        return "Invalid input";
    }

    // Authenticate user
    const user = authenticate(userData.email, userData.password);
    if (!user) {
        console.error("Authentication failed");
        return "Authentication failed";
    }

    // Log success
    console.info("User logged in successfully");
    return user;
}

この関數(shù)は、検証、認(rèn)証、ログ記録など、多くのことを行います。これらにはそれぞれ明確な責(zé)任があります。

希望小売価格あり

より小さな単一目的の関數(shù)に分割することで、リファクタリングできます。

function validateUserData(userData) {
    if (!userData.email || !userData.password) {
        throw new Error("Invalid user data");
    }
}

function authenticateUser(email, password) {
    const user = authenticate(email, password); // Assume authenticate is defined elsewhere
    if (!user) {
        throw new Error("Authentication failed");
    }
    return user;
}

function handleUserLogin(userData, logger) {
    try {
        validateUserData(userData);
        const user = authenticateUser(userData.email, userData.password);
        logger.info("User logged in successfully");
        return user;
    } catch (error) {
        logger.error(error.message);
        return error.message;
    }
}

各関數(shù)が単一の責(zé)任を持つようになり、テストと変更が容易になりました。

例 2: クラスのリファクタリング

希望小売価格なし

複數(shù)の懸念事項(xiàng)を管理するクラス:

class UserManager {
    constructor(db, logger) {
        this.db = db;
        this.logger = logger;
    }

    createUser(user) {
        // Save user to DB
        this.db.save(user);
        this.logger.info("User created");
    }

    sendNotification(user) {
        // Send email
        emailService.send(`Welcome, ${user.name}!`);
        this.logger.info("Welcome email sent");
    } 
}

ここでは、UserManager がユーザーの作成、ログ記録、電子メールの送信を処理します。責(zé)任が多すぎます。

希望小売価格あり

他のクラスまたはモジュールに責(zé)任を委任してリファクタリングします:

class UserService {
    constructor(db) {
        this.db = db;
    }

    createUser(user) {
        this.db.save(user);
    }
}

class NotificationService {
    sendWelcomeEmail(user) {
        emailService.send(`Welcome, ${user.name}!`);
    }
}

class UserManager {
    constructor(userService, notificationService, logger) {
        this.userService = userService;
        this.notificationService = notificationService;
        this.logger = logger;
    }

    createUser(user) {
        this.userService.createUser(user);
        this.notificationService.sendWelcomeEmail(user);
        this.logger.info("User created and welcome email sent");
    }
}

各クラスは、永続性、通知、またはログという単一の関心事に焦點(diǎn)を當(dāng)てています。

SRP に従うためのヒント

1. 関數(shù)は短くする: 関數(shù)の長(zhǎng)さは 5 ～ 20 行で、目的が 1 つになるようにします。
2. わかりやすい名前を使用します: 適切な関數(shù)名またはクラス名は、その責(zé)任を反映しています。
3. 頻繁にリファクタリングを行う: 関數(shù)が大きすぎる、またはテストが難しいと感じる場(chǎng)合は、より小さな関數(shù)に分割します。
4. 関連ロジックのグループ化: モジュールまたはクラスを使用して、関連する責(zé)任をグループ化しますが、無(wú)関係な責(zé)任を混在させないでください。

結(jié)論

単一責(zé)任の原則は、クリーンなコードの基礎(chǔ)です。すべての関數(shù)、クラス、またはモジュールを変更する理由が 1 つだけになるようにすることで、JavaScript コードがよりモジュール化され、テストと保守が容易になります。

小規(guī)模から始めてください。現(xiàn)在のプロジェクトから複雑な関數(shù)またはクラスを 1 つ選択し、SRP を使用してリファクタリングします。時(shí)間が経つにつれて、これらの小さな変更はコードベースの大幅な改善につながります。

以上がJavaScript における?yún)g一責(zé)任の原則の詳細(xì)內(nèi)容です。詳細(xì)については、PHP 中國(guó)語(yǔ) Web サイトの他の関連記事を參照してください。