摘要:我们需要先判断特定String里是否包含我们需要的元素,针对这个元素对这个字符串进行拆分,遍历各个元素。

本文分享自华为云社区《JavaScript/TypeScript项目里如何对特定String进行拆分然后遍历各个元素》,作者:gentle_zhou。

我们可以把题目的这个需求拆分一下,变为如下几步:判断特定String里是否包含我们需要的元素,针对这个元素对这个字符串进行拆分,遍历各个元素。

判断特定String里是否包含我们需要的元素

我们可以用includes()方法来判断我们要找的一个字符串是否包含在我们特定的字符串中,根据情况返回 true 或 false。

注:include()方法是区分大小写的。

该方法的默认语法是:str.includes(searchString[, position])。

searchString是我们要在特定字符串中去搜索的字符串;position则是可选的参数,从当前字符串的哪个索引位置开始搜寻子字符串,默认值为 0。

代码示例:

let question = 'To be, or not to be, it is a question.';

// 判断question字符串里是否包含我们需要的元素,
console.log(question.includes(',')); // 会打印出true

针对这个元素对这个字符串进行拆分

JavaScript里,split()方法根据 splitter(分隔符)将字符串拆分为两个或多个子字符串。分隔符可以是单个字符、另一个字符串甚至是一个正则表达式。

将字符串拆分为多个子字符串后,split()方法会将所有子字符串放入一个数组中并返回;它不会对原始字符串进行任何修改。

代码示例:

let question = 'To be, or not to be, it is a question.';

let quesArr = question.split(',');
console.log(quesArr); // 会打印出["To be", "or not to be", "it is a question."] console.log(arr[0]); // 打印出"To be"
console.log(arr[2]); // 打印出"it is a question."

遍历各个元素

我们有4种方法去遍历我们刚得到的数组quesArr。

// 方法1
for (let i = 0; i < quesArr.length; ++i) {
console.log(quesArr[i]);
} // 方法2
for (let i in quesArr) {
console.log(quesArr[i]);
} // 方法3
for (const v of quesArr) {
console.log(v);
} // 方法4
quesArr.forEach((v, i) => console.log(v));

这里面,我最喜欢用第一种方法,因为我可以在满足获取到所有元素要求的同时,还可以获取到特定的某个元素。

参考资料

  1. https://www.runoob.com/jsref/jsref-includes.html
  2. https://flexiple.com/javascript-split-string/
  3. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...in
  4. https://stackoverflow.com/questions/8312459/iterate-through-object-properties

点击关注,第一时间了解华为云新鲜技术~

