[備忘録] 設計入門を20ページほど読んで早速アウトプットしてみた

経緯

• オブジェクト指向は知ってはいるものの、これまで関数ベース設計しかしてこなかったなと反省。
• 来年の春から社会人になるわけだしそろそろクラスベース設計ができるようにならなきゃと思い良いコード-悪いコードで学ぶ設計入門を読み始めた。
• まだ20ページくらいしか読んでいないがいきなりアウトプットしてみる！

やったこと

• 直近で書いた短いコード（言語はGAS。文法はJSと同じ）を対象に関数ベースからクラスベースにして before afterを比較してみた。
• ちなみにコードの内容はGASでスプレッドシートのメニューバーを作成するもの

before

function onOpen() {
    const ui = SpreadsheetApp.getUi()
    const menu = ui.createMenu('シート操作');
    const output_menu = ui.createMenu('シート出力');

    menu.addItem('選択中シートを一番左に移動する', 'leftEnd');
    menu.addItem('選択中シートを一番右に移動する', 'rightEnd');
    menu.addItem('yyyy年_mm月_一括シート削除', 'deleteSheetsByNamePattern');
    output_menu.addItem('シート出力', 'main');

    menu.addToUi();
    output_menu.addToUi();
}

after

class SpreadsheetUI {
    constructor() {
        this.ui = SpreadsheetApp.getUi();
    }

    createMenu(name) {
        return this.ui.createMenu(name);
    }

    addMenuToUi(menu) {
        menu.addToUi();
    }
}

function onOpen() {
    const spreadsheetUI = new SpreadsheetUI();

    const menu = spreadsheetUI.createMenu('シート操作');
    const outputMenu = spreadsheetUI.createMenu('出力');

    menu.addItem('選択中シートを一番左に移動する', 'leftEnd');
    menu.addItem('選択中シートを一番右に移動する', 'rightEnd');
    menu.addItem('yyyy年_mm月_一括シート削除', 'deleteSheetsByNamePattern');
    outputMenu.addItem('シート出力', 'main');

    spreadsheetUI.addMenuToUi(menu);
    spreadsheetUI.addMenuToUi(outputMenu);
}

メリット

• クラスベースの方が操作は2つしかないことが明示できる
• メソッドを追記していく形で拡張しやすそう

デメリット

• クラスベース設計に慣れていない場合、初見での理解が遅くなりそう
• シンプルに記述量増える

まとめ

• 別のコードに対してもやってみて before after 比較する
• 良いコード-悪いコードで学ぶ設計入門 読み進めていく