微信小程序開發之不能使用eval函數的問題

一 eval函數問題javascript

JavaScript中的eval函數是頗受開發者爭議的問題之一,問題主要在於其可能致使的不安全性。有關此方面問題,在此再也不贅述,讀者可能很容易地瀏覽到許多介紹性文章。前端

可是,eval函數的優勢也是很明顯的。例如,使用JS編寫一個計算器程序,在遇到"2+1-3*5"這樣的字符串時,使用eval就能夠很容易地計算出,相似如:java

 

var s="2+1-3*5";編程

console.log(eval(s));小程序

 

二 微信小程序練手遇到問題微信小程序

 

(1)微信小程序環境不支持eval函數安全

 

在學習微信小程序開發過程當中,想使用計算器這樣的工具編寫練練手——主要是想熟悉一下其佈局控制技巧。因而,遇到了上面的問題。很天然,想到使用eval函數,由於編程中正是遇到相似於上面的大量字符串——其中包含一個數字表達式。可是,遇到以下錯誤:微信

VM773:1 Uncaught TypeError: eval is not a function(…)網絡

 

(2)new Function()方案也不行!函數

 

初步網絡探索後,只好想使用eval()函數的替代方法,相似於以下:

1

2

3

4

5

6

7

//計算表達式的值

function eval(fn) {

     

    var Fn = Function;  //一個變量指向Function,防止有些前端編譯工具報錯

     

    return new Fn('return ' + fn)(); 

}

結果再次遇到失敗提示,相似於以下:

can not create Function

 

三 無奈之舉

 

在搜索微信小程序少有的幾個論壇並全面網絡搜索後,只能藉助於最原始的辦法實現看似簡單的計算器中程序的開發了。概括來看,方法主要有三種,分別是

轉換函數、強制類型轉換和利用js變量弱類型轉換。

 

(1)轉換函數

js提供了parseInt()和parseFloat()兩個轉換函數。前者把值轉換成整數,後者把值轉換成浮點數。只有對String類型調用這些方法,這兩個函數才能正確運行;對其餘類型返回的都是NaN(Not a Number)。

一些示例以下:

parseInt("1234blue"); //returns 1234
parseInt("0xA"); //returns 10
parseInt("22.5"); //returns 22
parseInt("blue"); //returns NaN

 

parseInt()方法還有基模式,能夠把二進制、八進制、十六進制或其餘任何進制的字符串轉換成整數。基是由parseInt()方法的第二個參數指定的,示例以下:

 

複製代碼 代碼以下:


parseInt("AF", 16); //returns 175
parseInt("10", 2); //returns 2
parseInt("10", 8); //returns 8
parseInt("10", 10); //returns 10

 

若是十進制數包含前導0,那麼最好採用基數10,這樣纔不會意外地獲得八進制的值。例如:

 

代碼以下:


parseInt("010"); //returns 8
parseInt("010", 8); //returns 8
parseInt("010", 10); //returns 10

 

parseFloat()方法與parseInt()方法的處理方式類似。
使用parseFloat()方法的另外一不一樣之處在於,字符串必須以十進制形式表示浮點數,parseFloat()沒有基模式。

下面是使用parseFloat()方法的示例:

 

代碼以下:


parseFloat("1234blue"); //returns 1234.0
parseFloat("0xA"); //returns NaN
parseFloat("22.5"); //returns 22.5
parseFloat("22.34.5"); //returns 22.34
parseFloat("0908"); //returns 908
parseFloat("blue"); //returns NaN

 

(2)強制類型轉換

還可以使用強制類型轉換(type casting)處理轉換值的類型。使用強制類型轉換能夠訪問特定的值,即便它是另外一種類型的。
 

ECMAScript中可用的3種強制類型轉換以下:


Boolean(value)——把給定的值轉換成Boolean型;
Number(value)——把給定的值轉換成數字(能夠是整數或浮點數);
String(value)——把給定的值轉換成字符串。
 

用這三個函數之一轉換值,將建立一個新值,存放由原始值直接轉換成的值。這會形成意想不到的後果。
當要轉換的值是至少有一個字符的字符串、非0數字或對象(下一節將討論這一點)時,Boolean()函數將返回true。若是該值是空字符串、數字0、undefined或null,它將返回false。

能夠用下面的代碼段測試Boolean型的強制類型轉換。

 

代碼以下:


Boolean(""); //false – empty string
Boolean("hi"); //true – non-empty string
Boolean(100); //true – non-zero number
Boolean(null); //false - null
Boolean(0); //false - zero
Boolean(new Object()); //true – object

 

Number()的強制類型轉換與parseInt()和parseFloat()方法的處理方式類似,只是它轉換的是整個值,而不是部分值。示例以下:

 

代碼以下:


用  法          結       果

Number(false)             0
Number(true)             1
Number(undefined)         NaN
Number(null)         0
Number( "5.5 ")         5.5
Number( "56 ")         56
Number( "5.6.7 ")         NaN
Number(new Object())     NaN
Number(100) 100

 

(3)利用js變量弱類型轉換

舉個小例子,一看,就會明白了。

 

代碼以下:

1

2

3

var str= '012.345 ';

var x = str-0;

x = x*1;

 

上例利用了js的弱類型的特色,只進行了算術運算,實現了字符串到數字的類型轉換。屬於最簡單的方法了。

 

小結

 

本文描述的也算是我的開發微信小程序過程當中遇到的一個「坑」吧。畢竟小程序的設計目的之一是要訪問本機功能的,因此避開eval這樣的複雜函數也是能夠理解的。目前,我尚未在網絡上找到可使用後面介紹的原始方法的可以實現計算字符串中數字表達式的通用的工具函數。有興趣的朋友能夠試一下。

 

 

免費學習更多精品課程,登陸樂搏學院官網http://www.learnbo.com/

或關注咱們的官方微博微信,還有更多驚喜哦~

 

本文出自 「青峯」 博客,請務必保留此出處http://zhuxianzhong.blog.51cto.com/157061/1881527

相關文章
相關標籤/搜索