1.JS中的substring() 方法:
substring() 方法用于提取字符串中介于两个指定下标之间的字符,包括空格键。
substring() 方法返回的子串包括 开始 处的字符,但不包括 结束 处的字符。
string.substring(from, to)
from:必需。一个非负的整数,规定要提取的子串的第一个字符在 string Object 中的位置。
to:可选。一个非负的整数,比要提取的子串的最后一个字符在 string Object 中的位置多 1。如果省略该参数,那么返回的子串会一直到字符串的结尾。
例:
const obj="abc def ghi jkl mno p";
//相当于从第三位开始截取,不包括前,然后到最后加一个回车
console.log("obj.substring(3)+"<br>"");//def ghi jkl mno p
//相当于从第二位开始截取到第八位,不包括前但是包括后,空格不显示出来
console.log("obj.substring(2,8)");//c def
2.JS中的replace() 方法:
replace() 方法用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串。
string.replace(searchvalue,newvalue)
searchvalue:必须。规定子字符串或要替换的模式的 RegExp 对象。请注意,如果该值是一个字符串,则将它作为要检索的直接量文本模式,而不是首先被转换为 RegExp 对象。
newvalue:必需。一个字符串值。规定了替换文本或生成替换文本的函数。
例:
const obj=""Mr Blue has a blue house and a blue car";
//blue替换成red
console.log(obj.replace(/blue/g,"red"));//Mr Blue has a red house and a red car
//忽略大小写的格式
console.log(obj.replace(/blue/gi,"red"));//Mr red has a red house and a red car
3.JS中的正则判断。
RegExp
构造函数用于创建正则表达式对象。
例:尝试创建一个正则表达式对象,该对象匹配由数字组成的字符串。
-
正则表达式中的量词
{n}
用于指定前面的元素恰好出现n
次。在正则表达式中,{n}
前面需要有空格。 -
使用
test
方法时,应该将正则表达式和要测试的字符串作为参数传递。在这个例子中,obj
应该是一个字符串。
const num = /* 这里是你要匹配的数字数量 */;
const regex = new RegExp(`\\d{${num}}`, 'g'); // 注意空格
const str = obj.toString(); // 确保 obj 是一个字符串
const result = regex.test(str);
result
将是一个布尔值,表示 obj
是否至少包含一个符合正则表达式 \\d{num}
的子串。
请注意,如果 obj
不是一个字符串,那么在调用 toString()
之前,你需要先检查它的类型,以确保它转换为字符串是安全的。
正则匹配:
1.手机号格式
以1开头的11位数字 : /^1\d{10}$/
2.邮箱地址
/^((^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)+)|(".+"))@((\[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/
Tip:
这段正则表达式是一个用于验证电子邮件地址的模式,它尝试匹配符合一般电子邮件地址格式的字符串。该模式使用了几个正则表达式的元字符和构造来实现这一点。让我们来分解一下:
^
- 它断言行的开始。((^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)+)|(".+"))
- 这是一个非捕获组,它检查电子邮件地址中是否存在两种可能的模式:- 第一个模式是
^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)+
,它看起来是在电子邮件地址中查找以<>()[]\\.,;:\s@"
开头的模式,后面跟着一个或多个不是<>()[]\\.,;:\s@"
的字符,并以一个点号.
结束,然后跟着一个或多个不是<>()[]\\.,;:\s@"
的字符。这是一个非常具体的模式,可能不会匹配所有有效的电子邮件地址。 - 第二个模式是
(".+")
,它看起来是在电子邮件地址的开头有一个双引号"
,后面跟着一个或多个字符。这是电子邮件地址本地部分更常见的模式。
- 第一个模式是
@
- 它断言电子邮件地址中存在 "@" 符号。(($ 0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3} $)|(([a-zA-Z\-0-9]+\.)+[a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,})
- 这是一个非捕获组,它检查电子邮件地址的域名部分是否存在两种可能的模式:- 第一个模式是
($ 0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3} $)
,它看起来是在方括号中查找一个字面的IP地址。 - 第二个模式是
(([a-zA-Z\-0-9]+\.)+[a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}
,它看起来是一个由字母数字字符和连字符组成的域名,后面跟着一个或多个点号,并以两个或更多的字母字符结束。
- 第一个模式是
$
- 它断言行的结束。
这个正则表达式相当复杂,可能无法涵盖所有根据官方规范(RFC 5322和RFC 6530用于国际化电子邮件地址)有效的电子邮件地址格式。需要注意的是,通过正则表达式验证电子邮件地址在本质上是不完美的,因为根据标准,有效的电子邮件地址格式有很多种。
const email = "example@email.com";
const regex = /^((^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)+)|(".+"))@(($ 0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3} $)|(([a-zA-Z\-0-9]+\.)+[a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,})$/;if (regex.test(email)) {console.log("有效的电子邮件地址");
} else {console.log("无效的电子邮件地址");
}
3.常用的邮箱验证规则
^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$
这个正则表达式的组成部分如下:
^
- 断言行的开始。[a-zA-Z0-9._%+-]+
- 匹配本地部分的一个或多个字符,包括字母、数字、点号、下划线、百分号、加号和连字符。@
- 断言必须存在 "@" 符号。[a-zA-Z0-9.-]+
- 匹配域名部分的一个或多个字符,包括字母、数字、点号和连字符。\.
- 断言必须存在点号。[a-zA-Z]{2,}
- 匹配顶级域名的两个或更多字母。$
- 断言行的结束。
const email = "example@email.com";
const regex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;if (regex.test(email)) {console.log("有效的电子邮件地址");
} else {console.log("无效的电子邮件地址");
}
4.手机号码
/^(?:(?:\+|00)86)?1(?:(?:3[\d])|(?:4[5-79])|(?:5[0-35-9])|(?:6[5-7])|(?:7[0-8])|(?:8[\d])|(?:8[\d])|(?:9[012356789]))\d{8}$/
这个正则表达式用于验证中国大陆手机号码是否合法。具体的规则如下:
^
:匹配输入字符串的开始位置。(?:
:表示一个非捕获型分组。(?:\+|00)86)?
:匹配可选的国家代码部分,可以是 "+86" 或 "0086",也可以为空。1
:匹配手机号码的第一位,必须是数字 1。(?:
:表示一个非捕获型分组。(?:3[\d])|(?:4[5-79])|(?:5[0-35-9])|(?:6[5-7])|(?:7[0-8])|(?:8[\d])|(?:8[\d])|(?:9[012356789])
:匹配手机号码的第二位到第三位,可以是以下任意一种情况:- 以数字 3 开头的任意一位数字。
- 以数字 4 开头,后面跟 5、6、7、8、9 中的任意一个数字。
- 以数字 5 开头的任意一位数字,但不包括 4 和 9。
- 以数字 6 开头,后面跟 5 或 7。
- 以数字 7 开头,后面跟 0 或 8。
- 以数字 8 开头的任意一位数字。
- 以数字 9 开头,后面跟 0、1、2、3、5、6、7、8、9 中的任意一个数字。
)
:关闭第二个非捕获型分组。\d{8}
:匹配手机号码的后八位数字。$
:匹配输入字符串的结束位置。
因此,如果输入的字符串符合上述规则,则该正则表达式将返回匹配结果,表示该字符串是一个合法的中国大陆手机号码;否则,将返回非匹配结果,表示该字符串不是一个合法的中国大陆手机号码。
const phoneNumber = "+8613800138000";
const regex = /^(?:(?:\+|00)86)?1(?:(?:3[\d])|(?:4[5-79])|(?:5[0-35-9])|(?:6[5-7])|(?:7[0-8])|(?:8[\d])|(?:8[\d])|(?:9[012356789]))\d{8}$/;if (regex.test(phoneNumber)) {console.log("有效的手机号码");
} else {console.log("无效的手机号码");
}
5.身份证件号码的验证
/^[1-9]\d{5}(?:18|19|20)\d{2}(?:0[1-9]|10|11|12)(?:0[1-9]|[1-2]\d|30|31)\d{3}[\dXx]$/
正则表达式用于验证中国大陆居民身份证号码的模式。下面是这个正则表达式的组成部分:
^
- 断言行的开始。[1-9]
- 匹配身份证号码的前一位数字,它不能是0
。\d{5}
- 匹配接下来的五位数字,这部分是身份证号码的行政区划代码。(?:18|19|20)
- 这是一个非捕获组,匹配身份证号码的出生年份,可以是18
、19
或20
。\d{2}
- 匹配接下来的两位数字,这部分是身份证号码的出生月份。(?:0[1-9]|10|11|12)
- 这是一个非捕获组,匹配身份证号码的出生月份,可以是01
到12
。(?:0[1-9]|[1-2]\d|30|31)
- 这是一个非捕获组,匹配身份证号码的出生日期,可以是01
到31
。\d{3}
- 匹配接下来的三位数字,这部分是身份证号码的顺序码。[\dXx]
- 匹配一个数字或大写字母X
,这部分是身份证号码的校验码。$
- 断言行的结束。
const idNumber = "11010519900101999X";
const regex = /^[1-9]\d{5}(?:18|19|20)\d{2}(?:0[1-9]|10|11|12)(?:0[1-9]|[1-2]\d|30|31)\d{3}[\dXx]$/;if (regex.test(idNumber)) {console.log("有效的身份证号码");
} else {console.log("无效的身份证号码");
}
这是正则表达式中可用的其他一些修饰符:
i
:不区分大小写的匹配。m
:多行模式,影响^
和$
的行为。y
:粘连模式,影响^
和$
的行为,与m
修饰符类似。u
:Unicode 模式,影响一些特殊字符的行为。s
:点号.
匹配包括换行符在内的所有字符。c
:单行模式,^
和$
匹配字符串的开始和结束。- g:在整个输入字符串中查找匹配,而不是在找到第一个匹配后停止。返回所有匹配项,而不是只返回第一个匹配项。
4.JS中的计时事件函数
1. setInterval() - 间隔指定的毫秒数不停地执行指定的代码。
window.setInterval("javascript function",milliseconds);
window.setInterval() 方法可以不使用 window 前缀,直接使用函数 setInterval()。
第一个参数是函数(function), 第二个参数间隔的毫秒数。
clearInterval() 方法用于停止 setInterval() 方法执行的函数代码。
window.clearInterval(intervalVariable)
window.clearInterval() 方法可以不使用window前缀,直接使用函数clearInterval()。
要使用 clearInterval() 方法, 在创建计时方法时你必须使用全局变量:
myVar=setInterval("javascript function",milliseconds);
然后你可以使用 clearInterval() 方法来停止执行。
例:
<p>页面上显示时钟:</p>
<p id="demo"></p>
<button onclick="myStopFunction()">停止</button><script>
const myVar=setInterval(function(){myTimer()},1000);
function myTimer(){var d=new Date();var t=d.toLocaleTimeString();document.getElementById("demo").innerHTML=t;
}
function myStopFunction(){clearInterval(myVar);//清除函数
}
</script>
2. setTimeout() - 在指定的毫秒数后执行指定代码。
myVar= window.setTimeout("javascript function", milliseconds);
setTimeout() 的第一个参数是含有 JavaScript 语句的字符串。第二个参数指示从当前起多少毫秒后执行第一个参数。
clearTimeout() 方法用于停止执行setTimeout()方法的函数代码。
<p>点击第一个按钮等待3秒后出现"Hello"弹框。</p>
<p>点击第二个按钮来阻止第一个函数运行。(你必须在3秒之前点击它)。</p>
<button onclick="myFunction()">点我</button>
<button onclick="myStopFunction()">停止弹框</button><script>
var myVar;
function myFunction(){myVar=setTimeout(function(){alert("Hello")},3000);
}
function myStopFunction(){clearTimeout(myVar);//清除函数
}
</script>
5.JS中的逻辑运算符
1.data || { }
在 JavaScript 中,data || {}
表示逻辑或运算符。它会返回两个操作数中的一个,如果第一个操作数为真值(truthy),则返回第一个操作数的值;如果第一个操作数为假值(falsy),则返回第二个操作数的值。
具体到 data || {}
,如果 data 是一个真值(例如非空对象、非空字符串等),则表达式的值为 data;如果 data 是一个假值(null、undefined、空字符串等),则表达式的值为一个空的对象 { }。
这种写法通常用于提供一个默认值,即当 data 为假值时,使用一个备用的默认对象 { }
2.data ?? { }
这是一个 JavaScript 中的 Nullish Coalescing 运算符,用于判断一个变量是否为 null 或者 undefined,如果是则返回一个默认的值(此处是一个空的对象 {}),否则返回该变量的值。
具体来说,这个运算符表示:如果 data 为 null 或 undefined,则返回空对象 {},否则返回 data 的值。这种写法可以简化一些代码,避免出现类似以下的判断:
if (data === null || data === undefined) {data = {};
}
使用 Nullish Coalescing 运算符可以更加简洁明了,例如:
const newData = data ?? {};
如果 data 为 null 或 undefined,则 newData 的值为一个空的对象 {};否则,newData 的值为 data 的值。
3.data && date
在 JavaScript 中,data && date
是逻辑与运算符。它会返回两个操作数中的一个,如果第一个操作数为真值(truthy),则返回第二个操作数的值;如果第一个操作数为假值(falsy),则返回第一个操作数的值。
具体到 data && date
,如果 data 是一个真值(例如非空对象、非空字符串等),则表达式的值为 date;如果 data 是一个假值(null、undefined、空字符串等),则表达式的值为 data。
这种写法通常用于对变量进行条件判断并执行相应的操作。(返回的是假的值)