快捷導(dǎo)航

JS中with的替代方法與String中的正則方法詳解

更新時間：2016年12月23日 10:21:35 作者：小精靈兒

最近這幾天在升級自己的MVVM 框架,遇到很多小問題,所以想著就在這里統(tǒng)一解決了。文中主要介紹了關(guān)于Javascript中with的替代方法與String中的正則方法，有需要的朋友們可以參考借鑒，下面來一起看看吧。

with 語法

在代碼中,要執(zhí)行這么一個函數(shù)

 function computeExpression(exp, scope) {
 try {
  with (scope) {
   return eval(exp);
  }
 } catch (e) {
  console.error('ERROR', e);
 }
}

要求在scope 作用域中執(zhí)行,什么意思???

比如

scope = {a:10,b:5};
exp = a*b;

要求計算結(jié)果為15,這種情況,常規(guī)情況下要使用 with語法。

但是：

js的解釋器需要檢查with塊中的變量是否屬于with包含的對象，這將使with語句執(zhí)行速度大大下降，并且導(dǎo)致js語句很難被優(yōu)化。

在嚴(yán)格模式中，with語法是被禁用的。

而我使用ES6語法來編寫這個庫的，默認(rèn)啟用了嚴(yán)格模式了。所以不得已，自己模擬了一個with 的語法。

先看代碼

function replaceWith(scopeName, exp) {
 exp = " " + exp.trim();
 let quickRegex = /([\s\+\-\*\/%&\|\^!\*~]\s*?)([a-zA-Z_$][a-zA-Z_$0-9]*?)/g;
 exp = exp.replace(quickRegex, (a, b, c) => {
  return b + scopeName + '.' + c;
 });
 return exp;
}

首先把首位的空格全部去掉，為了和后面的統(tǒng)一，在開頭加上一個空格。

第一個正則匹配出猶如"t.e==0 ? f : d"的表達(dá)式中的變量會被作為c提取出來，符號作為 b提取出來。

測試一下

現(xiàn)在已經(jīng)可以返回一個表達(dá)式了，改裝一下，讓表達(dá)式直接在里面執(zhí)行

function replaceWith(scope, exp) {
 exp = " " + exp.trim();
 let quickRegex = /([\s\+\-\*\/%&\|\^!\*~]\s*?)([a-zA-Z_$][a-zA-Z_$0-9]*?)/g;
 exp = exp.replace(quickRegex, (a, b, c) => {
  return b + 'scope.' + c;
 });
 let func = new Function("scope", "return " + exp);
 return func(scope);
}

測試一下

大功告成。

可能中間正則寫的不好，還有其他不嚴(yán)密的地方，歡迎園友補(bǔ)充。

String 原型上的正則方法

好久都沒怎么寫過大量代碼了，看到 Sring.prototype.split(//); 這個正則表達(dá)式，竟然把分割符號都給加到數(shù)組中了，很驚訝，在MDN上學(xué)了一下。順便做個整理，算是補(bǔ)充吧。

String.prototype.split(separator,[limit])

separator:指定用來分割字符串的字符（串）。separator 可以是一個字符串或正則表達(dá)式。如果忽略 separator，則返回整個字符串的數(shù)組形式。如果 separator 是一個空字符串，則 str 將會把原字符串中每個字符的數(shù)組形式返回。

limit一個整數(shù)，限定返回的分割片段數(shù)量。split 方法仍然分割每一個匹配的 separator，但是返回的數(shù)組只會截取最多 limit 個元素。

當(dāng)找到一個 seperator 時，separator 會從字符串中被移除，返回存進(jìn)一個數(shù)組當(dāng)中的子字符串。如果忽略 separator 參數(shù)，則返回的數(shù)組包含一個元素，該元素是原字符串。如果 separator 是一個空字符串，則 str 將被轉(zhuǎn)換為由字符串中字符組成的一個數(shù)組。

注意：

Note: 當(dāng)字符串為空時，split 返回一個包含一個空字符串的數(shù)組，而不是一個空數(shù)組。

如果 separator 是一個正則表達(dá)式，且包含捕獲括號（capturing parentheses），則每次匹配到 separator 時，捕獲括號匹配的結(jié)果將會插入到返回的數(shù)組中。

var myString = "hello world";
var splits = myString.split(();

console.log(splits);

輸出

["hello world"]

var myString = "Hello 1 word. Sentence number 2.";
var splits = myString.split(/(\d)/);

console.log(splits);

輸出

Hello ,1, word. Sentence number ,2,.

String.prototype.replace()

這個方法開始已經(jīng)用到，就不再介紹。

String.prototype.match(Regex)

當(dāng)字符串匹配到正則表達(dá)式（regular expression）時，match() 方法會提取匹配項。

如果正則表達(dá)式?jīng)]有 g 標(biāo)志，返回和 RegExp.exec(str) 相同的結(jié)果。而且返回的數(shù)組擁有一個額外的 input 屬性，該屬性包含原始字符串。另外，還擁有一個 index 屬性，該屬性表示匹配結(jié)果在原字符串中的索引（以0開始）。