循序渐进学编程6.JavaScript标准库

最新推荐文章于 2024-07-25 00:00:00 发布

ownclock~

最新推荐文章于 2024-07-25 00:00:00 发布

阅读量374

点赞数 1

分类专栏： # Javascript 文章标签：正则表达式 javascript

原文链接：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects

版权

Javascript 专栏收录该内容

15 篇文章 0 订阅

订阅专栏

6.1 Object和Function

标准库(标准API)

库:liberary
API：应用程序编程接口，Application programing interface
标准: ECMAScript标准

Object

百度搜索JavaScript MDN文档上查看

静态成员

Object.keys(对象);得到某个对象的所有属性名数组
Object.value(对象);得到某个对象所有属性值数组
Object.entries(对象);得到某个对象的所有属性名和属性值数组

实例成员

实例方法可以被重写

所有对象,都拥有Object的实例成员

实例方法:

toString():得到某个对象的字符串格式
默认情况下，该方法返回"[object, Object]"
valueOf():得到某个对象的值
默认情况下，返回该对象本身

在js中,当自动的进行类型转换时，如果要对一个对象进行转换，实际上是先调用对象的valueOf方法，然后对返回的结果再调用toString方法

如果调用了valueOf已经得到了原始类型，则不再调用toString

// 面试题
var obj = {
    x:1,
    y:'asd',
    valueOf(){
        return 123;
    }
}
console.log(obj + 1); //结果为124


var obj = {
    x:1,
    y:'asd',
    toString() {
        return 'hello'
    }
}
console.log(obj + 1); //结果为hello1

Function

所有函数都具有Function里的实例成员

语法:arguments：在函数中使用，获取在该函数调用时，传递的所有参数(实参),如果没有传递实参，则arguments为空数组，无法映射

arguments是一个类数组（也称为伪数组：没有通过Array构造函数创建的类似于数组结构的对象），伪数组会缺少大量的数组实例方法

arguments数组中的值，会与对应的形参映射

实例成员

length属性，得到函数形参数量.
name属性,得到函数名(非标准)
匿名函数的name-如果匿名函数有name就输出它的name，如果没有name,就输出该匿名函数表达式所存储的变量名
apply方法:调用函数，同时指定函数中this指向,参数以数组传递(实参)
call方法:调用函数，同时指定函数中this指向,参数以列表传递(实参)

通常，可以利用apply和call方法，将某个伪数组抓换为伪真数组

function test()
{
    console.log(arguments);
    //将arguments转换为真数组
    var newArr = [].slice.call(arguments);
    // slice内部就是用this写的
    console.log(newArr);
}

test(12, 15, 912, 1, 5, 1);

toString方法:获取函数实现源码的字符串
bind方法:得到一个新函数，该函数中的this始终指向指定的值,参数传递与call相同.

6.2Array构造器

Array构造器

abc是Array的实例方法

var aa = new Array();
aa.abc()--->需要用构造函数new出来的对象访问

abc是Array的静态方法

Array.abc()--->直接通过构造函数访问

凡是通过Array构造函数创建的对象，都是数组

静态成员

通过百度搜索Javascript Array MDN查看

from方法:可以将一个伪数组变为真数组
isArray方法:用来判断某个变量是否是一个真的数组(Array构造器产生的数组)
of方法:

实例成员

改变原有数组

fill方法:用某个数据填充数组(value, start(默认为0), end(默认为array.length))
pop方法:删除数组中的最后一个元素，并返回该元素
push方法:在数组末尾增加一个数据，并返回新的数组的长度
reverse方法:将当前数组颠倒顺序(逆序)
shift方法:删除数组的第一个元素，并返回该元素
sort方法:对数组进行排序(根据unicode码点进行排序的)

var arr = [1, 2, 3, 4, 5, 6];
arr.sort(function(a, b) {
    return Math.random - 0.5;
})
console.log(arr);//打乱了顺序的数组

splice方法:用来删除或替换或在指定位置增加元素(start(如果大于array.length,则在数组末尾开始添加数据如果为负数,则从数组末尾开始计数,-1为倒数第一位，如果负数的绝对值大于数组长度，则指定为0),deleteCount(默认为array.length - start,如果该数大于array.length - start,则与array.length - start效果相同), item1, item2…) item1,item2…表示从指定位置开始添加的数据
unshift方法:在数组的开头增加一个或多个元素，并返回新数组的长度(item1, item2)

纯函数、无副作用函数:不会导致当前对象发生改变(还有其他要求，后面加入)

