本文實例講述了JS常見疑難點分析之match,charAt,charCodeAt,map,search用法。分享給大家供大家參考,具體如下:
JavaScript match() 方法
定義和用法
match() 方法可在字符串內檢索指定的值,或找到一個或多個正則表達式的匹配。
該方法類似 indexOf() 和 lastIndexOf(),但是它返回指定的值,而不是字符串的位置。
語法
匹配字符串,返回指定的值
stringObject.match(searchvalue)
匹配正則,返回指定的值
stringObject.match(regexp)
使用 match() 來檢索一個字符串例子:
<html><body><script type="text/javascript">var str="Hello world!"document.write(str.match("world") + "<br />")document.write(str.match("World") + "<br />")document.write(str.match("worlld") + "<br />")document.write(str.match("world!"))</script></body></html>
最終出現的結果為,world,null,null,world!
使用 match() 來檢索一個正則表達式的匹配例子:
<html><body><script type="text/javascript">var str="1 plus 2 equal 3";//這里的正則表達式必須加上g,全局匹配,不然就會匹配一個值即返回document.write(str.match(//d+/g))</script></body></html>
通常來說,我們用match用在正則上面比較多,也可以用其來代理indexOf和lastIndexOf來判斷字符串里面是否存在此值。
JavaScript search() 方法
定義和用法
search() 方法用于檢索字符串中指定的子字符串,或檢索與正則表達式相匹配的子字符串,檢索到則返回匹配的子串的起始位置,無法檢索到值,返回-1。
語法
stringObject.search(regexp)
該參數可以是需要在 stringObject 中檢索的子串,也可以是需要檢索的 RegExp 對象。
要執行忽略大小寫的檢索,請追加標志 i。
search() 例子:
<script type="text/javascript">var str="Visit W3School!"document.write(str.search(/W3School/))</script>
返回索引值為6,search通常與正則配合使用,可以達到indexOf的效果。
JavaScript charAt() 方法
定義和用法
charAt() 方法可返回指定位置的字符。
請注意,JavaScript 并沒有一種有別于字符串類型的字符數據類型,所以返回的字符是長度為 1 的字符串。
語法
返回指定位置的字符串
stringObject.charAt(index)
chartAt實例:
<script type="text/javascript">var str="Hello world!"document.write(str.charAt(1))</script>
最終返回結果為:e,通常我們可以通過chartAt來從某個字符串取得具體的字符。
JavaScript charCodeAt() 方法
定義和用法
charCodeAt() 方法可返回指定位置的字符的 Unicode 編碼。這個返回值是 0 - 65535 之間的整數。
方法 charCodeAt() 與 charAt() 方法執行的操作相似,只不過前者返回的是位于指定位置的字符的編碼,而后者返回的是字符子串。
語法
stringObject.charCodeAt(index)
charCodeAt()實例
注釋:字符串中第一個字符的下標是 0。如果 index 是負數,或大于等于字符串的長度,則 charCodeAt() 返回 NaN。
<script type="text/javascript">var str="Hello world!"document.write(str.charCodeAt(1))//返回H的Unicode 編碼101</script>
js中Array.prototype.map()方法
定義和用法
map() 方法返回一個由原數組中的每個元素調用一個指定方法后的返回值組成的新數組。
語法
array.map(callback[, thisArg])
callback原數組中的元素經過該方法后返回一個新的元素。
currentValue,callback 的第一個參數,數組中當前被傳遞的元素。
index,callback 的第二個參數,數組中當前被傳遞的元素的索引。
array,callback 的第三個參數,調用 map 方法的數組。
thisArg執行 callback 函數時 this 指向的對象。
map 方法會給原數組中的每個元素都按順序調用一次 callback 函數。callback 每次執行后的返回值組合起來形成一個新數組。 callback 函數只會在有值的索引上被調用;那些從來沒被賦過值或者使用
delete 刪除的索引則不會被調用。callback 函數會被自動傳入三個參數:數組元素,元素索引,原數組本身。
使用map()的第一個例子:
下面的代碼將一個數組中的所有單詞轉換成對應的復數形式.
function fuzzyPlural(single) { var result = single.replace(/o/g, 'e'); if( single === 'kangaroo'){ result += 'se'; } return result;}var words = ["foot", "goose", "moose", "kangaroo"];console.log(words.map(fuzzyPlural));
最后結果:
["feet", "geese", "meese", "kangareese"]
求數組中每個元素的平方根例子
var numbers = [1, 4, 9];var roots = numbers.map(Math.sqrt);/* roots的值為[1, 2, 3], numbers的值仍為[1, 4, 9] */
在字符串上使用 map 方法
var map = Array.prototype.mapvar a = map.call("Hello World", function(x) { return x.charCodeAt(0); })// a的值為[72, 101, 108, 108, 111, 32, 87, 111, 114, 108, 100]
<!DOCTYPE HTML><html lang="en-US"><head> <meta charset="UTF-8"> <title></title></head><body> <script type="text/javascript"> //var map = Array.prototype.map var a = Array.prototype.map.call("Hello World", function(x) { return x.charCodeAt(0); }) // a的值為[72, 101, 108, 108, 111, 32, 87, 111, 114, 108, 100] alert(a); </script></body></html>
map兼容舊環境
map 是在最近的 ECMA-262 標準中新添加的方法;所以一些舊版本的瀏覽器可能沒有實現該方法。在那些沒有原生支持 map 方法的瀏覽器中,你可以使用下面的 Javascript 代碼來實現它。所使用的算法正是 ECMA-262,第 5 版規定的。假定Object, TypeError, 和 Array 有他們的原始值。而且 callback.call 的原始值也是 Function.prototype.call。
// 實現 ECMA-262, Edition 5, 15.4.4.19// 參考: http://es5.github.com/#x15.4.4.19if (!Array.prototype.map) { Array.prototype.map = function(callback, thisArg) { var T, A, k; if (this == null) { throw new TypeError(" this is null or not defined"); } // 1. 將O賦值為調用map方法的數組. var O = Object(this); // 2.將len賦值為數組O的長度. var len = O.length >>> 0; // 4.如果callback不是函數,則拋出TypeError異常. if ({}.toString.call(callback) != "[object Function]") { throw new TypeError(callback + " is not a function"); } // 5. 如果參數thisArg有值,則將T賦值為thisArg;否則T為undefined. if (thisArg) { T = thisArg; } // 6. 創建新數組A,長度為原數組O長度len A = new Array(len); // 7. 將k賦值為0 k = 0; // 8. 當 k < len 時,執行循環. while(k < len) { var kValue, mappedValue; //遍歷O,k為原數組索引 if (k in O) { //kValue為索引k對應的值. kValue = O[ k ]; // 執行callback,this指向T,參數有三個.分別是kValue:值,k:索引,O:原數組. mappedValue = callback.call(T, kValue, k, O); // 返回值添加到新書組A中. A[ k ] = mappedValue; } // k自增1 k++; } // 9. 返回新數組A return A; };}
通常生成時間戳的巧妙方法
第一種方式
function getTimeStamp(){var timestamp=new Date().getTime();var timestampstring = timestamp.toString();//一定要轉換字符串oldTimeStamp = timestampstring;return timestampstring;}
第二種方式
new Date().toString() //同樣可以達到效果,更簡潔
如何使用md5加密方法:
引用google,md5加密的庫文件:http://crypto-js.googlecode.com/svn/tags/3.1.2/build/rollups/md5.js
其實蠻簡單的,里面CryptoJS.SHA1(),直接引用加密即可,舉個栗子:
就這樣直接調用就可以了
var keyvaluestring = "ddddd";sign = CryptoJS.SHA1(keyvaluestring).toString();
PS:這里再提供幾款相關的加密與正則工具供大家參考使用:
JavaScript正則表達式在線測試工具:
http://tools.VeVB.COm/regex/javascript
正則表達式在線生成工具:
http://tools.VeVB.COm/regex/create_reg
BASE64編碼解碼工具:
http://tools.VeVB.COm/transcoding/base64
URL網址16進制加密工具:
http://tools.VeVB.COm/password/urlencodepwd
MD5在線加密工具:
http://tools.VeVB.COm/password/CreateMD5Password
在線散列/哈希算法加密工具:
http://tools.VeVB.COm/password/hash_encrypt
更多關于JavaScript相關內容可查看本站專題:《JavaScript常用函數技巧匯總》、《javascript面向對象入門教程》、《JavaScript中json操作技巧總結》、《JavaScript切換特效與技巧總結》、《JavaScript查找算法技巧總結》、《JavaScript錯誤與調試技巧總結》、《JavaScript數據結構與算法技巧總結》、《JavaScript遍歷算法與技巧總結》及《JavaScript數學運算用法總結》
希望本文所述對大家JavaScript程序設計有所幫助。
新聞熱點
疑難解答