Skip to content
Back to skills

Js Command Pattern

ASecurity

> Encapsulate operations as objects to support undo, queue, and logging

  • 20 stars
  • 0 votes
  • 0 copies
  • 2 views
  • Added September 11, 2026
toolsjavascriptjava

Security analysis

A100/100

Pro scans all 2 files and shows the line behind each finding

Scanned September 11, 2026

npx -y skills add Intense-Visions/harness-engineering --skill js-command-pattern --agent claude-code

Installs into .claude/skills of the current project.

Are you the author of Js Command Pattern?

Add the live security badge to your README. It updates with every re-scan.

Security grade badge for Js Command Pattern
[![Security: A — Skills Directory](https://www.skillsdirectory.com/api/skills/intense-visions-js-command-pattern/badge)](https://www.skillsdirectory.com/skills/intense-visions-js-command-pattern)

More formats (shields.io, HTML) on the badges page. Keep it an A: scan every change in CI with Pro.

Download with Pro
SKILL.md
# JS Command Pattern

> Encapsulate operations as objects to support undo, queue, and logging

## When to Use

- You need undo/redo functionality
- Operations should be queued, deferred, or logged
- You want to decouple the sender of an operation from its executor

## Instructions

1. Define a command interface with `execute()` and optionally `undo()` methods.
2. Each command class captures the receiver and parameters needed to perform (and reverse) the operation.
3. Store executed commands in a history stack for undo support.
4. The invoker (button, menu, keyboard shortcut) calls `command.execute()` without knowing the implementation.

```javascript
class AddTextCommand {
  constructor(editor, text) {
    this.editor = editor;
    this.text = text;
    this.prevContent = null;
  }

  execute() {
    this.prevContent = this.editor.content;
    this.editor.content += this.text;
  }

  undo() {
    this.editor.content = this.prevContent;
  }
}

const editor = { content: 'Hello' };
const history = [];

const cmd = new AddTextCommand(editor, ' World');
cmd.execute();
history.push(cmd);
console.log(editor.content); // 'Hello World'

history.pop().undo();
console.log(editor.content); // 'Hello'
```

## Details

The Command pattern turns function calls into first-class objects. This makes operations serializable, loggable, and reversible. Redux actions are a functional variant of this pattern.

**Trade-offs:**

- More boilerplate than a direct function call
- Memory cost for storing command history
- Undo logic can be complex for operations with side effects

**When NOT to use:**

- When undo/redo is not needed and operations are one-shot
- For simple event handlers — a plain callback is sufficient

## Source

https://patterns.dev/javascript/command-pattern

## Process

1. Read the instructions and examples in this document.
2. Apply the patterns to your implementation, adapting to your specific context.
3. Verify your implementation against the details and edge cases listed above.

## Harness Integration

- **Type:** knowledge — this skill is a reference document, not a procedural workflow.
- **No tools or state** — consumed as context by other skills and agents.

## Success Criteria

- The patterns described in this document are applied correctly in the implementation.
- Edge cases and anti-patterns listed in this document are avoided.

Files in this skill

  • SKILL.md2.3 KB
  • skill.yaml672 B

Attribution

Is this your skill, or is something wrong with this listing? Request removal or report an issue. Author removals are honored within 72 hours.

Comments

Loading comments…