concat方法:合并多个数组
includes方法:判断数组中是否有指定的元素第二个参数表示从哪个下标开始找，与indexOf很相像，有则返回true----使用的严格相等
join方法:将数组内容拼接成一个字符串，并返回这个字符串，可以有一个参数，表示数组拼接成字符串时用什么分隔符隔开
slice方法:抽取数组中指定起止位置的数据(包括start但不包括end)
toString方法:将数组元素内容拼接成字符串，并返回该字符串
indexOf:查找指定元素的第一个索引(string, start)—使用的严格相等
lastIndexof:查找指定字符串的最后一个索引(string, start)
forEach方法:遍历数组()—默认返回值为undefined;返回值也是和map方法的区别,它不可链式调用
every:是否所有元素都满足条件(以函数为参数，返回值为boolean)
some:是否至少有一个元素满足条件
filter: 过滤，得到满足条件的元素的新数组—参数与foreach的参数相同
find:查找第一个满足条件的元素，返回元素本身，如果没有找到，返回undefined
findIndex:查找第一个满足条件的元素，返回元素的下标
map:映射，将数组的每一项映射成为另外一项，并将每一项添加进一个新数组中然后返回
reduce:统计，累计

链式编程:每一个函数调用返回的类型一致

作业:
var arr = [1, 2, 3, 4, 5, 6, -1, -2, -3, -4, -5, -6];
去掉数组中的负数，然后对每一项平方，然后再对每一项翻倍，然后求和–要求使用Array的方法
var arr = [1, 2, 3, 4, 5, 6, -1, -2, -3, -4, -5, -6];
var newArr = arr.filter(function (ele, index, array){
if(ele >= 0) {
return true;
}
}).map(function (ele, index, array) {
ele *= ele;
ele *= 2;
return ele;
}).reduce(function (acc, ele) {
acc += ele;
return acc;
}, 0)

 var arr = [1, 2, 3, 4, 5, 6, -1, -2, -3, -4, -5, -6];
        var newArr = arr.filter(function(element)
        {
            return element >= 0;
        }).map(function(element)
        {
            element *= element;
            element *= 2;
            return element;
        }).reduce(function(acc, element)
        {
           return acc += element;
        }, 0);//0是指acc的初始值，如果没有填该参数，初始值就是数组第一项，但是如果数组为空就会报错
        console.log(newArr);

6.4原始类型包装器

原始类型包装器

new 包装器(值):返回的是一个对象
包装器(值):返回的是一个值

百度搜索Number MDN/官网ECMAScript

Number

isNaN
isFinite
isInteger:判断一个数是否是整数
parseFloat:将一个数据转换为小数
parseInt:将一个数据转换为整数(直接舍去小数部分)

parseInt、parseFloat要求参数是一个字符串，如果不是字符串，则会先转换为字符串。
从字符串开始位置进行查找，找到第一个有效的数字进行转换，如果没有找到，则返回NaN，左右空白字符会忽略

parseInt('123abc')---123;
parseInt('aabc124')---NaN;
parseInt('110', 2)---6
parseInt('113', 2)---3，3为无效数字，只看前面

parseInt，可以传入第二个参数(2-36)，表示将给定的字符串，识别为多少进制，输出转换为十进制。

实例成员

toFixed方法：会有四舍五入，参数是用来限制小数点后数据的个数
toPrecision：以指定的精度返回一个数字字符串(总共的有效数字为多少位)
toString:覆盖了Object的toString方法，参数radius为将调用的Number对象转换为radius进制的数

Boolean

String

模板字符串换行
反斜杠\ 换行

静态成员

fromCharCode：通过unicode编码创建字符串(部队unicode码进行有效检查)—65-a

实例成员

length：字符串长度可读不可写

字符串是一个伪数组

charAt：得到指定位置的字符-超过length得到的值为’’，直接当作伪数组访问其超过length的下标得到的值为undefined
charCodeAt :得到指定索引的字符编码–无效的下标返回NaN
concat :连接两个字符串文本,返回一个新的字符串
includes
endsWith：是否以某个元素结尾，任何字符串都以空字符串起止
startsWith
indexOf：首次出现的索引
lastIndexOf：最后一次出现的索引
padStart:在字符串开始的位置填充（padLength, padString），padString循环填充
padEnd
repeat:将字符串重复n次

区别(面试可能会考)

slice：从某个位置取到某个位置(第二个参数位置取不到)；位置可以是负数；
substr: 从某个位置开始取，取指定的长度(第二个参数位置可以取到)；位置可以是负数；
substring：从某个位置取到某个位置；不可以是负数(负数会被转换为0)；参数位置是可调换的–(写反后两个参数会自动交换位置)。
toLowerCase:将字符串转换为小写
toUpperCase:将字符串转换为大写
split：分割字符串,可以把字符串分割成为真数组(参数是分隔符)
trim:返回一个从两头去掉空白字符的字符串，并不影响原字符本身

