Token导航 LogoToken导航TokenDH.com
前端设计需要联网github未标认证来源可访问clear审计通过

encapsulationencapsulation 前端

Agent Skill

用于辅助前端页面、组件、样式和交互逻辑的开发与维护。它适合让 Agent 生成或审查 React、Next.js、Vue、Tailwind、CSS 等相关代码,整理组件结构,或定位布局和性能问题。使用时需要结合项目现有设计系统、路由和构建方式,避免只生成孤立片段;涉及页面改动时,应配合本地预览和构建检查确认视觉效果。

总安装

286

周安装

25

GitHub Stars

10

下载量

101
CodexClaudeCursorGemini CLI

安装说明

本站只整理中文说明和来源信息,不托管安装包,也不代用户安装。

GitHub

来源数

3

许可证

MIT

最后核验

2026-05-01

来源状态

来源可访问

安装方式

通过对话安装

复制提示词发给支持本地命令或 Skills 的 AI 助手,先确认命令和权限,再让它执行。

请帮我安装这个 Agent Skill:encapsulation(encapsulation 前端)
来源仓库:https://github.com/yanko-belov/code-craft
仓库路径:skills/encapsulation
安装命令:
npx skills add https://github.com/yanko-belov/code-craft --skill encapsulation
安装前请先检查当前环境是否支持对应 CLI,并向我确认将要执行的命令、安装目录、联网范围和文件读写权限;确认后再执行。

命令行安装

复制命令到本机终端执行。不同来源提供的安装方式可能略有差异;本站展示可直接复制的安装命令,安装前请核对来源页面。

skills.shnpx skills
npx skills add https://github.com/yanko-belov/code-craft --skill encapsulation

简介

encapsulation 指导面向对象设计中内部状态的封装实践。

  • 强调通过方法暴露行为而非直接访问数据字段。
  • 防止外部代码破坏对象不变量和数据完整性。encapsulation 属于前端设计类 Skill,可作为该场景下的辅助能力补充。
  • 适用于类定义、状态管理等场景的代码审查辅助。
  • 所有内部属性必须通过受控方法进行读写操作。

SKILL.md

Encapsulation

Overview

Hide internal state. Expose behavior, not data. Control access through methods.

Public fields let anyone modify your object's internals, bypassing validation and breaking invariants. Encapsulation protects data integrity.

When to Use

  • Designing classes with state
  • Tempted to make fields public
  • External code directly modifies object state
  • Invariants can be violated by direct access

The Iron Rule

NEVER expose internal state directly. Always use methods to control access.

No exceptions:

  • Not for "it's simpler"
  • Not for "we trust callers"
  • Not for "it's just data"
  • Not for "getters/setters are verbose"

Detection: Exposed State Smell

If internal state is directly accessible, STOP:

// ❌ VIOLATION: Public state
class BankAccount {
  public balance: number = 0;  // Anyone can modify!
  public transactions: Transaction[] = [];
}

// Callers can break invariants
const account = new BankAccount();
account.balance = -1000000;  // Negative balance!
account.transactions = [];   // Audit trail destroyed!

Problems:

  • No validation on changes
  • Invariants easily violated
  • No audit trail
  • Can't change internal representation

The Correct Pattern: Private State, Public Methods

// ✅ CORRECT: Encapsulated state
class BankAccount {
  private _balance: number = 0;
  private _transactions: Transaction[] = [];

  get balance(): number {
    return this._balance;
  }

  deposit(amount: number): void {
    if (amount <= 0) {
      throw new Error('Deposit must be positive');
    }

    this._balance += amount;
    this._transactions.push({
      type: 'deposit',
      amount,
      timestamp: new Date()
    });
  }

  withdraw(amount: number): void {
    if (amount <= 0) {
      throw new Error('Withdrawal must be positive');
    }
    if (amount > this._balance) {
      throw new Error('Insufficient funds');
    }

    this._balance -= amount;
    this._transactions.push({
      type: 'withdrawal',
      amount,
      timestamp: new Date()
    });
  }

  getTransactionHistory(): ReadonlyArray<Transaction> {
    return [...this._transactions];  // Return copy
  }
}

// Now invariants are protected
const account = new BankAccount();
account.deposit(100);     // ✅ Validated, logged
account.withdraw(50);     // ✅ Validated, logged
account.balance = -1000;  // ❌ Error: Cannot set

Encapsulation Techniques

1. Private Fields

