【深入理解ES6】字符串和正则表达式

概念

字符串(String)是JavaScript6大原始数据类型。其他几个分别是Boolean、Null、Undefined、Number、Symbol(es6新增)。

更好的Unicode支持

1. UTF-16码位

字符串里的字符有两种:

  • 前 2^{16} 个码位均以16位的编码单元表示的BMP字符(基本多文种平面。
  • 超过 2^{16} 的UTF-16引入了代理对,以两个编码单元32位表示辅助平面字符。

ES5中的所有字符串都是基于16位编码单元,如果用同样的付方式处理包含代理对的UTF-16编码字符,得到的结果将与预期不符。

2. codePointAt() 与 charCodeAt()

codePointAt() 方法接受编码单元的位置而非字符位置作为参数,返回字符串中给定位置对应的码位(整数值)。

//a字符串中第一个字符是非BMP的,包含两个编码单元,所以它的length=3
let a='吉a' //charCodeAt() 方法返回的只是位置0处的第一个编码单元
console.log(a.charCodeAt(0))  //55362
console.log(a.charCodeAt(1))  //57271 
console.log(a.charCodeAt(2))  //97 ​//codePointAt() 方法返回完整的码位,即使这个码位包含多个编码单元。
console.log(a.charCodePointAt(0))  //134071 
console.log(a.charCodePointAt(1))  //57271 
console.log(a.charCodePointAt(2))  //97 

对于BMP字符集中的字符,codePointAt() 与 charCodeAt() 方法的返回值相同。

对于非BMP的,两个方法返回值不同。

检测一个字符占用的编码单元数量:

function is32Bit(c){return c.codePointAt(0) > 0xFFFF; //上界为16进制FFFF,超过则由两个编码单元表示,共有32位
}console.log(is32Bit("吉"));   //true
console.log(is32Bit("a"));   //false

3. String.fromCodePoint() 与 String.fromCharCode()

作用与codePointAt相反,可以根据指定的码位生成一个字符。 

对于BMP中的所有字符,String.fromCodePoint() 与 String.fromCharCode() 方法执行结果相同。

对于非BMP的码位作为参数,二者执行结果有可能不同。

console.log(String.fromCodePoint(134071)); //"吉"

4. normalize()

这个方法接受一个可选的字符串,将该字符串转化为相应的标准Unicode的形式,然后可以进行字符串的比较。以确保即使两个字符串原来分别是16位字符和32位字符也照样可以比较。 

 其他字符串变更 

1. 正则表达式u修饰符

当给正则表达式添加u字符时,它就从编码单元操作模式切换为字符模式也就是由原来匹配编码单元改为匹配字符。这样就不会视代理对为两个字符,从而完全按照预期正常运行。

1.1. 检测u修饰符支持

function hasRegExpU(){try {var pattern=new RegExp(".","u")return true;} catch(ex){return false}
}

1.2. 字符串中的字串识别

以前我们使用 indexOf() 来检测字符串中是否包含另外一段字符串。\

let msg = 'abcdefg'
if(msg.indexOf('cde') > -1) {console.log(2)  //输出2,因为t字符串中包含cde字符串。
}

在ES6中,新增了3个新方法。每个方法都接收2个参数,需要检测的子字符串,以及开始匹配的索引位置。

  • includes() 方法。用于识别当前字符串中是否包含了某一个子串。
  • startsWith()方法。顾名思义,找到以某一个子串开始的字符串。
  •  endsWith()方法。同样,从后往前查找是否包含某一个子串。
let msg = "Hello world!";console.log(msg.startsWith("Hello")); //true
console.log(msg.endWith("!"));        //true
console.log(msg.includes("o"));       //trueconsole.log(msg.startsWith("o"));    //false
console.log(msg.endWith("world"));   //true
console.log(msg.includes("x"));      //false//参数:指定要搜索的文本,指定一个开始搜索位置的索引
//includes()和startsWith()从索引位置开始匹配,endWith()从(索引值-搜索文本长度)的位置开始匹配
console.log(msg.startsWith("o",4));    //true
console.log(msg.endWith("o",8));       //true
console.log(msg.includes("o",8));      //false

1.3. repeat()

该方法接受一个number类型的参数,然后将调用该方法的字符串重复n次,返回该字符串。

console.log( "hello".repeat(2) ); // "hellohello"

其他正则表达式语法变更

1.  正则表达式 y 修饰符

该属性会通知搜索正则表达式的 lastIndex 属性开始进行,如果在指定位置没有匹配成功,则停止继续匹配。

2. 正则表达式的复制

在 ES5 环境中运行这段代码,那么你会收到一条错误信息,表示在第一个参数已经是 正则表达式的情况下不能再使用第二个参数。 ES6 则修改了这个行为,允许使用第二个参 数,并且让它覆盖第一个参数中的标志。

	var re1 = /ab/i, // ES5 中会抛出错误, ES6 中可用 re2 = new RegExp(re1, "g");console.log(re1.toString()); // "/ab/i" console.log(re2.toString()); // "/ab/g" console.log(re1.test("ab")); // true console.log(re2.test("ab")); // true console.log(re1.test("AB")); // true console.log(re2.test("AB")); // false

3.  flags属性

在ES6的版本中,添加了正则表达式的 flags 属性,该属性可以返回所有应用于当前正则表达式的修饰符字符串。

模板字面量

模板字面量是 ES6 针对 JS 直到 ES5 依然完全缺失的如下功能的填补:

  • 多行字符串:针对多行字符串的形式概念;
  • 基本的字符串格式化:将字符串部分替换为已存在的变量值的能力;
  • HTML 转义:能转换字符串以便将其安全插入到 HTML 中的能力。

模板字面量的最简单语法,是使用反引号( ` ` )来包裹普通字符串,而不是用双引号或单引号。

  •  利用它可以实现输出多行字符串。以前的时候,多行字符串依靠拼接,然后加上换行符。有了这个反撇号后就可以直接拼出来多行字符串,并且显示的时候也是多行的字符串。
  • 利用它可以实现占位符功能。声明一个变量,然后可以使用 ${ } 来取出这个变量的值。
let name = "world",
message = `Hello, ${name}.`;
console.log(message);          // "Hello, world."
console.log(typeof message);   // "string"
console.log(message.length);   // 12

模板标签

它就是一个包含了反撇号表达式的函数。这个函数以反撇号表达式作为参数,然后标签名就是这个函数的函数名。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/96058.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

尚硅谷大数据项目《在线教育之离线数仓》笔记002

视频地址:尚硅谷大数据项目《在线教育之离线数仓》_哔哩哔哩_bilibili 目录 P025 P026 P027 P028 P029 P030 P031 P032 P033 P034 P035 P036 P037 P038 P025 在Hive所在节点部署Spark P026 3)Hive on Spark测试 (1)…