trimStart-trimLeft
trimEnd-trimRight

substring和slice区别:
slice 取不到第二个参数，位置可以是负数
substring取不到第二个参数，位置不可以是负数;参数位置可以调换

Math对象

6.6 Math对象

提供了一系列与数学相关的成员

常量:永远不会变化的数据，常量一般命名时所有字母大写，如果有单词时，用下划线隔开

random方法:产生一个[0,1)之间的伪随机数(有规律的)
PI属性:圆周率
abs属性:求绝对值
ceil方法:对一个数向上取整
floor方法:对一个数向下取整
max方法:得到一组数字的最大值；如果max无参，得到-Infinity
min方法:得到一组数字的最小值；如果min无参，得到Infinity
pow:求一个数字的幂
round:得到一个四舍五入的整数，当小数部分为0.5时，舍入到+∞的方向

Date构造器

Date构造器

术语

时间单位

年(year)
月(month)
日(date)
小时(hour)
分钟(minute)
秒(second)
毫秒(millsencond,ms) = 1000μs
微秒(microsencd,μs) = 1000ns
纳秒(nanosecond)

UTC 和 GMT

世界划分为24个时区，北京在东8区，格林威治(一个地方)在0时区(根据地球的自转和太阳的公转计算而得的，也就是太阳时，可以精确到ms)
GMT:GREenwish Mean Time格林威治世界时
UTC:Universal Time Coodinated世界协调时，以原子时间为计时标准，精确到ns

UTC和GMT误差不超过0.9秒，开发的时候用的是UTC

GMT + 0800 东八区 +表示东边 -号表示西边

时间戳

数字
1970 - 1 - 1 凌晨到某个时间所经过的ms数
1971年unix 32操作系统产生，系统内部内存太少，用时间戳(数字)来表示时间, 32位二进制大概在68年后(2038)就无法存储了–归0;
但是现在的操作系统是64位的，不要担心，64位可以存储2000亿年

创建时间对象

直接调用函数(不用new)，忽略所有的参数，直接返回当前时间的字符串;
new Date():创建日期对象

无参，当前时间
1个参数，参数为数字(可以为负数)，传入的是时间戳；
两个参数以上，分别表示:年、月、日、时、分、秒、毫秒

注意:月份的数字从0开始计算。

如果缺失参数,日期部分默认为1,时分秒毫秒默认为0。

月、日、时、分、秒、毫秒，均可以传递负数，如果传递负数，会根据指定日期进行计算(推迟计算)

实例成员

查看Date MDN

getDate方法：得到日期部分
getDay方法：得到星期几，0表示星期天
getFullYear方法：得到年份
getHours方法：得到小时部分
getMinutes方法：得到分钟部分
getSeconds方法：得到秒部分
getMilliseconds方法：得到毫秒部分
getTime方法：得到时间戳
getMonth方法：得到月，从0开始计算
setDate方法：设置日期
setMonth方法：设置月份
setFullYear方法：设置年
setMinutes方法
setSeconds方法
setMilliseconds方法
setTime方法：重新设置时间戳
toDateString方法：将日期部分转换为可读的字符串。
toISOString方法：将整个对象转换为ISO标准的字符串格式。
toLocaleDateString方法：根据当前系统的地区设置，将日期部分转换为可读的字符串
toLocaleString方法：根据当前系统的地区设置，将整个日期对象转换为可读的字符串
toLocaleTimeString方法：根据当前系统的地区设置，将时间部分转换为可读的字符串

日期的运算

日期对象重写了Object中的valueof方法,返回的是一个数字，表示时间戳

因此，日期对象可以进行数字运算

作业

编写一个函数，用于返回一个友好的字符格式
给定用户的生日(年，月，日)，计算该用户的年龄
根据系统当前的月份，输出这个月每一天的星期

2020年1月1日: 星期一
…
2020年1月30日:星期三

6.9 正则表达式

正则表达式

正则表达式是国际标准，跨越语言

正则表达式是一个规则，用于验证字符串；

基础

百度正则表达式菜鸟教程

字面量匹配

规则中直接书写字面量

特殊字符

.：任意字符(除换行符)
^：开始
$：结束

转义字符

\n：匹配换行
\r:匹配回车符(windows中的，Linux和ios中没有)
\t:制表符
\s：匹配任何空白字符(包含空格，回车，制表符，空格等)
\S：除了匹配任何空白字符其他都可以匹配
\b：匹配一个单词边界，即字与空格间的位置。----\bcat\b---匹配一个单词cat，两边是空格或换行,\b写在单词哪边就证明这边是单词边界
\B:	非单词边界匹配。写在单词哪边就证明哪边是单词非边界
\d:0-9的数字
\D:不是数字
\w:匹配字母、数字、下划线。等价于'[A-Za-z0-9_]'。
\W:	
匹配非字母、数字、下划线。等价于 '[^A-Za-z0-9_]'。
\u:unicode编码

