naive-oop.ts

// prettier-ignore
interface Todo {
	id:   string
	done: boolean
	text: string

	reset(): void
	setDone(done: boolean): void
	setText(text: string): void
}

function Todo(this: Todo, { done, text }: { done: boolean; text: string } = { done: false, text: "" }) {
	// State
	const id = Math.random().toString(36).slice(2, 4)
	Object.assign(this, {
		id,
		done,
		text,
	})

	// Methods
	Object.assign(this, {
		reset,
		setDone,
		setText,
	})
	return this
}

// reset resets the current todo state.
function reset(this: Todo) {
	this.done = false
	this.text = ""
}

// setDone sets the current todo "done" state.
function setDone(this: Todo, done: boolean) {
	this.done = done
}

// setText sets the current todo "text" state.
function setText(this: Todo, text: string) {
	this.text = text
}

////////////////////////////////////////////////////////////////////////////////

// prettier-ignore
interface TodoApp {
	todo:  Todo
	todos: Todo[]

	add(): void
	remove(id: string): void
}

function TodoApp(this: TodoApp) {
	// State
	Object.assign(this, {
		//@ts-ignore
		todo: new Todo(),
		todos: [],
	})

	// Methods
	Object.assign(this, {
		add,
		remove,
	})
	return this
}

// add adds the current todo to the start of the stack.
function add(this: TodoApp) {
	if (this.todo.text === "") return
	this.todos = [this.todo, ...this.todos]
	//@ts-ignore
	this.todo = new Todo() // Reset
}

// remove removes an todo.
function remove(this: TodoApp, id: string) {
	this.todos = this.todos.filter(each => each.id !== id)
}