JavaScript基础&实战 JS中正则表达式的使用

简介: 这篇文章介绍了JavaScript中正则表达式的使用,包括正则表达式的创建、匹配模式、字符串匹配、拆分、搜索、匹配和替换等方法,并通过示例代码展示了如何应用这些技术。

文章目录

  • 1、正则表达式
    • 1.1 代码
    • 1.2 测试结果
  • 2、splict | search
    • 2.1 代码
    • 2.2 测试结果

1、正则表达式

在这里插入图片描述

1.1 代码

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>正则表达式</title>
    <style type="text/css"> </style>

    <script type="text/javascript">

    /*
              正则表达式用于一些字符串的规则
                 计算机可以根据正则表达式,来检查一个字符串是否符合规则
                 获取将字符串中符合规则的内容提取出来

            //创建正则表达式的对象


                语法:
                   var 变量 = new RegExp("正则表达式","匹配模式");
                   使用typeof检查正则对象,返回object    

                   匹配模式:
                          i 执行对大小写不敏感的匹配。
                          g 执行全局匹配(查找所有匹配而非在找到第一个匹配后停止)。
                          m 执行多行匹配。



                   正则表达式的方法:
                        test()
                             使用这个方法可以用来检查一个字符串是否符合正则表达式的规则,
                                 如果符合则返回true,否则返回false


    */

              var reg = new RegExp("a","i");
              console.log(reg.test("A"))

              /*
                      使用字面量创建正则表达式
                                         语法: var 变量 =/正则表达式/匹配模式

                                         []里边的内容也是或的意思

                                         [abc] 查找方括号之间的任何字符。
                                         [^abc] 查找任何不在方括号之间的字符。
                                         [0-9] 查找任何从 0 至 9 的数字。
                                         [a-z] 查找任何从小写 a 到小写 z 的字符。
                                         [A-Z] 查找任何从大写 A 到大写 Z 的字符。
                                         [A-z] 查找任何从大写 A 到小写 z 的字符。

              */

              var reg =/a/i;
              console.log(reg.test("a"));

            //   使用| 表示或的意思
              reg =/a|b|c/;
              console.log(reg.test("adggg"));

              reg = /[afcd]/;
              console.log(reg.test("aerwf"));

              reg = /[a-z]/g;
              console.log(reg.test("f"));

            //   检查一个字符串中是否含有abc或adc或aec

            reg = /a[bdc]c/g;
            console.log(reg.test("adc"));



    </script>
</head>

<body>

</body>

</html>

1.2 测试结果

在这里插入图片描述

2、splict | search

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

2.1 代码

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>标题</title>
    <style type="text/css"> </style>

    <script type="text/javascript">
    /*

             split()
                     可以将一个字符串拆分为一个数组
                      - 方法中可以传递一个正则表达式作为参数,这样方法将会根据正则表达式去拆分字符串

    */

            // 可以根据任意字母来将字符串拆分

            var str = "1a3d5d6g3b7x3c9";
            var result = str.split(/[A-z]/);
            console.log(result);

    /*
      search() 
              - 可以搜索字符串中是否有指定内容
              - 如果搜索到指定内容,则会返回第一次出现的索引,如果没有搜索到返回-1

    */

            var str1 = "Hello adc JS afc I am your father abc !!!!";
            var result1 = str1.search("JSw");

            var result2 = str1.search(/a[abc]c/);
            console.log(result2);
            console.log(result1);

    /*
            match()
                 - 可以根据正则表达式,从一个字符串中将符合条件的内容提取出来
                 - 默认的情况下我们的match只会找到第一个符合要求的内容,找到以后就停止检索  
                       可以设置正则表达式为全局匹配模式,这样就会匹配到所有的内容
                       可以为一个正则表达式设置多个匹配模式,且顺序无所谓

                - mathc() 会将匹配到的内容封装到一个数组中返回,即使只查到一个结果

    */

             var str1 = "Hello234 adc JS af6789c I am y555our fathe9999r abc !!!!";
             result = str1.match(/[a-z]/gi);
             console.log(result);

    /*
             replace()
                      - 可以将字符串中指定内容替换为新的内容
                      - 参数:
                            1、被替换的内容
                            2、新的内容      

                            默认替换第一个

    */

          var str1 = "Hello234 adc JS af6789c I am y555our fathe9999r abc !!!!";
          result = str1.replace(/[a]/g,"@@");
          console.log(result);

          result2 = str1.replace(/[A-z]/g,"");
          console.log(result2);



    </script>
</head>

<body>

</body>

</html>

2.2 测试结果

在这里插入图片描述

相关文章
|
9月前
|
人工智能 自然语言处理 JavaScript
通义灵码2.5实战评测:Vue.js贪吃蛇游戏一键生成
通义灵码基于自然语言需求,快速生成完整Vue组件。例如,用Vue 2和JavaScript实现贪吃蛇游戏:包含键盘控制、得分系统、游戏结束判定与Canvas动态渲染。AI生成的代码符合规范,支持响应式数据与事件监听,还能进阶优化(如增加启停按钮、速度随分数提升)。传统需1小时的工作量,使用通义灵码仅10分钟完成,大幅提升开发效率。操作简单:安装插件、输入需求、运行项目即可实现功能。
460 4
 通义灵码2.5实战评测:Vue.js贪吃蛇游戏一键生成