深度剖析数据在内存中的存储

目录 一、数据类型介绍 类型的基本归类 1.整形家族 2.浮点数家族 3.构造类型 (自定义类型) 4.指针类型 5.空类型 二、整形在内存中的存储 1.原码、反码、补码 1.1原码 1.2反码 1.3补码 1.4计算规则 2 .大小端介绍 三、浮点型在内存中的存…

C++函数模板和类模板

C另一种编程思想称为泛型编程,主要利用的技术是模板 C提供两种模板机制:函数模板和类模板 C提供了模板(template)编程的概念。所谓模板,实际上是建立一个通用函数或类, 其类内部的类型和函数的形参类型不具体指定, 用…

算法与数据结构(七)--堆

一.堆 1.堆的定义 堆是计算机科学中一类特殊的数据结构的通常,堆通常可以被看做是一颗完全二叉树的数组对象。 堆的特性 1.它是完全二叉树,除了树的最后一层结点不需要是满的,其他的每一层从左到右都是满的,如果最后一层结点不…

WordPress更换域名后-后台无法进入,网站模版错乱,css失效,网页中图片不显示。完整解决方案(含宝塔设置)

我在实际解决问题时用到了 【简单暴力解决方案】的《方法一:修改wp-config.php》 和 【简单暴力-且特别粗暴-的解决方案】 更换域名时经常遇到的几个问题: 1、更换域名后,后台无法进入 2、更换域名后,网站模版错乱,c…

基于物理场的动态模式分解(piDMD)研究(Matlab代码实现)

💥💥💞💞欢迎来到本博客❤️❤️💥💥 🏆博主优势:🌞🌞🌞博客内容尽量做到思维缜密,逻辑清晰,为了方便读者。 ⛳️座右铭&a…

stm32红绿灯源代码示例(附带Proteus电路图)

本代码不能直接用于红路灯,只是提供一个思路 #include "main.h" #include "gpio.h" void SystemClock_Config(void); void MX_GPIO_Init(void) {GPIO_InitTypeDef GPIO_InitStruct {0};/* GPIO Ports Clock Enable */__HAL_RCC_GPIOB_CLK_ENAB…

九耶丨阁瑞钛伦特-在项目中找到的经典BUG是什么?

在项目中找到的经典BUG有很多种,以下是其中一些常见的例子: 空指针异常(NullPointerException):当程序试图访问一个空对象或未初始化的变量时,会抛出空指针异常。这通常是由于缺少对变量的正确初始化或检查…

