JavaScript学习第九章-第三部分(内建对象)

JavaScript学习第九章-第三部分(内建对象)

• 包装类
• 字符串方法
• 正则表达式
• 垃圾回收

1、包装类

在JS中，除了直接创建原始值外，也可以创建原始值的对象。

• 通过 new String() 可以创建String类型的对象

• 通过 new Number() 可以创建Number类型的对象

• 通过 new Boolean() 可以创建Boolean类型的对象

• 注意，千万不要这么做

字符串类型

let str = new String(‘hello’);

let str1 = ‘hello’;

// 这样使用了到时候两个值判断就不相等了

console.log(str === str1);// false

数字类型

let num = new Number(11);

boolean 类型

let bool1 = new Boolean(true);

let bool2 = new Boolean(true);

// 那么这样判断就不相等了

console.log(bool1 === bool2);//false

js包装类

JS中一共有5个包装类

​ String --> 字符串包装为String对象

​ Number --> 数值包装为Number对象

​ Boolean --> 布尔值包装为Boolean对象

​ BigInt --> 大整数包装为BigInt对象

​ Symbol --> 符号包装为Symbol对象

​ - 通过包装类可以将一个原始值包装为一个对象，

​ 当我们对一个原始值调用方法或属性时，JS解释器会临时将原始值包装为对应的对象

​ 然后调用这个对象的属性或方法

​ - 由于原始值会被临时转换为对应的对象，这就意味着对象中的方法都可以直接通过原始值来调用

​

包装类的应用

包装类实际是在底层进行转换调用的，底层帮我们实现了；

//转为包装类的好处就是，我们设置值的时候不报错

let str3 = ‘hello’;

//如果不做包装类，那么该地方肯定就报错了

str3.name = ‘孙悟空’;

// 该步骤是先转为包装类，然后有一个临时变量挂载，等使用完毕后就移除了

console.log(str3.name);//undefined

//如一个数字类型的，调用它的 toString()方法，实际上就是使用的包装类

let num1 = 1;

num1 = num.toString();

console.log(num1);//11

// 如果直接使用 null.toString() 会发生什么

//null.toString();//ncaught TypeError: Cannot read properties of null (readin

2、字符串方法

• 参考地址：
  • https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String
• 字符串其本质就是一个字符数组

属性+方法

• 属性和方法：
  • length 获取字符串的长度
    • 字符串[索引] 获取指定位置的字符
      • str.at() （实验方法）
    • 根据索引获取字符，可以接受负索引
      -str.charAt()
    • 根据索引获取字符
      • str.concat()
    • 用来连接两个或多个字符串
      • str.includes()
    • 用来检查字符串中是否包含某个内容
      有返回true
      没有返回false
      • str.indexOf()
      • str.lastIndexOf()
    • 查询字符串中是否包含某个内容
      • str.startsWith()
    • 检查一个字符串是否以指定内容开头
      • str.endsWith()
    • 检查一个字符串是否以指定内容结尾
      • str.padStart()
      • str.padEnd()
    • 通过添加指定的内容，使字符串保持某个长度
      • str.replace()
    • 使用一个新字符串替换一个指定内容
      • str.replaceAll()
    • 使用一个新字符串替换所有指定内容
      • str.slice()
    • 对字符串进行切片
      • str.substring()
    • 截取字符串
      • str.split()
    • 用来将一个字符串拆分为一个数组
      • str.toLowerCase()
    • 将字符串转换为小写
      • str.toUpperCase()
    • 将字符串转换为大写
      • str.trim()
    • 去除前后空格
      • str.trimStart()
    • 去除开始空格
      • str.trimEnd()
    • 去除结束空格

字符串使用方法同数组

let str1 = ‘hello’;

console.log(str1[0]);//h

//遍历

// for(let char of str1) {

// console.log(char)

// }

属性

不需要通过方法调用，直接调用里面的属性即可

length 长度

// length 长度

let result = str1.length;

console.log(result);//5

方法

方法1 at()

// 方法1 at() （实验方法）根据索引获取字符,负数 从后往前

result = str1.at(-1);

console.log(result);//5

方法2 charAt()

// 方法2 charAt() 下标索引 不接受负值

result = str1.charAt(0);

console.log(result);//h

方法3 concat()

result = str1.concat(’ how are you’);

console.log(result);// hello how are you

includes()

// 方法3 includes()

str1 = “hello hello how are you”

result = str1.includes(‘how’);

console.log(result);//true

indexOf()

str2 = “hello how are you”

// 方法4 str.indexOf() 字符串下标位置,第一个字符位置

result = str1.indexOf(‘hello’)

console.log(result)

lastIndexOf()

// 方法5 str.lastIndexOf() 字符串下标位置,最后一个字符位置

result = str1.lastIndexOf(‘you’)

console.log(result)

endsWith()

result = str1.endsWith(‘you’)

console.log(result);//true

padStart()

/ 方法7 padStart 从开头 第一个参数为总共多少个长度，第一个为需要补充的字符

