Vanilla JS patterns που αξίζουν (χωρίς frameworks)

// Ιδιωτικό state (δεν είναι προσβάσιμο έξω από το αρχείο)
let _state = { theme: 'dark', user: null };

// Δημόσιες συναρτήσεις που εξάγονται ελέγχοντας τη μεταβολή του state
export function updateTheme(newTheme) {
    if (['dark', 'light'].includes(newTheme)) {
        _state.theme = newTheme;
        document.body.className = `${newTheme}-mode`;
    }
}

export function getTheme() {
    return _state.theme;
}

// Εξαγωγή ενός read-only snapshot του state
export const appState = {
    get current() { return { ..._state }; }
};

import { updateTheme, getTheme, appState } from './stateManager.js';

updateTheme('light');
console.log(getTheme()); // "light"
console.log(appState.current); // {_state snapshot}

class StoreObservable {
    constructor() {
        this.observers = []; // Λίστα με callback functions
    }

    // Εγγραφή νέου παρατηρητή
    subscribe(fn) {
        this.observers.push(fn);
        // Επιστροφή συνάρτησης unsubscribe για εύκολο clean-up
        return () => {
            this.observers = this.observers.filter(subscriber => subscriber !== fn);
        };
    }

    // Ειδοποίηση όλων των παρατηρητών με νέα δεδομένα
    notify(data) {
        this.observers.forEach(fn => fn(data));
    }
}

// Χρήση στην πράξη
const cartStore = new StoreObservable();

// Component 1: Header Counter
const unsubscribeHeader = cartStore.subscribe(items => {
    console.log(`UI Header updated: Counter is now ${items.length}`);
});

// Component 2: Analytics Tracking
cartStore.subscribe(items => {
    console.log(`Analytics Log: Items count changed to ${items.length}`);
});

// Προσομοίωση προσθήκης προϊόντος
cartStore.notify(['HTML5 Book', 'CSS3 Complete Guide']);

function createSecureWallet(ownerName, initialBalance) {
    // Ιδιωτικές μεταβλητές εντός του lexical scope της συνάρτησης
    let _balance = initialBalance;
    const _transactions = [];

    return {
        getOwner: () => ownerName,
        getBalance: () => _balance,
        deposit: (amount) => {
            if (amount > 0) {
                _balance += amount;
                _transactions.push({ type: 'DEPOSIT', amount, date: new Date() });
                return true;
            }
            return false;
        },
        getHistory: () => [..._transactions] // Επιστροφή κλώνου για αποτροπή mutation
    };
}

// Δημιουργία instances
const wallet = createSecureWallet('Sotirios', 500);
wallet.deposit(150);
console.log(wallet.getBalance()); // 650
console.log(wallet._balance); // undefined (απόλυτα προστατευμένο)

class DatabaseConnection {
    constructor() {
        if (DatabaseConnection.instance) {
            return DatabaseConnection.instance; // Επιστρέφει το ήδη υπάρχον instance
        }
        
        this.connectionId = Math.random().toString(36).substr(2, 9);
        this.createdAt = new Date();
        
        // Αποθήκευση του instance στη στατική ιδιότητα της κλάσης
        DatabaseConnection.instance = this;
        Object.freeze(this); // Απαγόρευση τροποποίησης του instance
    }

    query(sql) {
        console.log(`Executing on conn [${this.connectionId}]: ${sql}`);
    }
}

// Έλεγχος Μοναδικότητας
const conn1 = new DatabaseConnection();
const conn2 = new DatabaseConnection();

console.log(conn1 === conn2); // true (Είναι το ίδιο ακριβώς αντικείμενο στη μνήμη)
conn2.query('SELECT * FROM users');

const EventBus = {
    _events: {},

    // Εγγραφή σε event (Subscribe)
    on(event, callback) {
        if (!this._events[event]) {
            this._events[event] = [];
        }
        this._events[event].push(callback);
    },

    // Ακύρωση εγγραφής (Unsubscribe)
    off(event, callback) {
        if (!this._events[event]) return;
        this._events[event] = this._events[event].filter(cb => cb !== callback);
    },

    // Εκπομπή event (Publish)
    emit(event, data) {
        if (!this._events[event]) return;
        this._events[event].forEach(callback => callback(data));
    }
};

// Χρήση σε απομακρυσμένα components
// Component A (Ακούει για ειδοποιήσεις συστήματος)
function notificationHandler(msg) {
    console.log(`[Notification Modal]: ${msg}`);
}
EventBus.on('SHOW_ALERT', notificationHandler);

// Component B (Ένας απομονωμένος κώδικας στο backend ή σε άλλο section)
// Εκπέμπει το event χωρίς να ξέρει ποιος ή αν κάποιος ακούει
EventBus.emit('SHOW_ALERT', 'Η συνεδρία σας λήγει σε 5 λεπτά.');

// Καθαρισμός μνήμης όταν το Component A γίνει destroy
EventBus.off('SHOW_ALERT', notificationHandler);