class User {
  private _password: string;

  setPassword(newPassword: string): void {
    if (newPassword.length < 8) throw new Error('Too short');
    this._password = hash(newPassword);
  }

  checkPassword(attempt: string): boolean {
    return verify(attempt, this._password);
  }
}

2. Readonly for Read-Only Access

class Config {
  readonly apiUrl: string;
  readonly timeout: number;

  constructor(apiUrl: string, timeout: number) {
    this.apiUrl = apiUrl;
    this.timeout = timeout;
  }
}

3. Return Copies, Not References

class Order {
  private _items: OrderItem[] = [];

  // ❌ BAD: Returns reference
  getItems(): OrderItem[] {
    return this._items;  // Caller can modify!
  }

  // ✅ GOOD: Returns copy
  getItems(): OrderItem[] {
    return [...this._items];
  }

  // ✅ ALSO GOOD: Return readonly
  getItems(): ReadonlyArray<OrderItem> {
    return this._items;
  }
}

4. Validate in Setters

class Product {
  private _price: number = 0;

  get price(): number {
    return this._price;
  }

  set price(value: number) {
    if (value < 0) throw new Error('Price cannot be negative');
    if (value > 1000000) throw new Error('Price too high');
    this._price = value;
  }
}

Pressure Resistance Protocol

1. "It's Simpler"

Pressure: "Public fields are less code"

Response: Less code now, more bugs later. Encapsulation prevents invalid states.

Action: Private fields + methods. The extra code is validation.

2. "We Trust Callers"

Pressure: "Our team won't misuse public fields"

Response: Teams grow. Code evolves. Mistakes happen. Protect invariants in code.

Action: Don't rely on caller discipline. Enforce in class.

3. "It's Just Data"

Pressure: "This class is just a data container"

Response: Even data has rules. Emails have formats. Ages have ranges.

Action: Use DTOs/interfaces for pure data. Classes = behavior + encapsulation.

4. "Getters/Setters Are Verbose"

Pressure: "Java-style getters/setters are boilerplate"

Response: TypeScript has concise get/set syntax. Use it.

Action: get balance() is not verbose.

Red Flags - STOP and Reconsider

  • public keyword on mutable fields
  • Direct property assignment from outside
  • Arrays/objects returned by reference
  • No validation on state changes
  • Invariants only documented, not enforced

All of these mean: Encapsulate the state.

Quick Reference

Exposed (Bad)Encapsulated (Good)
public balanceprivate _balance + deposit()/withdraw()
return this.itemsreturn [...this.items]
Direct mutationMethod with validation
Trust callersEnforce in class

Common Rationalizations (All Invalid)

ExcuseReality
"Simpler"Simpler to write, harder to maintain.
"We trust callers"Code should enforce, not trust.
"Just data"Data has constraints. Enforce them.
"Verbose"TypeScript getters are concise.
"Over-engineering"It's just engineering.

The Bottom Line

Private state. Public methods. Validate on every change.

Never expose internal state directly. Return copies of collections. Validate in setters. Encapsulation protects invariants and enables safe evolution.

适合场景

01

用户想查找某类 Agent Skill 时

02

需要根据任务场景推荐可安装能力包时

03

需要对比不同来源的安装命令和来源信息时

04

需要参考平台分布和安装热度时

能力概览

能力 1

按任务关键词查找相关 Skills

能力 2

展示可复制的安装命令

能力 3

保留来源站点、仓库和原始说明,方便继续核验

能力 4

补充不同宿主或平台的使用分布数据

能力 5

展示第三方安全扫描或审计结果

安装后应在对应宿主中按原始 README 的触发条件使用;具体调用方式请以来源页面和 README 为准。

平台分布

Codex

25.59%
按下载量换算26

Claude Code

22.55%
按下载量换算23

windsurf

17.29%
按下载量换算17

Antigravity

12.3%
按下载量换算12

Gemini CLI

8.16%
按下载量换算8

github-copilot

3.51%
按下载量换算4

安全审计

Gen Agent Trust Hub

通过

Socket

通过

Snyk

通过

权限和风险

需要联网

该 Skill 可能需要联网访问来源站点、仓库或外部 API;具体网络访问范围需要结合源码和 README 复核。

安装前确认

本站仅展示第三方公开信息,不托管安装包,不提供自动安装或运行环境。安装前应自行审查源码、依赖和命令行为。

来源信息

继续浏览同类 Skills