教你如何解决JS/TS里特定String进行拆分然后遍历各个元素的更多相关文章

  1. JS/TS项目里的Module都是什么?

    摘要:在日常进行JS/TS项目开发的时候,经常会遇到require某个依赖和module.exports来定义某个函数的情况.就很好奇Modules都代表什么和有什么作用呢. 本文分享自华为云社区&l ...

  2. 学以致用:手把手教你撸一个工具库并打包发布,顺便解决JS浮点数计算精度问题

    本文讲解的是怎么实现一个工具库并打包发布到npm给大家使用.本文实现的工具是一个分数计算器,大家考虑如下情况: \[ \sqrt{(((\frac{1}{3}+3.5)*\frac{2}{9}-\fr ...

  3. 解决js跨域问题

    如何解决js跨域问题 Js跨域问题是web开发人员最常碰到的一个问题之一.所谓js跨域问题,是指在一个域下的页面中通过js访问另一个不同域下 的数据对象,出于安全性考 虑,几乎所有浏览器都不允许这种跨 ...

  4. 一些angular/js/ts的坑和吐槽

    ------20190318 ------------- 回头看,很多槽点已经随着升级改掉了   绑定string字面值到子组件@Input <app-overlay-static [name] ...

  5. 如何解决js跨域问题

    Js跨域问题是web开发人员最常碰到的一个问题之一.所谓js跨域问题,是指在一个域下的页面中通过js访问另一个不同域下的数据对象,出于安全性考 虑,几乎所有浏览器都不允许这种跨域访问,这就导致在一些a ...

  6. bower解决js的依赖管理

    bower解决js的依赖管理 前言: 一个新的web项目开始,我们总是很自然地去下载需要用到的js类库文件,比如jQuery,去官网下载名为jquery-1.10.2.min.js文件,放到我们的项目 ...

  7. 在普通js文件里引入vue实例的方法

    首先是我是写了一个 Loading 插件然后 是挂在打vue.prototype 原型上的. 在main.js中use使用了这个插件. 至此vue原型是就被我挂上 $loadding方法了. 然后我想 ...

  8. 在js文件里调用另一个js文件里的函数

    这个是我今天解决的一个小问题,我在创建界面的时候,根据不同的界面需求对应创建了不同的js文件来搭建界面,搭建完毕之后再将各个生成页面的函数汇总到主界面上,通过visibility属性切换显示,这时候出 ...

  9. 一步一步教你用 Vue.js + Vuex 制作专门收藏微信公众号的 app

    一步一步教你用 Vue.js + Vuex 制作专门收藏微信公众号的 app 转载 作者:jrainlau 链接:https://segmentfault.com/a/1190000005844155 ...

随机推荐

  1. Flutter 2.10 更新详解

    Flutter 2.10 版已正式发布!虽然⾃ 上次稳定版本发布 以来还不到两个⽉,即使在这么短的时间内,我们也已处理和关闭了 1843 个 Issue,合并了来⾃全球 155 位贡献者的 1525 ...

  2. 1.Flink实时项目前期准备

    1.日志生成项目 日志生成机器:hadoop101 jar包:mock-log-0.0.1-SNAPSHOT.jar gmall_mock ​ |----mock_common ​ |----mock ...

  3. 布客&#183;ApacheCN 编程/后端/大数据/人工智能学习资源 2020.6

    公告 我们的群共享文件有备份到 IPFS 的计划,具体时间待定. 我们的机器学习群(915394271)正式改名为财务提升群,望悉知. 请关注我们的公众号"ApacheCN",回复 ...

  4. 使用Hot Chocolate和.NET 6构建GraphQL应用(6) —— 实现Query排序功能

    系列导航 使用Hot Chocolate和.NET 6构建GraphQL应用文章索引 需求 从前几篇文章可以看出,使用Hot Chocolate实现GraphQL接口是比较简单的,本篇文章我们继续查询 ...

  5. Uwl.Admin.Core开源框架(二) 使用QuartzNet

    Uwl.Admin.Core中使用QuartzNet定时任务模块: 本文负责讲解RabbitMQ的使用 Uwl.Admin.Core使用的技术有: *.Async和Await 异步编程 *.Repos ...

  6. KMP 入门

    再次学习 \(\rm KMP\) 后不一样的理解. 一些概念 定义字符串 \(S\) 的真 前/后 缀为非自身的 前/后 缀. 定义字符串 \(S\) 的 \(border\) 为 \(S\) 的公共 ...

  7. jquery里面的$(this)和this的区别

    感谢原文作者:何少旭 原文链接:https://www.cnblogs.com/heshaoxu/p/7672736.html 前言 当你用的是jquery时,就用$(this),如果是JS,就用th ...

  8. Mac和Linux远程连接服务器异常修复(WARNING: REMOTE HOST IDENTIFICATION HAS CHANGED!)

    感谢大佬:https://blog.csdn.net/wd2014610/article/details/79945424 一.今天在使用SSH,连接远程服务器的时候,刚开始是没问题的. 后来阿里云主 ...

  9. 无法加载 mcrypt (外链,英语) 扩展,请检查您的 PHP 配置。

    转载请注明来源:https://www.cnblogs.com/hookjc/ 需要安装libcrytp,在下面的地址下载libmarypt: ftp://mcrypt.hellug.gr/pub/c ...

  10. 简单理解Zookeeper的Leader选举

    Leader选举是保证分布式数据一致性的关键所在.Leader选举分为Zookeeper集群初始化启动时选举和Zookeeper集群运行期间Leader重新选举两种情况.在讲解Leader选举前先了解 ...