转义符可以将特殊字符转义

字符集

[字符范围]：其中写入字符的规则

[^字符范围]: 对字符范围取反

匹配中文:[\u4e00 - \u9fa5]
\u9fef

量词

前面的规则出现的次数

*：匹配前面的子表达式零次或多次。要匹配 * 字符，请使用 \*。
+：一个或多个
?:匹配0个或1个
.:匹配除换行符 \n \r之外的任何单字符。要匹配 . ，请使用 \. 。
{n}:匹配n个
{n,}:匹配>=n个
{n,m}:匹配n~m个
():标记一个子表达式的开始和结束位置。子表达式可以获取供以后使用。要匹配这些字符，请使用 \( 和 \)。

或者

多个规则之间，使用或者|,表示多个规则任选其一;

作业:在菜鸟教程正则表达式中直接测试

写一个正则表达式，匹配手机号
11位，第一位是1
^1\d{10}$
姓名必须是3-6位的中文
^[\u4e00-\u9fa5]{3,6}$
密码必须是6-12位的字符，只能包含数字、字母、下划线
^[\w]{6,12}$
写一个正则表达式，匹配邮箱
xxxxxx@xxxxx.xxxx.xxxx
^\w+@\w+(\.\w+){1,2}$
匹配一个座机号
xxx-xxxxxxxx
前面：1-3个数字
后面：4-8个数字
^\d{1,3}-\d{4,8}$
匹配一个正数

^\d+(\.\d+)?$

匹配一个小数
^-?\d+\.\d+$
匹配一个整数
^-?\d+$

JS中的应用

js中，正则表达式表现为一个对象，该对象是通过构造函数RegExp

创建正则对象

查看RegExp MDN

字面量模式

var reg1 = /正则表达式规则/标志位;//需要全局搜索的话标志位写g---global，忽略大小写的话写i--ignorCase，多行匹配写m---multiline
//没有写m的话默认^就是字符串的开始,$就是字符串的结束，写了m之后^就是行的开始，$就是行的结束
var reg2 = new RegExp("正则表达式规则"或者变量, "标志位");

RegExp("规则"或者变量);


//区别
var reg2 = new RegExp(reg1);//reg1和reg2是不同的地址
var reg3 = RegExp(reg1);//reg1和reg3地址一样

//规则确定建议使用第一种，用户给我们提供的规则使用第二种

构造函数模式

正则成员

实例属性：

global
ignoreCase
multiLine
前面三个属性只能读取，返回boolean类型
source:规则字符串
lastIndex:下一次要匹配该字符串的位置，开启了全局匹配后和没有开启全局匹配是有很大区别的，而且该属性可以手动更改

实例方法：

test方法:验证某个字符串是否满足规则(return boolean)–可以用于计算匹配次数,开启了全局匹配后和没有开启全局匹配是有很大区别的(全局匹配预付了lastIndex)
exec方法:execute，得到每次匹配的结果，以一个真数组的形式返回，匹配不到返回null,和test相同，全局匹配和非全局匹配结果完全不同(全局匹配预付了lastIndex属性);

正则表达式，默认情况下，使用贪婪模式，比如1234用\d+匹配会得到1234，而不是1\2\3\4\12\34…
在量词后面加上?，开启非贪婪模式

字符串对象中的正则方法

搜素string MDN
实例方法：

match：将匹配到的结果以真数组形式返回
search：整个字符串第一次匹配到后返回其下标
split:分割符以正则表达式限制,使其功能更加强大
replace(面试题易考):替换字符串，返回一个新字符串–参数1可以是字符串，也可以是正则表达式，如果是字符串，系统将自动根据这个字符串创建一个正则表达式对象,参数2可以是函数，也可以是待替换字符串

作业:

书写一个正则表达式，去匹配一个字符串，得到匹配次数和匹配结果

    var str = "2323hkdkjasabc12321fesdasafr3421df";
    var reg = /[a-z]/g;
    var count = 0;
    var result;
    while (result = reg.exec(str)) {
        count++;
        console.log(`匹配次数${count}，匹配结果为${result[0]}`);
    }

得到一个字符串中中文字符的数量

    var str = "我13学习242Javascript语言我13学习242Javascript语言我13学习242Javascript语言";
    var reg = /[\u4e00-\u9fa5]/g;
    var count = 0;
    while (result = reg.test(str)) {
         count++;
    }
    console.log(count);

