String 对象和正则表达式

一·String 对象方法

 

概念:多个字符组成的只读字符数组.........String本质上就是数组

和数组的不同

1.数组可以随意修改原数组,但字符串只读字符数组,一旦创建内容不可改变

2.类型不同:数组是Array,字符串是String都不可用

相同

1.都能用[i]访问某个元素或字符

2.都有length属性来记录元素或字符的个数

3.都能有for循环遍历元素或字符

4.都支持slice选取子数组或字符串

常用的API

toLowerCase(): 把字符串转为小写,返回新的字符串

 

var str="Hello World";
var str1=str.toLowerCase();
console.log(str);  //Hello World
console.log(str1); //hello world

 

toUpperCase(): 把字符串转为大写,返回新的字符串

var str="hello world";
var str1=str.toUpperCase();
console.log(str); //hello world
console.log(str1); //HELLO WORLD

charAt(): 获取指定下标位置的字符

 

var str="hello world";
var str1=str.charAt(6);
console.log(str1); //w

 

charCodeAt(): 返回指定下标位置的字符的unicode编码

 

var str="hello world";
var str1=str.charCodeAt(1);
var str2=str.charCodeAt(-2); //NaN
console.log(str1); //101

 

split(): 把字符串分割成字符串数组。

 

var str="AA BB CC DD";
var str1=str.split("");//如果把空字符串 ("")用作分割符,那么字符串的每个字符之间都会被分割
console.log(str1);// ["A","A"," ","B","C","D","D"]

var str2=str.split(" "); //以空格为分隔符
console.log(str2);  //["AA" "BB" "CC" "DD"]

var string1="1:2:3:4:5";
var str4=string1.split(":");
console.log(str4);  // ["1","2","3","4","5"]

 

slice() 方法提取字符串的某个部分,并以新的字符串返回被提取的部分。

提取从位置 6 开始的所有字符:
<script type="text/javascript">

var str="Hello happy world!"
document.write(str.slice(6))

</script>
输出:happy world!

提取从位置 6 到位置 11 的所有字符:
<script type="text/javascript">

var str="Hello happy world!"
document.write(str.slice(6,11))

</script>
输出:happy

substr() 方法可在字符串中抽取从 start 下标开始的指定数目的字符。

使用 substr() 从字符串中提取一些字符:
1.<script type="text/javascript">

var str="Hello world!"
document.write(str.substr(3))

</script>
输出:lo world!

2.<script type="text/javascript">

var str="Hello world!"
document.write(str.substr(3,7))

</script>
输出:lo worl

concat() 方法用于连接两个或多个字符串。

 

<script type="text/javascript">

var str1="Hello "
var str2="world!"
document.write(str1.concat(str2))

</script>以上代码输出是:

Hello world!

replace(): 在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串。

var str="hello WORLD";
var reg=/o/ig; //o为要替换的关键字,不能加引号,否则替换不生效,i忽略大小写,g表示全局查找。
var str1=str.replace(reg,"**")
console.log(str1);  //hell** W*RLD

 

查找关键词的四种方法

1.查找一个固定的关键词出现的位置

