趙素萍，胡雪鋒,賀 強

（晉中信息學院大數(shù)據(jù)信息工程學院，晉中 030800）

0 引言

傳統(tǒng)的計算器項目中，表達式計算一般采用棧的數(shù)據(jù)結(jié)構(gòu)來實現(xiàn)，即當用戶輸入一個數(shù)、輸入一個運算符，輸入的數(shù)壓入num棧，輸入的運算符壓入op棧。每次輸入的運算符在壓棧之前，都需要判斷op棧是否為空，為空則入棧，不為空則進行如下操作：

（1）判斷棧頂元素與當前運算符的優(yōu)先級，若棧頂元素的優(yōu)先級高，則進行（2），否則執(zhí)行步驟3。

（2）需要先從num棧彈出兩個元素，從op棧彈出一個元素進行計算，后將計算結(jié)果壓入num棧，轉(zhuǎn)入（1）繼續(xù)循環(huán)判斷。

（3）運算符壓棧，繼續(xù)后續(xù)操作。

符號棧為空時，num棧只有一個元素，即為運算結(jié)果，直接輸出即可。

該方法的局限性是要求操作數(shù)只能是一位，若要實現(xiàn)多位數(shù)的運算需要找到上一個輸入的字符是否為數(shù)值型數(shù)據(jù)，且將num出棧并將棧頂元素乘10，加上當前輸入的數(shù)再次入棧。本來使用棧就比較復雜，現(xiàn)又需要不停的進行壓棧和出棧操作，同時需要將表達式作為字符串存起來。刪除操作也較復雜，需要判斷當前刪的是運算符還是數(shù)，運算符可以直接刪除，數(shù)的話需要判斷數(shù)是幾位數(shù)，多位數(shù)需要出棧，除10取整后再入棧。

若直接對字符串進行操作，就可以省去很多入棧出棧的操作。

1 微信小程序

微信小程序是2017年才開始運行的，并以飛快的速度發(fā)展壯大。微信小程序有手機原生APP所不具備的優(yōu)點，即無需安裝、無需升級、無需卸載、不占手機存儲空間、用完即走。在一些用戶使用頻率很少的場合，微信小程序發(fā)揮了他的巨大作用。據(jù)不完全統(tǒng)計，僅2020年一年，微信小程序中健康碼的服務用戶超過8億，其中用戶累計出示健康碼的次數(shù)則超過了200億次。正是由于微信小程序用完即走的這一特點，用戶才在僅需要出示健康碼這種低頻事件中使用了微信小程序。而計算器也是低頻事件，人們僅在很少的時候需要計算，完全可以將原生APP替換。

2 表達式計算

向字符串每輸入一個數(shù)字，或刪除字符串的最后一個字符時，都會將表達式進行分割并計算。

2.1 表達式分割

JavaScript的Split（參數(shù)1，參數(shù)2）函數(shù)會實現(xiàn)字符串的分割，參數(shù)1可以是字符串也可以是正則表達式，由于我們要用的分割字符不是一個，如要求得數(shù)字數(shù)組，分割字符分別是‘+’，‘-’，‘*’，‘/’，為了實現(xiàn)小數(shù)的精準操作，分割字符還加入了‘.’，當用戶輸入的是‘1.+’時，需要將字符串修改為‘1.0+’或‘1+’。所以此處的參數(shù)1只能是正則表達式。JavaScript正則表達式的語法為‘/’開始‘/’結(jié)束。由此可見，將字符串表達式分割為數(shù)值型數(shù)組的語法為numbers=express.split（/[+-÷×.]/），分割后的結(jié)果會存到num數(shù)組中。將表達式分割為運算符數(shù)組的語法為options=express.split（/[d]/），正則表達式中‘d’表示的是所有的數(shù)字型字符，即0到9，分割后的結(jié)果會存到運算符數(shù)組op?tions數(shù)組中。

分割后的數(shù)組中會有很多的空字符串的數(shù)組元素，針對多位數(shù)的分割操作，options數(shù)組中有很多的空格。如數(shù)字12按正則表達式“/［d］/”分割，因為“_1_2_”中的“_”即為空格，所以options有3個元素，都為空格，即[‘’，‘’，‘’]。舉例說明：如12+34×56，numbers數(shù)組為[‘’，‘12’，‘34’，‘56’，‘’]，options數(shù)組為[‘’，‘’，‘+’‘’‘×’，‘’，‘’]。由此可見，Numbers數(shù)組只需要將首尾的空格去掉即可，而options數(shù)組不僅要刪除首尾的空格，還需要遍歷數(shù)組所有內(nèi)容，將每一個空字符串都刪除。

2.2 刪除多余空字符串

刪除數(shù)組中空字符串使用Array.splice（參數(shù)1，參數(shù)2，參數(shù)3…n）函數(shù)，參數(shù)1為數(shù)組中的數(shù)組元素的index值，參數(shù)2為刪除的數(shù)組元素的個數(shù)，剩下的參數(shù)為新插入的數(shù)組元素。

由于numbers數(shù)組好操作，只需要刪除首尾的兩個空字符串即可。