过滤敏感词，有一个敏感词数组，需要将字符串中出现的敏感词替换为四个*(连续出现两个敏感词则只出现四个*)
[“共产党”,“too yong too simple”,“营销”]

    var str = "营销共产党，这是一个游戏，不能说too yong too simple，而且不能说共产党，因为这些都是敏感词";
    var sensitve_arr = ["共产党","too yong too simple","营销"];
    var reg = new RegExp(`${sensitve_arr.join("|")}+`, 'g');
    str = str.replace(reg, "****");
    console.log(str);

得到一个html字符串中出现的章节数量

html.match('第'\d+'章').length
    var html = `
<h2>第1章</h2>
    <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Sequi recusandae mollitia labore dolor a repudiandae rem officia culpa. Ipsum corporis vero blanditiis nam recusandae mollitia consectetur, illo fugit placeat numquam!</p>
    <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam aliquam nobis commodi voluptas at ex, dolor eum tempora harum saepe itaque quae explicabo sint repudiandae molestiae incidunt quidem? Voluptatem, incidunt?</p>
    <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Error, doloribus aliquid nobis explicabo assumenda ratione minima accusamus dignissimos perferendis in earum recusandae! Facere quas, explicabo facilis doloribus aperiam culpa esse!</p>
    <p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Tenetur adipisci officiis voluptate deleniti cum modi provident error, quas aspernatur fuga quae quam eius facere voluptatibus accusamus ullam perspiciatis rerum harum.</p>
    <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Temporibus ullam perspiciatis vero sunt enim ipsum, repellendus nesciunt, velit consequuntur illum veniam ea adipisci, saepe id at? Optio maiores est quam?</p>
    <h2>第2章</h2>
    <p>Sequi ex sed, consequatur eos incidunt, quasi tempora facilis aliquam harum, nemo aliquid minima? Possimus facilis, laborum ut reprehenderit aliquam, libero illo, cumque eum quos perferendis explicabo ratione blanditiis! Inventore?</p>
    <p>Quasi, minima quam tempora magnam rerum, incidunt inventore ipsa ut impedit blanditiis temporibus esse sint fuga a necessitatibus eligendi sapiente non vitae quod iusto obcaecati? Similique numquam illo temporibus quis.</p>
    <p>Maiores, fuga vel eum neque repellendus illo quidem culpa possimus earum quisquam, voluptatum quam sapiente libero quas, odio commodi optio? Nostrum laboriosam natus vitae in aspernatur sequi ab ipsum ipsam.</p>
    <p>Dolor accusantium enim ipsum, similique atque numquam. Nemo excepturi, similique aperiam enim labore soluta animi, suscipit ad quibusdam hic molestias culpa natus nobis repudiandae velit numquam illum itaque magni. Doloremque.</p>
    <p>Quis odit iste, beatae dolor commodi voluptatem rem maiores officiis atque accusantium consectetur magni. Sed tempora ipsum provident vel, fugit modi laborum quaerat nisi sit adipisci quidem debitis dolor vero.</p>
    <h2>第3章</h2>
    <p>Modi cumque ipsum veritatis quis ratione doloremque facilis iusto officiis labore odio velit pariatur quidem, iste, fuga aut amet quisquam dolorum eveniet ex nulla? Ut eaque officiis labore distinctio a!</p>
    <p>Iste dolores ducimus sapiente rem, sed nesciunt nulla voluptatum quos labore cum modi eius at enim, ipsum repellat deserunt eaque, necessitatibus doloremque sint fugiat explicabo quaerat nisi perspiciatis. Sapiente, optio.</p>
    <p>Eaque in quae culpa minima possimus atque consequuntur, ducimus unde! Consectetur, labore nihil! Laboriosam perspiciatis provident, dolor suscipit fugit repudiandae hic nemo dolorum sit, nesciunt recusandae cupiditate. Dicta, repellat corrupti.</p>
    <p>Vitae, blanditiis! Molestiae soluta at saepe nemo atque vero earum, magnam ducimus laudantium deleniti facere reiciendis commodi excepturi quisquam quibusdam. Officiis commodi nisi omnis ipsa repellendus earum eius deleniti sint.</p>
    <p>Dignissimos, aliquam alias laboriosam beatae enim veritatis omnis ex autem fugit ratione. Eligendi nostrum id, adipisci maiores, aperiam alias tempore fugit natus cupiditate similique ipsam iure necessitatibus. Accusantium, vitae sapiente.</p>
    <h2>第4章</h2>
    <p>Facilis sit possimus debitis nesciunt veritatis sunt labore eveniet architecto numquam, quae perferendis corporis omnis ipsa nemo id similique vitae voluptas quis ut corrupti incidunt temporibus quam! Blanditiis, deleniti voluptatibus.</p>
    <p>Esse ad necessitatibus cumque fuga nisi a vitae dolor? Corrupti harum adipisci officiis vitae accusamus, facilis dicta deserunt amet. Error unde, magnam sed provident harum architecto omnis officia voluptatibus aliquid.</p>
    <p>Dicta quo nesciunt aspernatur consequatur magni explicabo dolorum laborum dolorem, consequuntur itaque ratione ad atque perferendis eaque vitae amet enim non reprehenderit autem sint minima! Quibusdam vitae corrupti iure quia.</p>
    <p>Fuga nisi cum possimus repudiandae consectetur saepe fugit dolorum a expedita provident sequi sed in optio assumenda, asperiores voluptatem voluptates veniam repellendus id error nam atque earum. Ipsa, saepe earum.</p>
    <p>Aliquid laboriosam totam molestiae dicta dignissimos nostrum molestias quaerat, vel, alias quae nulla, voluptate est facilis quas! Perferendis, repellat perspiciatis nesciunt fuga porro non? Non labore maiores asperiores architecto ad!</p>
    <h2>第5章</h2>
    <p>Itaque dignissimos id nesciunt animi ipsam, repellendus earum possimus, voluptas vitae provident tempora reiciendis delectus ratione dolorum. Expedita laudantium sed magni dignissimos aliquam quo maiores reiciendis, repellendus quaerat debitis facilis.</p>
    <p>Repellendus magni vel dignissimos, similique consequatur consectetur, deleniti est quia odio quisquam eveniet eius culpa quae doloremque reiciendis. Dicta magni qui reprehenderit praesentium consequatur placeat laborum sunt autem quam hic.</p>
    <p>Perspiciatis sit quisquam expedita excepturi minima eum suscipit odio eveniet velit similique facilis laborum doloribus cupiditate, incidunt consequuntur ratione nam commodi quaerat? Impedit, totam reiciendis vero rem dicta provident quaerat!</p>
    <p>Beatae id facilis corrupti a ipsam? Laborum quis eveniet rerum placeat unde aliquam nam recusandae labore quibusdam officiis blanditiis magni ab, non enim maxime, ad error sapiente. Aut, perferendis soluta.</p>
    <p>Nulla, esse corrupti! Labore repellat aspernatur, quisquam, saepe minus alias tempora debitis aut reiciendis optio id dolor provident soluta perferendis. Doloribus dolor nisi nam modi vel qui aspernatur voluptatibus eos.</p>
    <h2>第6章</h2>
    <p>Voluptatem magni ab iusto amet fuga illum dolor, iste suscipit, natus molestias cum, rem beatae animi maxime doloribus vitae non praesentium. Provident, accusantium fuga iste tempore vel molestias quasi dolor?</p>
    <p>Impedit consequuntur quisquam voluptates iure nemo fugit veniam perspiciatis adipisci laboriosam reprehenderit quod pariatur molestiae, illum earum recusandae iusto nam aperiam fugiat? Voluptatem nihil temporibus eum vitae, nesciunt debitis ipsum.</p>
    <p>Eveniet tempora, delectus minima atque ratione eligendi, distinctio earum id animi reprehenderit itaque suscipit corporis voluptate at! Atque esse, quas dicta facere modi vero quisquam amet illum molestias ipsam nemo.</p>
    <p>Maxime quisquam est dolorem distinctio quos nobis culpa magnam, hic qui reprehenderit officia voluptatem sint quo! Maxime aperiam eligendi, modi doloribus ad, aspernatur voluptates porro perspiciatis amet odit eaque eveniet!</p>
    <p>Tempore aliquid, vero iure, nisi dicta eius in perspiciatis voluptates totam unde rem exercitationem neque omnis porro quibusdam delectus maiores, a eaque! Eveniet, aspernatur libero! Laborum tempora molestiae dolorum commodi!</p>
    <h2>第7章</h2>
    <p>Doloribus nihil quaerat aliquam laborum modi ab itaque accusamus quidem tempora odit reiciendis ipsum, praesentium labore. Tempore, repudiandae quisquam. Tempore rerum ex tenetur a dolore ab aliquid quaerat quod ipsa.</p>
    <p>Esse laboriosam magni libero nobis sunt unde minima nemo et id! Doloribus, vero in blanditiis eveniet voluptatum ad ducimus officiis omnis quisquam possimus libero eligendi tenetur quibusdam impedit, necessitatibus voluptate?</p>
    <p>In, tempora. Sit quasi a, iusto nemo deserunt sunt ab non debitis maiores, molestias modi aspernatur magnam libero qui, fuga velit ullam ex earum soluta recusandae! Repellendus repellat delectus molestias!</p>
    <p>Iste velit maiores, nostrum molestias quisquam, voluptatibus veritatis voluptates totam nisi omnis, vero ullam a nam. Pariatur quia et, temporibus eius qui magni magnam, saepe modi impedit delectus sit? Saepe!</p>
    <p>Magni nisi earum a laborum cumque, omnis hic ipsa nesciunt recusandae ipsum necessitatibus assumenda repudiandae, consequatur sunt ea harum reprehenderit perferendis nulla voluptates iste, velit labore ipsam vitae officiis? Quis.</p>
    <h2>第8章</h2>
    <p>Asperiores hic molestias quos sunt ex quo magni explicabo ipsum quod officiis fuga veritatis quidem dolor, expedita, saepe a itaque veniam porro, dolores amet harum architecto tenetur. Officiis, sit laudantium.</p>
    <p>Ad nesciunt minus asperiores culpa fugiat repellat delectus dolores molestias ipsa cum vitae beatae, unde mollitia aspernatur soluta perferendis quidem dolore odio necessitatibus. Libero ipsam suscipit quaerat quisquam architecto dignissimos.</p>
    <p>Minima ex doloremque eos aspernatur qui? Nobis, reiciendis. Laboriosam error incidunt sequi rerum repellat ex vero reprehenderit dolore necessitatibus earum fuga labore quaerat quia, obcaecati, magni autem impedit et explicabo.</p>
    <p>Expedita modi rem ab. Nemo harum odio, commodi reprehenderit quis eius eveniet nobis iste nihil fuga molestias voluptatem explicabo natus fugiat assumenda deserunt architecto impedit dignissimos, quaerat vel. Expedita, quo!</p>
    <p>Dolorem, aliquam et quos illum sequi molestiae quaerat modi? Magnam unde accusamus itaque nesciunt labore sunt iure animi quisquam possimus repudiandae rerum nostrum fugit autem dolorum, quasi tempora, sed ipsa?</p>
    <h2>第9章</h2>
    <p>Voluptatum error nisi autem voluptatem at odit illum iste! Eius natus exercitationem qui? Provident corrupti accusantium enim quidem minima perspiciatis voluptatem autem ducimus, consequatur officia optio dolorem quis doloribus possimus!</p>
    <p>Excepturi neque libero rerum, obcaecati voluptates repudiandae blanditiis cumque eos commodi magni, quisquam tenetur saepe officia temporibus! Aspernatur, corrupti omnis magnam molestias eveniet velit, aut, atque fuga voluptatibus quasi excepturi!</p>
    <p>Quae dolor adipisci molestias accusamus assumenda consequatur voluptatibus consequuntur aperiam quis perferendis recusandae culpa aspernatur esse nemo labore minima est eos neque suscipit vitae repudiandae, voluptates deserunt? Minus, officia cumque.</p>
    <p>Harum deserunt soluta amet odit facilis itaque iste provident! Temporibus consequatur accusamus rerum sit iusto atque eaque facilis, recusandae sequi commodi cumque odit molestias sed necessitatibus id est exercitationem quidem.</p>
    <p>Provident est, natus eos eligendi incidunt quas adipisci cum accusamus quia asperiores possimus ab nesciunt dolor. Qui, autem a velit aliquid quasi fugit corrupti in iusto corporis provident iste voluptatum!</p>
    <h2>第10章</h2>
    <p>Esse aperiam id possimus repellendus dignissimos sint voluptates. Deleniti eum excepturi facere explicabo sapiente iste voluptas laborum, incidunt aspernatur, voluptatum reprehenderit similique odit nam adipisci! Dolorem impedit minus optio provident.</p>
    <p>Facere deserunt soluta neque temporibus cupiditate repellat quidem veniam, ipsam debitis, excepturi dolores unde, libero alias earum nemo aliquam. Officia repellendus, commodi illum ea voluptate animi consequuntur. Consectetur, similique asperiores.</p>
    <p>Vitae nostrum magni nam pariatur voluptatibus! Dignissimos quia delectus temporibus incidunt molestias vitae commodi quis ipsam reprehenderit corporis doloribus recusandae excepturi dolorum atque, architecto iste mollitia ea nemo asperiores natus.</p>
    <p>Provident ipsum rem accusamus nam, debitis explicabo sint perferendis? Ad, voluptatem possimus aspernatur expedita alias laudantium libero vero distinctio ea itaque quaerat officia reiciendis obcaecati incidunt, asperiores esse iusto debitis.</p>
    <p>Sunt nihil, aliquid ducimus aperiam placeat eveniet officia asperiores repudiandae beatae quae. A esse, dolore commodi et fugit distinctio ipsum perferendis, consectetur culpa illo nulla eius adipisci repellat laudantium quasi?</p>
`;
    var reg = /<h2>第\d章<\/h2>/g;
    var result = reg.exec(html);
    if (result) {
        console.log(result.length);
    } else {
        console.log(0);
    }

