目錄
- 一、簡(jiǎn)介
- 二噪伊、安裝方式
- 方式1：通過(guò) npm 安裝
- 方式2：直接下載原代碼
- 三、概念講解
- 四氮唯、創(chuàng)建一個(gè)選擇題
- 五鉴吹、創(chuàng)建一個(gè)選擇組
- 四、選項(xiàng) Option
- 構(gòu)造函數(shù)
- 創(chuàng)建選項(xiàng)
- 五惩琉、選擇題 ChoiceQuestion
- 構(gòu)造函數(shù)
- 創(chuàng)建選擇題
- 選擇操作和設(shè)置
- 查找和刪除操作
- 條件測(cè)試
- 計(jì)分
- 六豆励、選擇題組 ChoiceQuestionList
- 創(chuàng)建選擇組
- 題目匯總
- 選擇操作
- 查找和刪除操作
- 條件測(cè)試
內(nèi)容
一、簡(jiǎn)介
在很多需要中瞒渠，選擇題是很常見(jiàn)的功能良蒸，如：調(diào)查問(wèn)卷、選項(xiàng)設(shè)置伍玖、選項(xiàng)驗(yàn)證 等等嫩痰；無(wú)論對(duì)于什么樣的業(yè)務(wù)，雖然選擇題的頁(yè)面效果私沮、交互始赎、規(guī)則 等都不一樣，但是仔燕，經(jīng)過(guò)合理的設(shè)置造垛，完全可以抽離出一套選擇題的邏輯、數(shù)據(jù)模型晰搀； option-model 就是這樣一個(gè)模型五辽；
option-model 作為 選擇題的數(shù)據(jù)、邏輯模型外恕；支持單選杆逗、多選、限制選鳞疲、默認(rèn)選擇罪郊、管理、統(tǒng)計(jì)尚洽、匯總悔橄、測(cè)試、驗(yàn)證、打分 等等；
相關(guān)文檔：
如果您在使用該庫(kù)的過(guò)程中有遇到了問(wèn)題，或者有好的建議和想法庇忌，您都可以通過(guò)以下方式聯(lián)系我，期待與您的交流：
- 郵箱：guobinyong@qq.com
- QQ：guobinyong@qq.com
- 微信：keyanzhe
二邪蛔、安裝方式
目前，安裝方式有以下幾種：
方式1：通過(guò) npm 安裝
npm install --save option-model
方式2：直接下載原代碼
您可直接從 本項(xiàng)目的Git倉(cāng)庫(kù) 下載扎狱，此倉(cāng)庫(kù)里包含了 option-model 和 下文的示例代碼侧到； option-model 庫(kù)是 本項(xiàng)目的Git倉(cāng)庫(kù) 項(xiàng)目中的 package/ChoiceQuestionModel.js 文件，您可以直接把該文件拷貝到您的項(xiàng)目中去淤击；然后使用如下代碼在您的項(xiàng)目中引入你需要的類(lèi)：
import {ChoiceQuestion,Option,ChoiceQuestionList,ChoiceCondition} from "path/to/package/ChoiceQuestionModel.js";
三床牧、概念講解
對(duì)于選擇題業(yè)務(wù)，肯定會(huì)有這些概念：題遭贸、題的選項(xiàng)、一組題心软； 在 option-model 中壕吹，也這對(duì)應(yīng)的概念，并把這些概念設(shè)計(jì)成了類(lèi)删铃，如下：
- ChoiceQuestion : 選擇題類(lèi)耳贬，表示一個(gè)選擇題；
- Option : 選項(xiàng)類(lèi)猎唁，表示選擇題的選項(xiàng)咒劲；
- ChoiceQuestionList : 選擇題組類(lèi)，表示一組選擇題诫隅，即選擇題列表腐魂；
- ChoiceCondition : 選擇題約束類(lèi)，表示選擇題的限制條件逐纬； 該類(lèi)是個(gè)抽象類(lèi)蛔屹， 用于讓其它類(lèi)繼承； 選擇題類(lèi) ChoiceQuestion 也繼承自 選擇題約束類(lèi) ChoiceCondition 豁生；
在 option-model 的概念中兔毒，多了個(gè) 選擇題約束類(lèi) ChoiceCondition ，一般用不到這個(gè)類(lèi)甸箱；
以上各類(lèi)的詳細(xì)信息請(qǐng)見(jiàn)《option-model的接口文檔》
四育叁、選項(xiàng) Option
在選擇題中，選項(xiàng)就是選擇題提供的供用戶(hù)選擇的答案芍殖；在 option-model 中豪嗽，用 Option 類(lèi) 表示選項(xiàng)；
構(gòu)造函數(shù)
Option(content,id,choiceQuestion)
- @param content : any 選項(xiàng)的內(nèi)容
- @param id : any 選項(xiàng)的標(biāo)識(shí)符，在一個(gè)題目中昵骤，需要唯一
- @param choiceQuestion : ChoiceQuestion 選擇所屬的題目
創(chuàng)建選項(xiàng)
選項(xiàng)的創(chuàng)建和設(shè)置有2種方式
-
方式1：用構(gòu)造函數(shù)創(chuàng)建和配置
let option = new Option("河南人",1); -
方式2：先創(chuàng)建未配置的選項(xiàng)树碱，再更改相關(guān)屬性：
let option = new Option(); //先創(chuàng)建選項(xiàng) option.content = "安徽人"; //設(shè)置選項(xiàng)的內(nèi)容 option.id = "A"; //設(shè)置選項(xiàng)的標(biāo)識(shí)符
五、選擇題 ChoiceQuestion
選擇題 是 問(wèn)題 及 該問(wèn)題提供的供用戶(hù)選擇的答案 一個(gè)集合变秦；即：選擇題 包含 問(wèn)題 和 選項(xiàng)列表成榜； 在 option-model 中，用 ChoiceQuestion 類(lèi) 表示選擇題蹦玫；
構(gòu)造函數(shù)
ChoiceQuestion(subject,minSelectCount,maxSelectCount,id,options,rightAnswerIds,defaultSelectedIds,scoreValuel,type)
- @param subject : any 選擇題的問(wèn)題赎婚、標(biāo)題；
- @param minSelectCount : number 最小選擇數(shù)目
- @param maxSelectCount : number 最大選擇數(shù)目
- @param id : any 題目的唯一標(biāo)識(shí)符
- @param options : Array<Option> = [] 盛裝選擇題的所有選項(xiàng)的數(shù)組
- @param rightAnswerIds : Array = [] 盛裝正確答案id的數(shù)組
- @param defaultSelectedIds : Array = [] 盛裝默認(rèn)選中的答案id的數(shù)組
- @param scoreValuel : number = 1 題目的分值
- @param type : any 題目類(lèi)型
創(chuàng)建選擇題
選擇題的創(chuàng)建和設(shè)置有2種方式
-
方式1：用構(gòu)造函數(shù)創(chuàng)建和配置
let question = new ChoiceQuestion("你是哪里人樱溉？",1,2,1,optionArr); -
方式2：先創(chuàng)建未配置的選項(xiàng)挣输，再更改相關(guān)屬性：
let question = new ChoiceQuestion(); //先創(chuàng)建題目 question.subject = "你愛(ài)人是哪里人？"; //設(shè)置標(biāo)題 question.minSelectCount = 1; //設(shè)置最小選擇數(shù)目 question.maxSelectCount = 3; //設(shè)置最大選擇數(shù)目 question.id = 1; //設(shè)置id question.options = optionArr; //設(shè)置選項(xiàng)
選擇操作和設(shè)置
你可以通過(guò) defaultSelectedIds 屬性來(lái)設(shè)置 選擇題默認(rèn)的選中的選項(xiàng)福贞；通過(guò) selectedOptions 或者 selectedOptionIds 獲取選擇題中被選中的選項(xiàng)撩嚼；
ChoiceQuestion 的實(shí)例有豐富的選中方法，如下：
- selectOptionOfId(optionID) : 選中 id 為 optionID 的選項(xiàng)
- selectOptionsOfIdList(idList) : 選中 idList 中指定的所有 選項(xiàng)
- onlySelectOptionsOfIdList(idList) : 只選中 idList 中指定的所有 選項(xiàng)
- onlySelectOptionsOutofIdList(idList) : 只選中除 idList 中指定的 之外的 所有選項(xiàng)
- deselectOptionOfId(optionID) : 取消選中 id 為 optionID 的選項(xiàng)
- deselectOptionsOfIdList(idList) : 取消選中 idList 中指定的所有 選項(xiàng)
- deselectAll() : 取消所有選項(xiàng)的選中
- resetSelect() : 重圍選中挖帘，重置后只選中默認(rèn)選中的選項(xiàng)
查找和刪除操作
ChoiceQuestion 的實(shí)例中也提供了豐富的查找完丽、刪除方法，如下：
- findIndexForId(optionID) : 返回 id 為 optionID 的 選項(xiàng) 在 options 中的索引拇舀；如果沒(méi)有符合條件的元素返回 -1
- findOptionForId(optionID) : 返回 id 為 optionID 的 選項(xiàng)逻族；如果沒(méi)有符合條件的元素返回 undefined
- findIndexListForIdList(idList)- : 返回 idList 中的 id 對(duì)應(yīng)的 選項(xiàng) 在 options 中的索引的數(shù)組；
- findOptionListForIdList(idList) : 返回 idList 中的 id 對(duì)應(yīng)的 選項(xiàng) 的數(shù)組骄崩；
- deleteOptionForId(optionID) : 刪除 id 為 optionID 的 選項(xiàng) 聘鳞；
- deleteOptionForIdList(idList) : 刪除 idList 中指定的所有選項(xiàng) ；
條件測(cè)試
ChoiceQuestion 的實(shí)例有豐富的條件測(cè)試方法要拂，有以下方法可用于條件測(cè)試：
- testRequisite() : 測(cè)試是否滿(mǎn)足必須
- testMinSelectCount() : 測(cè)試是否滿(mǎn)足最小選擇數(shù)
- testMaxSelectCount() : 測(cè)試是否滿(mǎn)足最大選擇數(shù)
- testAllCondition() : 測(cè)試是否滿(mǎn)足所有的約束條件
- testAnswer() : 測(cè)試是否回答正確抠璃，需要設(shè)置 rightAnswerIds
計(jì)分
如果給選擇題 ChoiceQuestion 實(shí)例設(shè)置了 分值 scoreValuel ，則也可以通過(guò)ChoiceQuestion 實(shí)例的 score 屬性 來(lái)獲得得分情況脱惰；
六鸡典、選擇題組 ChoiceQuestionList
在選擇題的使用場(chǎng)景中，往往會(huì)有很多道選擇題枪芒，多個(gè)選擇題的集合 就稱(chēng)為 選擇題組 或者 選擇題列表 彻况； 在 option-model 中，用 ChoiceQuestionList 類(lèi) 表示選擇題組舅踪；
創(chuàng)建選擇組
因?yàn)?ChoiceQuestionList 繼承自 Array 纽甘，所以 ChoiceQuestionList 的構(gòu)造函數(shù) 與 Array 相同；所以創(chuàng)建選擇題組的方式也有很多種抽碌，分別如下：
-
方式1:
let questionList = new ChoiceQuestionList(); //先創(chuàng)建一個(gè)空的選擇題組 //再把選擇題實(shí)例一個(gè)一個(gè)的 push 進(jìn) 選擇題組 questionList.push(question1); questionList.push(question2); questionList.push(question3); -
方式2:
let questionList = new ChoiceQuestionList(question1,question2,question3); //創(chuàng)建選擇題組實(shí)例時(shí) 直接把選擇題作為參數(shù)傳入構(gòu)造函數(shù) -
方式3:
let questionList = new ChoiceQuestionList(3); //先創(chuàng)建相應(yīng)長(zhǎng)度的空的選擇題組 // 再通過(guò)的方括號(hào)語(yǔ)法設(shè)置相應(yīng)的選擇題 questionList[0] = question1; questionList[1] = question1; questionList[2] = question1;
當(dāng)然悍赢，還有其它方式决瞳，這里不再一一介紹了！
題目匯總
通過(guò) ChoiceQuestionList 實(shí)例左权，可以查看各種關(guān)于題目的統(tǒng)計(jì)皮胡、匯總數(shù)據(jù)，如下：
- passConditionOfQuestions : 獲得符合約束條件的所有題目的列表
- passConditionOfQuestionIds : 獲得符合約束條件的所有題目的id列表
- notPassConditionOfQuestions : 獲得不符合約束條件的所有題目的列表
- notPassConditionOfQuestionIds : 獲得不符合約束條件的所有題目的id列表
- answerRightQuestions : 獲得回答正確的題目的列表
- answerRightQuestionIds : 獲得回答正確的題目的id列表
- answerWrongQuestions : 獲得回答錯(cuò)誤的題目的列表
- answerWrongQuestionIds : 獲得回答錯(cuò)誤的題目的id列表
- totalScore : 所有題目的得分總和
選擇操作
ChoiceQuestionList 的實(shí)例也有常用的選擇操作的方法赏迟，如下：
- deselectAll() : 取消所有題目的選中
- resetSelect() : 重圍所有題目的選中屡贺，重置后每個(gè)題目只選中默認(rèn)選中的選項(xiàng)
查找和刪除操作
雖然 ChoiceQuestionList 繼承自 Array ，已經(jīng)具備了 Array 所有的方法锌杀，但為了更方便您的使用甩栈，ChoiceQuestionList 的實(shí)例中仍然提供了豐富的查找、刪除方法糕再，如下：
- findIndexForId(questionID) : 返回 id 為 questionID 的 選擇題 在 選擇題組 中的索引量没；如果沒(méi)有符合條件的元素返回 -1
- findQuestionForId(questionID) : 返回 id 為 questionID 的 選擇題；如果沒(méi)有符合條件的元素返回 undefined
- findIndexListForIdList(idList) : 返回 idList 中的 id 對(duì)應(yīng)的 選擇題 在 選擇題組 中的索引的數(shù)組突想；
- findQuestionListForIdList(idList) : 返回 idList 中的 id 對(duì)應(yīng)的 選擇題 的數(shù)組殴蹄；
- deleteQuestionForId(questionID) : 刪除 id 為 questionID 的 選擇題；
- deleteQuestionForIdList(idList) : 刪除 idList 中指定的所有選擇題 猾担；
條件測(cè)試
ChoiceQuestionList 的實(shí)例有豐富的條件測(cè)試方法饶套，有以下方法可用于條件測(cè)試：
- testEveryAccordCondition() : 測(cè)試是否每一個(gè)題目都符合約束
- testSomeAccordCondition() : 測(cè)試是否有部分題目符合約束
- testEveryIsRight() : 測(cè)試是否每個(gè)題目都回答正確
- testSomeIsRight() : 測(cè)試是否部分題目回答正確
