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", "B", " ", "C", "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 对象的方法
RegExp：
对象有 3 个方法：test()、exec() 以及 compile()。
正则表达式是严格区分大小写的
i 加上去以后，让正则表达式对大小写不敏感，不常用
g 全局匹配 找到了以后还会继续的去找，没有找到就一直找
m 执行多行匹配
练习
<script>
// 作业 对信息进行加密 "520 1314" "今晚八点，不见不散"
// charCodeAt String.fromCharCode sub() slice() substr()
//定义一个函数加密规则：每字符串都转化为unicode码 ---保证每一个unicode码都是五给字符 不够5个字符的地方用0补上
//定义一个函数解密：通过unicode码 转换为字符
var msg = "今晚8点，老地方不见不散,w84u"
function encode(msg){
for(var i=0,code="";i<msg.length;i++){
//将msg中当前字符转换为unicode，拼接到code上
// code+=msg[i].charCodeAt();
var u= msg.charCodeAt(i);
//加密的unicode码都变成五位数
/*if(u<100){
u="000"+u;
}else if(u<1000){
u="00"+u;
}*/
//(u+100000+"").slice(1)
//52+100000=100052
//20170+100000=120170 .slice(1) =20170
// 012345
code += (u+100000+"").slice(1);
}
return code;
}
var code = encode(msg);
console.log(code);
function decode(code){
//声明空字符 str
var str="";
//
return str;
}
var receive = decode(code);//对加密的信息解密
console.log(receive);//输出解密之后的结果
</script>
练习：随机生成验证码，验证是否输入正确
<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('输入错误，请重新输入') }
测试邮箱是否输入正确
var reg=/^\w@\w+(\.[A-Za-z]{2,3}){1,2}$/; var str='18175693062'; if(reg.test(str)){ console.log('输入正确') }else{ console.log('输入错误，请重新输入') }
校验是否为(0-10000)的整数
function isint1(str) { var result=str.match(/^[0-9]$|^([1-9])([0-9]){0,3}$|^10000$/); if(result==null) return false; return true; }
输入六位数密码，判断是否输入正确
<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>
posted on 2019-05-24 08:36 conlover 阅读(15995) 评论(0) 编辑 收藏 举报