进阶

捕获组

用小括号包裹的部分叫做捕获组，捕获组会出现在匹配结果中,可以在exec方法里面查看

捕获组可以命名，叫做具名捕获组
在小括号一开始写 ?<名字> — 会以数组形式出现在exec的属性里

非捕获组
在小括号一开始写 ?: — 变成普通的括号，不会捕获括号里面的内容,捕获会浪费执行效率;

反向引用

在正则表达式中，使用某个捕获组，
\捕获组编号

var reg = /(\d){2}\1/;//\1就是反向引用
var s = "1313";
console.log(reg.test(s));//true
//如果s = "1321";//则无法匹配

面试题

var s = "aaaaaaabbbbbcccccdegfsssss";
//找出字符串中连续的字符
var reg = /(\w)\1+/g;
//具名捕获组，\k<name>表示获取捕获组的名字
//var reg = /(?<char>\w\k<char>+)/g
while(result = reg.exec(s))
{
    console.log(result[1];)
}

正向断言(预查)

检查某个字符后面的字符是否满足某个规则，该规则不成为匹配结果，并且不成为捕获组

var s = "adef28jif99dhiwje0";
var reg = /[A-z](?=\d)/g;//?=是正向预查，不是捕获组
//得到后面有数字的字母

面试题

var s = "2181012371801921";
// var result = "2,181,012,371,801,921";
var reg = /\B(?=(\d{3})+$)g/;
s = s.replace(reg, ",");
console.log(s);