var i =string.indexog("关键词”)默认从0开始,默认仅能查找一次出现的位置

var str="Hello World";
var str1=str.indexOf("o");
var str2=str.indexOf("world");
var str3=str.indexOf("o",str1+1);
console.log(str1);  //2 默认只找第一个关键字位置,从下标0开始查找
console.log(str2);  //-1
console.log(str3);  //7

2.判断字符串中是否包含符合正则的敏感词

var i = str.search(/正则/i)  i表示忽略大小写    在str中找到第一个符合正则表达式要求的关键字的位置
 返回值:找到了返回关键词的下标,如果没有找到返回-1

<script type="text/javascript">

var str="Visit W3School!"
document.write(str.search(/w3school/i))

</script>
输出:6

3.使用正则表达式查询指定的一类关键词
var arr = str.match(/正则/ig)  查找str中所有符合正则表达式要求的关键词,保存在一个数组中返回
默认只找第一个,找到所有需要必须加上g
返回值:所有敏感词组成数组,没有找到返回null

var arr = str.match(/we/gi);
 console.log(String(arr));
 //强调:如果一个api有可能返回null,就必须先做判断,不等null时在使用

4.既知道找位置又找具体内容
 //var arr = reg.exec(带查找的完整字符串)

返回值:本次找到的一个关键词及位置
arr[0]:关键词的内容    如果正则中有分组    arr[n]:自动保存在第n个分组匹配的子内容
arr[index]:当前关键词位置  -- > arr.index 如果没有找到返回null
每次查找后,都将reg.lastIndex属性(下一次开始位置)修改为当前index+关键词长度,相当于跳过了当前关键词继续向后找

var  str = "那天,我去她家,我说:我草 你家真大。她说一起去郊游,我草草的收拾了一下,她说:我去去就来";
            var reg =/我[去草]{1,2}/g;
            var arr;
            //固定用法:找所有关键词
            //反复:找str中的关键词,只要不等于null
            while((arr=reg.exec(str))!=null){
                console.log(arr);
                console.log(
                    `在位置${arr["index"]}
                    发现
                    敏感词${arr[0]}`
                    );
            }

 

二.正则表达式

 

RegExp 对象的方法

 

RegExp:

封装一条正则表达式,提供了使用正则表达式进行查找和验证的API
创建 直接量的创建 已知规则
  var reg=/no/g;// 所有与的/在正则中都要加上\/才能转义为/
  console.log(typeof reg);//object 对象
  动态创建正则
  var reg1=new RegExp(/正则/,"gi");

对象有 3 个方法:test()、exec() 以及 compile()。

正则表达式是严格区分大小写的

i  加上去以后,让正则表达式对大小写不敏感,不常用

g  全局匹配  找到了以后还会继续的去找,没有找到就一直找

m  执行多行匹配

 

分享图片

分享图片

 

 

 

 

练习:随机生成验证码,验证是否输入正确

<body> <script> function getchars(){ var char=[]; for(var u=48;u<=57;u++){ //将0-9转为正文存入数组 char.push(String.fromCharCode(u)); } for(var u=65;u<=90;u++){ //将A-Z转为正文存入数组 char.push(String.fromCharCode(u)); } for(var u=97;u<=122;u++){ //将a-z转为正文存入数组 char.push(String.fromCharCode(u)); } return char; } function getcode(){ //声明一个空数组 var code=[]; var chars=getchars(); //生成4位数验证码 for(var i=0;i<4;i++){ //在0-61随机生成一个数 var r=Math.floor(Math.random()*62); //将chars中r位置的字符存入code code.unshift(chars[r]); }//循环结束 //返回无缝连接的结果 return code.join("") } fun4(); function fun4(){ var code=getcode(); var input; while((input=prompt("请输入验证码"+code)).toLocaleLowerCase()!=code.toLocaleLowerCase()){ //验证码错误,重新输入 alert(‘验证码错误,请重新输入‘); //重新获取验证码 code=getcode(); }//循环结束 alert("验证通过"); } </script> </body>

 测试手机号码是否输入正确

 

var reg=/^(13|15|18|17)\d{9}$/;
var str=‘18175693062‘;
 if(reg.test(str)){
   console.log(‘输入正确‘)
     break;
  }else{
   console.log(‘输入错误,请重新输入‘)
  }    

 

 

 

 

输入六位数密码,判断是否输入正确

 

<body>
        <script>
        var reg=/^\d{6}$/;
        while(true){
            var input=prompt("请输入六位数字密码");
            if(reg.test(input)){
                console.log(‘输入正确‘)
                break;
            }else{
                alert(‘输入错误,请重新输入‘)
            }    
        }
        </script>
    </body>

 

练习:计算题的小游戏
        //随机出十道加法题,接收玩家输入结果,然后判断对错,对一道题加10分,游戏结束,给出总分
        //如果输入exit,直接退出游戏

<body>
        
        <button onclick="fun()">计算题的小游戏</button>
        <script>
        function fun(){
            for(var i=0,sum1=0 ;i<10;i++){
                var num1= Math.floor(Math.random()*10);
                var num2= Math.floor(Math.random()*10);
                var sum=num1+num2;
                var input=prompt(‘请输入‘+num1+"+"+num2+‘的答案‘);
                if(input==sum){
                    sum1+=10
                    console.log(‘答案正确,得‘+sum1+‘分‘);
                }else if(input==‘exit‘){
                    break;
                }else{
                    console.log(‘很抱歉,答案错误‘);
                }
            }
        }                                
        </script>
    </body>

 

<script>
        // 当鼠标失焦的时候开始进行验证  
        // 只能输入6-12位的字母数字,
        // 如果验证通过,输入框变成绿色,
        // 如果验证不通过,输入框变成红色
        // 正在输入过程中,输入框为蓝色

        var input = document.getElementsByTagName("input")[0];
        var reg = /^[a-zA-Z\d]{6,12}$/g;
        input.onfocus = function(){
            reg.lastIndex = 0;     //聚焦的时候要让lastIndex设置成0,才不会出问题
            this.style.border = ‘2px solid #00f‘
        }

        
        input.onblur = function(){
            console.log(reg.lastIndex)
            var val = this.value;
            // console.log(reg.test(val))
            if(reg.test(val)){
                this.style.border = ‘2px solid #0f0‘
            }else {
                this.style.border = ‘2px solid #f00‘
            }
        }
    </script>
@H_266_502@

相关文章

一、校验数字的表达式 1 数字:^[0-9]*$ 2 n位的数字:^d{n}$ 3 至少n位的数字:^d{n,}$ 4 m-n位的数字...
正则表达式非常有用,查找、匹配、处理字符串、替换和转换字符串,输入输出等。下面整理一些常用的正则...
0. 注: 不同语言中的正则表达式实现都会有一些不同。下文中的代码示例除特别说明的外,都是使用JS中的...
 正则表达式是从信息中搜索特定的模式的一把瑞士军刀。它们是一个巨大的工具库,其中的一些功能经常...
一、校验数字的表达式 数字:^[0-9]*$ n位的数字:^\d{n}$ 至少n位的数字:^\d{n,}$ m-n位的数...
\ 将下一字符标记为特殊字符、文本、反向引用或八进制转义符。例如,“n”匹配字符“n”。“\n...