|
5月前
|
JavaScript 前端开发 安全
【逆向】Python 调用 JS 代码实战:使用 pyexecjs 与 Node.js 无缝衔接
本文介绍了如何使用 Python 的轻量级库 `pyexecjs` 调用 JavaScript 代码,并结合 Node.js 实现完整的执行流程。内容涵盖环境搭建、基本使用、常见问题解决方案及爬虫逆向分析中的实战技巧,帮助开发者在 Python 中高效处理 JS 逻辑。
|
7月前
|
JavaScript 前端开发 算法
流量分发代码实战|学会用JS控制用户访问路径
流量分发工具(Traffic Distributor),又称跳转器或负载均衡器,可通过JavaScript按预设规则将用户随机引导至不同网站,适用于SEO优化、广告投放、A/B测试等场景。本文分享一段不到百行的JS代码,实现智能、隐蔽的流量控制,并附完整示例与算法解析。
200 1
|
9月前
|
资源调度 JavaScript 前端开发
Day.js极简轻易快速2kB的JavaScript库-替代Moment.js
dayjs是一个极简快速2kB的JavaScript库,可以为浏览器处理解析、验证、操作和显示日期和时间,它的设计目标是提供一个简单、快速且功能强大的日期处理工具,同时保持极小的体积(仅 2KB 左右)。
554 24
|
JavaScript 前端开发
JavaWeb JavaScript ③ JS的流程控制和函数
通过本文的详细介绍,您可以深入理解JavaScript的流程控制和函数的使用,进而编写出高效、可维护的代码。
269 32
|
11月前
|
JavaScript 前端开发 算法
JavaScript 中通过Array.sort() 实现多字段排序、排序稳定性、随机排序洗牌算法、优化排序性能,JS中排序算法的使用详解(附实际应用代码)
Array.sort() 是一个功能强大的方法,通过自定义的比较函数,可以处理各种复杂的排序逻辑。无论是简单的数字排序,还是多字段、嵌套对象、分组排序等高级应用,Array.sort() 都能胜任。同时,通过性能优化技巧(如映射排序)和结合其他数组方法(如 reduce),Array.sort() 可以用来实现高效的数据处理逻辑。 只有锻炼思维才能可持续地解决问题,只有思维才是真正值得学习和分享的核心要素。如果这篇博客能给您带来一点帮助,麻烦您点个赞支持一下,还可以收藏起来以备不时之需,有疑问和错误欢迎在评论区指出~
|
11月前
|
监控 JavaScript 前端开发
MutationObserver详解+案例——深入理解 JavaScript 中的 MutationObserver:原理与实战案例
MutationObserver 是一个非常强大的 API,提供了一种高效、灵活的方式来监听和响应 DOM 变化。它解决了传统 DOM 事件监听器的诸多局限性,通过异步、批量的方式处理 DOM 变化,大大提高了性能和效率。在实际开发中,合理使用 MutationObserver 可以帮助我们更好地控制 DOM 操作,提高代码的健壮性和可维护性。 只有锻炼思维才能可持续地解决问题,只有思维才是真正值得学习和分享的核心要素。如果这篇博客能给您带来一点帮助,麻烦您点个赞支持一下,还可以收藏起来以备不时之需,有疑问和错误欢迎在评论区指出~
MutationObserver详解+案例——深入理解 JavaScript 中的 MutationObserver:原理与实战案例
|
11月前
|
数据采集 JavaScript 前端开发
JavaScript中通过array.filter()实现数组的数据筛选、数据清洗和链式调用,JS中数组过滤器的使用详解(附实际应用代码)
用array.filter()来实现数据筛选、数据清洗和链式调用,相对于for循环更加清晰,语义化强,能显著提升代码的可读性和可维护性。博客不应该只有代码和解决方案,重点应该在于给出解决方案的同时分享思维模式,只有思维才能可持续地解决问题,只有思维才是真正值得学习和分享的核心要素。如果这篇博客能给您带来一点帮助,麻烦您点个赞支持一下,还可以收藏起来以备不时之需,有疑问和错误欢迎在评论区指出~
|
监控 安全 中间件
Next.js 实战 (十):中间件的魅力,打造更快更安全的应用
这篇文章介绍了什么是Next.js中的中间件以及其应用场景。中间件可以用于处理每个传入请求,比如实现日志记录、身份验证、重定向、CORS配置等功能。文章还提供了一个身份验证中间件的示例代码,以及如何使用限流中间件来限制同一IP地址的请求次数。中间件相当于一个构建模块,能够简化HTTP请求的预处理和后处理,提高代码的可维护性,有助于创建快速、安全和用户友好的Web体验。
344 0
Next.js 实战 (十):中间件的魅力,打造更快更安全的应用

热门文章

最新文章