负向断言(预查)

与正向预查正好相反符号是?!
检查某个字符后面的字符是否不满足某个规则，该规则不成为匹配结果，并且不成为捕获组

//判断密码强度
//要求密码中必须出现小写字母、大写字母、数字、特殊字符(!@#$%^&*_,.)  6-12位

var s = "24ejioqw27AH@";
var reg = /^(?=.*[a-z])(?=.*[A-Z])(?=.*[\d])(?=.*[!@#$%^&*_,.]).{6,12}$/;
console.log(reg.test(s));//true

//判断密码强度  6-12位
//出现小写字母、大写字母、数字、特殊字符(!@#$%^&*_,.)--->强
//出现小写字母、大写字母、数字-->中
//出现小写字母、大写字母--->轻
//其他--不满足要求
function judge(pwd) {
            if (/^(?=.*[a-z])(?=.*[A-Z])(?=.*[\d])(?=.*[!@#$%^&*_,.]).{6,12}$/.test(pwd)) {
                return "强";
            } else if (/^(?=.*[a-z])(?=.*[A-Z])(?=.*[\d]).{6,12}$/.test(pwd)) {
                return "中";
            } else if (/^(?=.*[a-z])(?=.*[A-Z]).{6,12}$/.test(pwd)) {
                return "轻";
            } else {
                return "不满足要求";
            }
        }

6.10错误处理

错误处理

查看Error MDN

JS中的错误分为：

语法错误：会导致整个脚本块无法执行。
运行错误
1. 运行报错：会导致当前脚本块后续代码无法执行
2. 运行结果不符合预期

调试错误

控制台打印
断点调试

抛出错误

错误在js中本质上是一个对象，抛出错误的语法为：

throw 错误对象;

错误对象的构造函数为Error(参数是一个字符串)

错误堆栈(先进栈的后出栈)–全局环境–浏览器

捕获错误

try{
    //代码块1，这里如果有throw了错误对象，这个错误对象会以实参传递给catch的形参
}
catch(错误对象){
    //代码块2
}
finally{
    //代码块3
}
// catch和finally都可以被省略，如果两者都省略了，try发生错误和throw一样

当catch有返回值时，这个函数返回值是catch,当finally也有返回值时，finally的返回值会覆盖catch的返回值

当运行代码1的时候，如果发生错误，立即停止代码1的执行，转而执行代码2，错误对象为抛出的错误对象。无论代码1和代码2是否执行完成，最终都将执行代码3

ownclock~

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
循序渐进学编程6.JavaScript标准库

6.1Object和Function6.2Array构造器6.3Array构造器作业6.4原始类型包装器6.5原始类型包装器作业6.6Math对象6.7Date构造器6.8Date构造器作业6.9正则表达式6.10错误处理6.1 Object和Function标准库(标准API)库:liberarAPI：应用程序编程接口，Application programing interface标准: ECMAScript标准Object百度搜索JavaScript MDN.
复制链接

扫一扫