快捷導(dǎo)航

JS設(shè)計(jì)模式之狀態(tài)模式概念與用法分析

更新時(shí)間：2018年02月05日 09:37:17 作者：itpinpai

這篇文章主要介紹了JS設(shè)計(jì)模式之狀態(tài)模式概念與用法,簡單講述了狀態(tài)模式的概念、功能、應(yīng)用場景并結(jié)合javascript實(shí)例形式分析了狀態(tài)模式的簡單定義及使用方法,需要的朋友可以參考下

本文實(shí)例講述了JS設(shè)計(jì)模式之狀態(tài)模式概念與用法。分享給大家供大家參考，具體如下：

1. 概述

當(dāng)一個(gè)對象的內(nèi)在狀態(tài)改變時(shí)允許改變其行為，這個(gè)對象看起來像是改變了其類。

2. 解決的問題

主要解決的是當(dāng)控制一個(gè)對象狀態(tài)轉(zhuǎn)換的條件表達(dá)式過于復(fù)雜時(shí)的情況。把狀態(tài)的判斷邏輯轉(zhuǎn)移到表示不同的一系列類當(dāng)中，可以把復(fù)雜的邏輯判斷簡單化。

function Context( _state ) {
 this.state = _state;
 this.request = function() {
  this.state.Handle( this );
 }
}
function ConcreteStateA() {
 this.Handle = function( context ) {
  console.log("A");
  context.state = new ConcreteStateB();
 }
}
function ConcreteStateB() {
 this.Handle = function( context ) {
  console.log("B");
  context.state = new ConcreteStateA();
 }
}
// 設(shè)置Context的初始狀態(tài)為ConcreteStateA
var context = new Context(new ConcreteStateA());
// 不斷地進(jìn)行請求，同時(shí)更改狀態(tài)
context.request();
context.request();

狀態(tài)模式的使用場景也特別明確，有如下兩點(diǎn)：

一個(gè)對象的行為取決于它的狀態(tài)，并且它必須在運(yùn)行時(shí)刻根據(jù)狀態(tài)改變它的行為。

一個(gè)操作中含有大量的分支語句，而且這些分支語句依賴于該對象的狀態(tài)。狀態(tài)通常為一個(gè)或多個(gè)枚舉常量的表示。

應(yīng)用場景：

打電話有如下幾種狀態(tài)：獲取電話號碼、撥號中、通話中、通話結(jié)束。
這幾種狀態(tài)的順序是以次進(jìn)行的，那么我們就可以根據(jù)這幾種狀態(tài)來實(shí)現(xiàn)狀態(tài)模式；

獲取電話號碼