RabbitMq-发布确认高级(避坑指南版)

在初学rabbitMq的时候,伙伴们肯定已经接触到了“发布确认”的概念,但是到了后期学习中,会接触到“springboot”中使用“发布确认”高级的概念。后者主要是解决什么问题呢?或者是什么样的场景引出这样的概念呢? 在生产环…

第1天----验证一个字符串是否是另一个字符串的子串

本文我们将学习如何去验证一个字符串是否是另一个字符串的子串。 一、小试牛刀: 题目描述 输入两个字符串,验证其中一个串是否为另一个串的子串。 输入格式 两行,每行一个字符串。 输出格式 若第一个串 s 1 是第二个串 s 2 的子串&#xff0c…

[Machine Learning] decision tree 决策树

(为了节约时间,后面关于机器学习和有关内容哦就是用中文进行书写了,如果有需要的话,我在目前手头项目交工以后,用英文重写一遍) (祝,本文同时用于比赛学习笔记和机器学习基础课程&a…

【java安全】Log4j反序列化漏洞

文章目录 【java安全】Log4j反序列化漏洞关于Apache Log4j漏洞成因CVE-2017-5645漏洞版本复现环境漏洞复现漏洞分析 CVE-2019-17571漏洞版本漏洞复现漏洞分析 参考 【java安全】Log4j反序列化漏洞 关于Apache Log4j Log4j是Apache的开源项目,可以实现对System.out…

SQL Server2019安装后使用SQL Server身份验证登录失败

错误情况 今天在电脑安装SQL Server2019和SMMS,安装过程一切顺利,但是在使用SMMS连接数据库时出现了异常。使用"Window 身份验证"登录时正常,但是如果改为使用"SQL Server 身份验证"登录时却连接失败! 解决方…

VS2022远程Linux使用cmake开发c++工程配置方法

文章目录 远程连接CMakePresets.json的配置Task.vs.json配置launch.vs.json配置最近使用别人在VS2015上使用visualgdb搭建的linux开发环境,各种不顺手,一会代码不能调转了,一会行号没了,调试的时候断不到正确的位置,取消的断点仍然会进。因此重新摸索了一套使用vs的远程开…

js判断用户当前网络状态和判断网速

前端判断用户当前网络状态和判断网速 一、第一种是通过 HTML5 提供的 navigator 去检测网络(1)、原理介绍:(2)、兼容性 二、监听window.ononline和window.onoffline事件:三、通过ajax进行请求判断(兼容性好-推荐)(1)、原理介绍:(2)、注意: 四、navigator.connection方法监听网络…

13---内嵌HTML和React

虽然Markdown本身不支持内嵌HTML和React&#xff0c;但可以在Markdown文档中直接插入HTML代码和React组件。 一、在markdown中内嵌HTML 在Markdown中&#xff0c;你可以使用HTML标签来实现更复杂的样式和布局。例如&#xff0c;你可以使用<div>标签来创建一个容器&#…

postgresql 分类排名

postgresql 分类排名 排名窗口函数示例CUME_DIST 和 NTILE 排名窗口函数 排名窗口函数用于对数据进行分组排名。常见的排名窗口函数包括&#xff1a; • ROW_NUMBER&#xff0c;为分区中的每行数据分配一个序列号&#xff0c;序列号从 1 开始分配。 • RANK&#xff0c;计算每…

私密数据采集:隧道爬虫IP技术的保密性能力探究

作为一名专业的爬虫程序员&#xff0c;今天要和大家分享一个关键的技术&#xff0c;它能够为私密数据采集提供保密性能力——隧道爬虫IP技术。如果你在进行敏感数据采集任务时需要保护数据的私密性&#xff0c;那么这项技术将是你的守护神。 在进行私密数据采集任务时&#xff…

前端性能优化——包体积压缩插件,打包速度提升插件,提升浏览器响应的速率模式

前端代码优化 –其他的优化可以具体在网上搜索 压缩项目打包后的体积大小、提升打包速度&#xff0c;是前端性能优化中非常重要的环节&#xff0c;结合工作中的实践总结&#xff0c;梳理出一些 常规且有效 的性能优化建议 ue 项目可以通过添加–report命令&#xff1a; "…

nginx上web服务的基本安全优化、服务性能优化、访问日志优化、目录资源优化和防盗链配置简介

一.基本安全优化 1.隐藏nginx软件版本信息 2.更改源码来隐藏软件名和版本 &#xff08;1&#xff09;修改第一个文件&#xff08;核心头文件&#xff09;&#xff0c;在nginx安装目录下找到这个文件并修改 &#xff08;2&#xff09;第二个文件 &#xff08;3&#xff09;…