집 > 기사 > 웹 프론트엔드 > JS 명령어 패턴의 개념과 사용법 공유

JS 명령어 패턴의 개념과 사용법 공유

小云云원래의: 2018-02-06 15:06:561640검색

이 글에서는 주로 JS 디자인 패턴에서 명령어 모드의 개념과 사용법을 소개합니다. 명령어 모드의 원리와 기능을 간략하게 설명하고 명령어 모드의 관련 정의와 사용법을 자바스크립트 예제 형식으로 분석합니다. 모두에게 도움이 되기를 바랍니다.

클라이언트는 명령을 생성하고, 수신자는 명령이 실행될 때 해당 작업을 수행합니다.
간단한 명령 개체는 일반적으로 두 개체(발신자와 수신자) 간의 결합을 제거하는 데 사용됩니다. 일반적으로 분할할 수 없거나 트랜잭션 지침을 캡슐화하는 데 사용됩니다.

명령 패턴의 주요 목적은 작업을 구현하는 개체에서 호출 개체(사용자 인터페이스, API, 프록시 등)를 격리하는 것입니다. 이 패턴은 두 개체 간의 상호 작용에 더 높은 수준의 모듈성이 필요할 때마다 사용할 수 있습니다.

명령은 이 명령과 관련된 실제 작업을 수행하기 위해 간단한 방법이나 기능을 사용하는 것을 의미합니다. 리모컨으로 TV를 켜듯이 버튼 하나로 TV를 켤 수 있어 간편하고 편리합니다. 우리는 구체적인 구현 작업에 신경 쓸 필요가 없습니다. 그건 TV에서 처리해요. TV는 리모컨에 인터페이스(신호)를 제공하며, 리모컨은 클릭할 때만 이 인터페이스를 구현하면 됩니다.

명령:
명령의 인터페이스를 정의하고 실행 방법을 선언합니다.
ConcreteCommand:
명령 인터페이스 구현 개체는 일반적으로 수신기를 보유하고 수신기의 기능을 호출하여 명령에 의해 수행되는 작업을 완료하는 "가상" 구현입니다.
Receiver:
Receiver, 실제로 명령을 실행하는 개체입니다. 명령에 필요한 해당 기능을 구현할 수 있는 한 모든 클래스는 수신자가 될 수 있습니다.
Invoker:
요청을 실행하려면 명령 개체가 필요합니다. 일반적으로 명령 개체를 보유하고 있으며 많은 명령 개체를 보유할 수 있습니다. 이는 클라이언트가 실제로 명령을 트리거하고 해당 작업을 수행하기 위해 명령이 필요한 곳입니다. 이는 명령 개체에 들어가는 것과 같습니다.
클라이언트:
특정 명령 개체를 생성하고 명령 개체의 수신자를 설정합니다. 이는 일반적인 의미의 클라이언트가 아니라 명령 개체와 수신자를 조립하는 것입니다. 실제로 명령을 사용하는 클라이언트가 호출자

에서 실행을 트리거하기 때문에 이 클라이언트를 어셈블러라고 부르는 것이 더 나을 것입니다. 패턴 분석

1. 명령 패턴의 핵심은 명령을 캡슐화하고 명령을 내리는 책임과 명령을 실행하는 책임을 분리하는 것입니다.
2. 각 명령은 작업입니다. 요청하는 당사자는 작업을 수행하라는 요청을 보내고, 받는 당사자는 요청을 받고 작업을 수행합니다.
3. 명령 모드를 사용하면 요청 당사자와 수신 당사자가 독립적일 수 있으므로 요청 당사자는 요청 수신 방법, 요청 수신 여부 및 시기는 물론 요청을 수신하는 당사자의 인터페이스를 알 필요가 없습니다. 작업이 실행되고 실행되는 방법입니다.
4. 명령 모드는 요청 자체를 다른 개체처럼 저장하고 전달할 수 있는 개체로 만듭니다.
5. 명령 모드의 핵심은 추상 명령 인터페이스를 도입하고 추상 명령 인터페이스를 위한 송신 프로그램만 수신자와 연결할 수 있다는 것입니다.

패턴의 장점

1. 객체 간의 결합을 줄입니다.
2. 새로운 명령을 시스템에 쉽게 추가할 수 있습니다.
3. 조합된 명령을 디자인하는 것이 더 쉽습니다.
4. 동일한 메서드를 호출하여 다양한 기능 구현

// 命令
var CreateCommand = function( receiver ){
 this.receiver = receiver;
}
CreateCommand.prototype.execute = function() {
 this.receiver.action();
}
// 接收者 电视
var TVOn = function() {}
TVOn.prototype.action = function() {
  alert("TVOn");
}
// 接收者 电视
var TVOff = function() {}
TVOff.prototype.action = function() {
  alert("TVOff");
}
// 调用者 遥控器
var Invoker = function( tvOnCommand, tvOffCommand ) {
  this.tvOnCommand = tvOnCommand;
  this.tvOffCommand = tvOffCommand;
}
Invoker.prototype.tvOn = function() {
  this.tvOnCommand.execute();
}
Invoker.prototype.tvOff = function() {
  this.tvOffCommand.execute();
}

Execute Client

var tvOnCommand = new CreateCommand( new TVOn() );
var tvOffCommand = new CreateCommand( new TVOff() );
var invoker = new Invoker( tvOnCommand, tvOffCommand );
invoker.tvOn();
invoker.tvOff();

JS 명령어 패턴의 개념과 사용법 공유

관련 기사