js中的字符串的match()和replace()方法的使用

String.prototype.match()

        /**
            探讨 字符串的String.prototype.match()方法:
            官方解释作用： match() 方法可在字符串内检索指定的值，或找到一个（无全局匹配 /g 的正则表达式） 或 多个( 有全局匹配 /g 的正则表达式)正则表达式的匹配 
            
        */
        var str = "iid0000ffr iid222ffr";

        var substr = str.match(/id(\S*)ff/g); // 有 /g 进行全局匹配,会匹配多次，将匹配到的字符串依次存储到一个数组，匹配所有之后返回数组

        console.log(substr[0],substr[1]) //  "id0000ff","id222ff"   返回的数组中的每一个元素为匹配到的字符串，不含（）中的内容



        var substr2 = str.match(/id(\S*)ff/); // 没有 /g，只会匹配一次，匹配到的结果为一个数组，第一个元素为匹配到的字符串，第二个元素为（）中的值

        console.log(substr2[0],substr2[1]) // "id0000ff", "0000"

String.prototype.replace()

        /**
            String.prototype.replace() 方法的探讨：
            官方解释作用： replace() 方法用于在字符串中用一些字符替换另一些字符，或替换一个与正则表达式匹配的子串

            总结： 
            1.0 replace() 方法不会改变原有的字符串，但是会返回替换后的字符串
            2.0 replace() 中的正则表达式如果不是全局匹配，只会替换第一次匹配到的字符串， 然后会返回替换后的字符串
            3.0  replace() 中的正则表达式如果是全局匹配,则会替换所有匹配到的值，然后会返回替换后的字符串
            4.0  replace() 方法中的第二个参数如果是函数，则该函数的执行次数取决于匹配到的次数，该函数的参数有两个，第一参数为匹配到的字符串，第二个参数为 为匹配到的字符串中的的（）中的内容即（\w+）
        */

        // 将str字符中的 {$id} 替换成 自由设定的值

        
        var str = "<tr><td>{$id}</td><td>{$name}</td></tr>";
        str.replace(/\{\$(\w+)\}/,123)
        console.log(str) // "<tr><td>{$id}</td><td>{$name}</td></tr>"  ，replace() 方法并不会改变str的值

        str =  str.replace(/\{\$(\w+)\}/,123)
        console.log(str) // "<tr><td>123</td><td>{$name}</td></tr>",  replace()方法中正则表达式如果不是全局匹配，只会替换第一次匹配到的字符串， 然后会返回替换后的字符串

        var str2 = "<tr><td>{$id}</td><td>{$name}</td></tr>";
        str2 = str2.replace(/\{\$(\w+)\}/g,123) // 全局匹配
        console.log(str2) // "<tr><td>123</td><td>123</td></tr>"


        var str3 = "<tr><td>{$id}</td><td>{$name}</td></tr>";
        str3.replace(/\{\$(\w+)\}/g,function(match,$1){  // 全局匹配的正则，第二个参数为函数，每次匹配成功一个，执行一次该函数
            /*
                参数1： match为匹配到的字符串，
                参数2： $1 为匹配到的字符串中的第一个的（）中的内容即（\w+）
            */
            console.log(match,$1) // {$id} id    {$name} name
        })

        // 案例1: 字符串替换
        function formatStr(str,data) {
            return str.replace(/\{\$(\w+)\}/g,function(res,res1) {
                return data[res1] || ''
            })
        }

        var result = formatStr(str3,{
            id: '账号： 123456',
            name: '姓名： 小峰'
        })

        console.log(result) // "<tr><td>账号： 123456</td><td>姓名： 小峰</td></tr>"
        // 案例二：  特殊字符转义
        function formatHtml(str) {
            return str.replace(/[<>"&]/g, function (match) {
                switch (match) {
                    case "<":
                        return "&lt;";
                    case ">":
                        return "&gt;";
                    case '"':
                        return "&quot;";
                    case "&":
                        return "&amp";
                }
            })
        }
        var str = '<p attr="myattr">侧睡规划反馈会更快乐发货价格和发动机</p>'
        console.log(formatHtml(str)) // &lt;p attr=&quot;myattr&quot;&gt;侧睡规划反馈会更快乐发货价格和发动机&lt;/p&gt;