關于如何使用自己的JS函數的入門書，以增強ScinessJS附帶的條件邏輯和驗證器。

　　想要編寫自定義 JavaScript 函數，以便您的調查可以自動檢測用戶設備？請繼續(xù)閱讀！

　　在調查中最大化投資回報率方面，無論是新廣告活動的市場研究，衡量客戶滿意度還是患者病史采集，最大的差異因素都是相關性。 簡單地說，不要浪費他們的時間。

　　您的受訪者不必看到不適用于他們的問題或與他們已經提供的信息相矛盾的樣板問題。

　　這就是為什么為調查實施條件分支(更廣為人知的“跳過邏輯”)至關重要的原因。您需要確保受訪者始終獲得最相關的問題 - 因為這就是為您帶來更高完成率和更大數據樣本量的原因。此外，使用條件邏輯，您可以根據以前問題的答案確定問題，所有這些都可以為您提供更好的分析，并為利益相關者提供更準確的預測和指數。

　　SurveyJS是一個免費的開源(在MIT許可證下)JavaScript庫，它不僅可以讓你做到這一點，而且還更進一步，允許你用自己的JavaScript代碼擴展你的條件邏輯和輸入驗證，做一些單純的調查庫無法單獨做的事情。

　　讓我們構建我們自己的條件和驗證器 - 完全堅持使用普通的JavaScript - 看看這是多么容易，無論你使用的是什么樣的框架。

　　請隨時在此處查看成品；自定義函數，模式，所有爵士樂。

　　自定義條件邏輯

　　對于一個非人為的真實示例，假設您正在設計一個數字使用情況調查，并希望以一種將問題放在一個頁面上，將移動用戶的問題放在另一個頁面上的方式進行分類，兩者在可見性方面都是相互排斥的。

　　現(xiàn)在，SurveyJS 為您提供了幾個內置的客戶端條件可見性選項和觸發(fā)器，以幫助您實現(xiàn)分支和跳過邏輯 — 例如，可見的If、enableIf 和必需的 If 屬性包括：

　　a. 在調查架構 (JSON) 本身中設置，

　　b. 直觀地接受布爾表達式，以及

　　c. 可以應用于問題、面板，甚至整個頁面。

　　從這里看一下調查。第二個問題(理想的團隊規(guī)模)是可見的，當且僅當前一個問題(之前的團隊經驗)有一個肯定的“是”答案。

　　但是，在我們現(xiàn)在正在討論的設備使用情況調查中，如果沒有一個額外的起始問題，這種內置的條件評估就無法幫助我們，該問題會問：“您當前使用的是哪種設備?這是無關緊要的，會占用時間，受訪者可能更希望自動檢測。

　　所以現(xiàn)在，你可能會想，“好吧，天哪，如果我能......編寫一個JS函數，自動檢測我的受訪者是在計算機還是在移動設備上，并有條件地顯示兩個頁面之一。

　　如果你是，拍拍自己的后背，因為你可以做到這一點。

　　順便說一句，這都是普通的 JavaScript。對于較舊的/不受支持的網絡瀏覽器，請嘗試使用 matchMedia() 組合填充。

　　這是我們的第一步。編寫一個函數，該函數使用 matchMedia API 運行 CSS 媒體查詢，并在返回的對象上運行一個函數，該函數根據查詢是否匹配給我們一個 或 值 — 非常適合我們，因為當然，我們確實希望在調查中為條件邏輯提供布爾值!matches true false

　　我們的函數檢查受訪者的設備，只要它至少有一個細粒度指針(即鼠標或觸摸板)，就會返回。如果不是，那么，您的受訪者可能正在使用移動設備。true

　　當然，邊緣情況是存在的，但這是一種快速而骯臟的方法來檢查不需要外部庫(如UAParser.js)的設備使用情況，并且可以很好地為我們的示例提供服務。

　　自定義函數的下一步是“注冊”它們，如下所示。

　　寄存器函數的參數是：

　　函數名稱(字符串)

　　函數本身

和一個布爾值來指示這是否是異步函數(在這種情況下，庫將期望回調而不是常規(guī)的返回語句 - 記住這個，我們稍后會回來討論它!)

　　最后，在 JSON 架構中包含函數名稱作為要檢查的條件，這樣就可以了。

　　正如您已經猜到的那樣，對于您的 PC 特定頁面，可見的If 屬性需要改為“!ifMobile()”或“如果移動() = 假”。

　　自定義輸入驗證 — 本地 *和* 服務器端。

　　就像我們做自定義條件來實現(xiàn)跳過邏輯一樣簡單，我們可以進行自定義輸入驗證，以超越 SurveyJS 提供的開箱即用功能。

　　在介紹這里令人興奮的部分之前，讓我們看一下自定義輸入驗證的基本示例。

　　這是一個非常簡單的示例，它使用正則表達式模式來確保字段中不存在 HTML 代碼，作為防止?jié)撛趷阂饽_本攻擊的安全措施。Comment

　　在(或任何組件實例化并呈現(xiàn)您的調查)中，您可以注冊它，就像我們對自定義條件邏輯的函數所做的那樣。App.jsx

　　不要忘記將此函數名稱作為驗證器包含在我們的 JSON 架構中，就像以前一樣。

　　還記得 register 函數如何具有可選的布爾參數來指示是否要注冊需要回調的異步函數嗎?

　　如果需要復習，下面是類型聲明。

　　是的，你猜對了。接下來，我們將構建一個自定義輸入驗證器，該驗證器實際上調用外部的第三方REST API來驗證用戶提供的電子郵件地址，確保它實際上是可傳遞的，而不僅僅是有效的 - 非常有用，因為字段正則表達式只是愚蠢的模式，并且很容易被偽造但看起來正確的電子郵件地址所愚弄， 喜歡。

　　我們在這里使用EVA，這是一個漂亮的小型公共API，可以快速為您進行電子郵件驗證，包括檢查可訪問性，網絡郵件狀態(tài)和垃圾郵件過濾。

　　注冊，并將其作為驗證程序包含在您的 JSON 架構中...

　　...我們完成了!綜上所述，以下是我們的驗證代碼。

　　無限潛力

　　建筑調查是一項艱苦的工作，不要讓它更難。

　　您的想象力和數據收集能力不應是平臺工具的功能，也不應受到您用于所述任務的庫的技術能力的限制。

　　這就是使 SurveyJS 脫穎而出的原因 — 能夠使用完全自定義的 JavaScript 代碼來增強現(xiàn)有功能，以準確執(zhí)行您想要的操作，無論您碰巧使用哪種框架。當然，提供的示例是使用 React 構建的，但沒有一個自定義條件邏輯或輸入驗證是特定于 React 的 — 我們只是使用與框架無關的 vanilla JavaScript 擴展了 SurveyJS。這給我們帶來的可能性之多，怎么強調都不為過。