str1 = “100”;

result = str1.padStart(7,‘0’);

console.log(result);//0000100

padEnd()

// 方法8 padEnd 从结尾 第一个参数为总共多少个长度，第一个为需要补充的字符

result = str1.padEnd(7,‘0’);

console.log(result);//1000000

replace()

str2 = “hello hello how are you”

// 方法9 replace() 字符串替换,只能替换一个

result = str2.replace(‘hello’,‘张三’);

console.log(result);// 张三 hello how are you

replaceAll()

// 方法10 replaceAll() 字符串替换,只能替换一个

result = str2.replaceAll(‘hello’,‘张三’);

console.log(result);// 张三 张三 how are you

slice()

// 方法11 slice() 对字符串进行切片

result = str2.slice(0,5);

console.log(result)//hello

substring()

// 方法12 substring() 截取字符串

result = str2.substring(0,5);

console.log(result)//hello

split()

let str3 = “abc@bcd@efg@jqk” // [“abc”, “bcd”, “efg”, “jqk”]

// 方法13 split() 用来将一个字符串拆分为一个数组

result = str3.split(‘@’);

console.log(result)//[‘abc’, ‘bcd’, ‘efg’, ‘jqk’]

toLowerCase()

str3 = “abcdABCD”

// 方法14 toLowerCase() 将字符串转换为小写

result = str3.toLowerCase();

console.log(result)//abcdabcd

toLowerCase()

// 方法15 toLowerCase() 将字符串转换为大写

result = str3.toUpperCase();

console.log(result)//ABCDABCD

trim()

str3 = " ab c "

// 方法16 trim() 去除前后空格

result = str3.trim();

console.log(result)//ab c

str3 = " ab c "

// 方法17 trimStart() trimEnd 去除开始空格

result = str3.trimEnd();

console.log(result)// ab c

3、正则表达式

正则表达式

• 正则表达式用来定义一个规则
• 通过这个规则计算机可以检查一个字符串是否符合规则 或者将字符串中符合规则的内容提取出来
• 正则表达式也是JS中的一个对象， 所以要使用正则表达式，需要先创建正则表达式的对象
  • new RegExp() 可以接收两个参数：
    • （字符串） 1.正则表达式
    • 2.匹配模式

创建方式

// 创建方式1 通过构造函数来创建一个正则表达式的对象

let reg = new RegExp(‘a’,‘i’);

// 创建方式2 使用字面量来创建正则表达式

reg = /a/i;

reg = /\w/;

// \w 这种如果通过构造方法，需要使用 \ 转义

reg = new RegExp(‘\w’);

console.log(reg);// /\w/

使用方法

//使用方式

reg = new RegExp(‘a’);

// 通过正则表达式检查一个字符串是否符合规则

let str = ‘a’;

let result = reg.test(str);

console.log(result);//true

console.log(reg.test(‘b’));//false

console.log(reg.test(‘abc’));//true

console.log(reg.test(‘bcdaefg’));//true

reg = /a/;

console.log(reg.test(‘bddfe’));//false

4、正则表达式语法

1.在正则表达式中大部分字符都可以直接写2.| 在正则表达式中表示或3.[] 表示或（字符集）[a-z] 任意的小写字母[A-Z] 任意的大写字母[a-zA-Z] 任意的字母[0-9]任意数字4.[^] 表示除了[^x] 除了x5. . 表示除了换行外的任意字符6. 在正则表达式中使用\作为转义字符7. 其他的字符集\w 任意的单词字符 [A-Za-z0-9_]\W 除了单词字符 [^A-Za-z0-9_]\d 任意数字 [0-9]\D 除了数字 [^0-9]\s 空格\S 除了空格\b 单词边界\B 除了单词边界8. 开头和结尾^ 表示字符串的开头$ 表示字符串的结尾

使用示例

<script>// | 或 let reg = /abc|bcd/;console.log(reg.test('abc'));//trueconsole.log(reg.test('bcd'));//trueconsole.log(reg.test('azasbc'));//false// []  或reg = /[a-z]/;console.log(reg.test('azasbc'));//truereg = /[A-Z]/;console.log(reg.test('azasbc'));//false// 匹配模式 i 表示忽略大小写reg = /[a-z]/iconsole.log(reg.test('azasbc'));//true// [^] 表示除了 xx 之外的数据  reg = /[^a-z]/;console.log(reg.test('azasbc'));//false// . 表示除了换行外的任意字符reg = /./;console.log(reg.test('\n'));//false// 如果想匹配字符中间带来 . 的需要转移reg = /\./console.log(reg.test('abcdg.dfdkjk'));//true// 其他  \w 任意的单词字符 [A-Za-z0-9_]reg = /\w/;console.log(reg.test('ab12334cdgd'));//true// ^ 表示字符串的开头reg = /^ab/;console.log(reg.test('a'));//true// $ 匹配结束位置的reg = /a$/;console.log(reg.test('bcagda'));//true// 只匹配字母a，完全匹配，要求字符串必须和正则完全一致reg = /^a$/;console.log(reg.test('a'));//trueconsole.log(reg.test('aaaa'));//false// 匹配开始 和结尾reg = /^abc$/;console.log(reg.test('abc'));//trueconsole.log(reg.test('aac'));//false</script>