Options數(shù)組中會有多個空字符串，按數(shù)字分割則為_1_2_3_4+3_3_。字符串中的_即為so數(shù)組中的空字符串，so為[’，‘’，‘*’，‘+’，‘’]，需要去除字符串數(shù)組中的空字符串，需要注意的是，當數(shù)組去掉一個元素以后，相當于后面的內(nèi)容已經(jīng)全部往前移了一個位置，如果此時仍讓循環(huán)變量+1，則下一次的循環(huán)項相對于本次循環(huán)項則前進了兩個位置。舉例說明，若so為[‘’，‘’，‘*’，‘+’，‘’]，第一次循環(huán)so變?yōu)閇‘’，‘*’，‘+’，‘’]，循環(huán)變量的值變?yōu)?，直接對‘*’這一項進行操作，導致so的第一項‘’漏掉了，所以每次刪除掉一個空字符串數(shù)組項后，循環(huán)變量需要自減1，具體代碼如下：

2.3 運算符優(yōu)先級計算

得到數(shù)組后即可進行計算了。先取兩個數(shù)字與一個運算符進行計算，即數(shù)字numbers[i]和numbers[i+1]和options[i]，計算完需要刪除num?bers[i+1]和options[i]。舉例說明“3+2*6”，初始值為sn[3，2，6]，options[+，*]。首先需要計算的是乘除運算，乘除運算需要從左往右計算，所以使用循環(huán)從左往右判斷，是乘法則先乘，否則先除，取數(shù)字2和6，取運算符*進行計算，2變?yōu)?2，刪除6，刪除*，運算結(jié)果應為num?bers[3，12]，options[+]。同前所述，每次在循環(huán)體中刪除元素后，都需要將循環(huán)變量自減1。

其中n1和n2為取出的兩個數(shù)。當運算符為‘×’，計算時需要使用計算機編程語言使用的乘號‘*’。為了實現(xiàn)從左到右計算，并實現(xiàn)優(yōu)先級，所以需要從左到右判斷每一個字符，先進行乘除運算，后再進行加減運算。代碼與乘除相識，只是運算符不同而已。

最后當numbers數(shù)組只有一個數(shù)組元素時，只需要將該元素顯示在顯示屏上即可。

為了更好的觀察計算機的計算過程，在每次計算時都在console控制臺將數(shù)組顯示出來，如表達式“2-3×5÷8”，先計算3×5，刪除5和運算符×，將3修改為15。再計算15÷8，刪除8與運算符÷，修改15為1.875。最后計算2-1.875，最后結(jié)果為0.125。刪除運算符-。當options數(shù)組為空即可停止運算輸出顯示結(jié)果。

3 數(shù)據(jù)綁定

該功能的實現(xiàn)應用的主要技術(shù)是數(shù)據(jù)綁定，在微信小程序中，數(shù)據(jù)綁定的語法是{{ex?press}}，其中express可以是普通的變量，可以是條件、屬性、關(guān)鍵字等。數(shù)據(jù)綁定常用的場合主要分為顯示結(jié)果和改變樣式兩種：

3.1 表達式與計算結(jié)果的顯示

如表達式的顯示效果，用戶每單擊一個按鈕都會改變表達式的值。index.wxml文件中在需要顯示的地方添加代碼{{express}}。index.js文件中在data的屬性值區(qū)域添加變量express，并賦初始值。當用戶單擊按鈕時修改該變量的值，需要注意的是，若要實現(xiàn)數(shù)據(jù)綁定，不能通過簡單的賦值表達式達到想要的效果，需要使用setData（參數(shù)）函數(shù)實現(xiàn)，其中參數(shù)為json格式的對象類型，即鍵值對。具體代碼為：this.set?Data（{express：之前的表達式+n}），其中n為用戶當前按鈕傳遞給后臺的值。

3.2 放大處理改變樣式

數(shù)據(jù)綁定的內(nèi)容可采用三元表達式，index.wxml文件中在需要顯示的組件中添加style的屬性值，通過用戶在后臺給isequal變量賦的值來決定顯示結(jié)果的字體大小，具體代碼如下：style=“font-size:{{isequal?60:(result.length＞10?30:50)}}px;”＞。其中當isequal為真時，字體設置為60 px，否則如果字符串長度大，則字體小。同上所述，data中添加isequal變量，并賦初值為false，當用戶單擊等于操作時，通過setdata方法將該變量賦值為true。需要注意的是，當用戶單擊除了等于號外的任何按鈕時，都需要將該值修改為false，否則容易出現(xiàn)字體一直變大的狀態(tài)。

4 測試與維護

通過不斷的測試、調(diào)試與維護。計算器在手機上運行界面如圖1所示。

圖1 微信小程序計算器

為了讓讀者更好的看到計算機的工作流程，特意將數(shù)組內(nèi)容在控制臺輸出，如圖2所示。

圖2 console控制臺實時監(jiān)測運算過程

為了讓讀者更好的體驗該小程序的運行效果，同時針對小程序中存在的不足，也歡迎讀者提出您的寶貴意見。讀者可以使用微信掃一掃功能運行計算器小程序。二維碼如圖3所示。

圖3 計算器小程序的二維碼

5 結(jié)語

經(jīng)過一周的編程與不斷的測試調(diào)試，目前該項目已經(jīng)是2.1版本，所有微信用戶可以掃碼使用，實現(xiàn)可以處理字符串表達式的，具有優(yōu)先級處理功能的計算器。不論是頁面的美觀度、用戶的體驗度，還是功能的正確性、完善性與代碼的健壯性，都能滿足專業(yè)的要求。