5、正则表达式-量词

量词

{m} 正好m个

{m,} 至少m个

{m,n} m-n个

+ 一个以上，相当于{1,}

* 任意数量的a

? 0-1次 {0,1}

使用示例

<script>// {}  必须是指定的个数let reg = /a{3}/;console.log(reg.test('aaa'));//trueconsole.log(reg.test('abb'));// falsereg = /^a{3}$/console.log(reg.test('aaa'));//true// 以 ab 开头,ab 结尾 必须三个ab reg = /^(ab){3}$/;console.log(reg.test('ababab'));//trueconsole.log(reg.test('ab'));//false// 以a-z 字符开头和结尾，且必须有三位长度reg = /^[a-z]{3}$/;console.log(reg.test('abcagdgsada'));//falseconsole.log(reg.test('abc'));//true// {,}至少m个  至少 3 个 reg = /^[a-z]{3,}$/;console.log(reg.test('abcagdgsada'));//trueconsole.log(reg.test('abca111gdgsada'));//false// 至少3个，最多 5个字母reg = /^[a-z]{3,5}$/;console.log(reg.test('abcagdgsada'));//falseconsole.log(reg.test('abcb'));//true// + 一个以上，相当于{1,}reg = /^ba+$/;console.log(reg.test('baaaaaaaa'));//true// * 任意数量reg = /^ba*$/;console.log(reg.test('b'));//true// ? 0 -1 次  最多出现一次 reg = /^ba?$/;console.log(reg.test('ba'));//trueconsole.log(reg.test('b'));//trueconsole.log(reg.test('baa'));//false</script>

6、正则表达式-exec

re.exec()

- 获取字符串中符合正则表达式的内容

使用示例

7、正则小练习

• 提取手机号，从以下的字符串中
  • dajsdh13715678903jasdlakdkjg13457890657djashdjka13811678908sdadadasd

基本提取

// 首先编写一个手机号的正则

let reg = /1[3-9]\d{9}/g;

let result;

while(result = reg.exec(str)) {

console.log(result[0]);

}

console.log(“==============>”)

提取后脱敏

 // 将手机号进行脱敏操作 前三位 *** 后四位 reg = /(1[3-9]\d)\d{4}(\d{4})/g;while (result = reg.exec(str)) {console.log(result);console.log(result[1]+"****"+result[2]);}

8、正则表达式-字符串

split()

• 可以根据正则表达式来对一个字符串进行拆分
  • search() 可以去搜索符合正则表达式的内容第一次在字符串中出现的位置
  • replace() 根据正则表达式替换字符串中的指定内容
  • match() 根据正则表达式去匹配字符串中符合要求的内容
  • matchAll() 根据正则表达式去匹配字符串中符合要求的内容(必须设置g 全局匹配) 它返回的是一个迭代器

使用示例

<script>let str = "a@b@c@d";//传统 split 方法let result = str.split("@");console.log(result);//Array(4)// 提取  abc / adc 字符串str = "孙悟空abc猪八戒adc沙和尚";result =str.split(/a[bd]c/);console.log(result);//['孙悟空', '猪八戒', '沙和尚']// searchstr = "dajsdh13715678903jasdlakdkjg13457890657djashdjka13811678908sdadadasd"result = str.search('13715678903');// 6console.log(result)result = str.search(/1[3-9]\d{9}/);// 6console.log(result)// replace()  替换result = str.replace(/1[3-9]\d{9}/g,'哈哈哈');console.log(result);// dajsdh哈哈哈jasdlakdkjg哈哈哈djashdjka哈哈哈sdadadasd// match() 根据正则表达式去匹配字符串中符合要求的内容result = str.match(/1[3-9]\d{9}/g);console.log(result);// ['13715678903', '13457890657', '13811678908']// matchAllresult = str.matchAll(/1[3-9](\d{9})/g)for (let item of result) {console.log(item)}</script>

1752499097596)

9、垃圾回收

垃圾回收（Garbage collection）

• 和生活一样，生活时间长了以后会产生生活垃圾
  段时间后也会产生垃圾
  • 在程序的世界中，什么是垃圾？
    个对象没有任何的变量对其进行引用，那么这个对象就是一个垃圾
  • 垃圾对象的存在，会严重的影响程序的性能
    中有自动的垃圾回收机制，这些垃圾对象会被解释器自动回收，我们无需手动处理
  • 对于垃圾回收来说，我们唯一能做的事情就是将不再使用的变量设置为null

使用示例

<script>let obj = { name: "孙悟空" }let obj2 = obj// 指向为空，那么就进行垃圾回收obj = nullobj2 = null
</script>