教你如何解决JS/TS里特定String进行拆分然后遍历各个元素
摘要:我们需要先判断特定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));
这里面,我最喜欢用第一种方法,因为我可以在满足获取到所有元素要求的同时,还可以获取到特定的某个元素。
参考资料
- https://www.runoob.com/jsref/jsref-includes.html
- https://flexiple.com/javascript-split-string/
- https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...in
- https://stackoverflow.com/questions/8312459/iterate-through-object-properties
教你如何解决JS/TS里特定String进行拆分然后遍历各个元素的更多相关文章
- JS/TS项目里的Module都是什么?
摘要:在日常进行JS/TS项目开发的时候,经常会遇到require某个依赖和module.exports来定义某个函数的情况.就很好奇Modules都代表什么和有什么作用呢. 本文分享自华为云社区&l ...
- 学以致用:手把手教你撸一个工具库并打包发布,顺便解决JS浮点数计算精度问题
本文讲解的是怎么实现一个工具库并打包发布到npm给大家使用.本文实现的工具是一个分数计算器,大家考虑如下情况: \[ \sqrt{(((\frac{1}{3}+3.5)*\frac{2}{9}-\fr ...
- 解决js跨域问题
如何解决js跨域问题 Js跨域问题是web开发人员最常碰到的一个问题之一.所谓js跨域问题,是指在一个域下的页面中通过js访问另一个不同域下 的数据对象,出于安全性考 虑,几乎所有浏览器都不允许这种跨 ...
- 一些angular/js/ts的坑和吐槽
------20190318 ------------- 回头看,很多槽点已经随着升级改掉了 绑定string字面值到子组件@Input <app-overlay-static [name] ...
- 如何解决js跨域问题
Js跨域问题是web开发人员最常碰到的一个问题之一.所谓js跨域问题,是指在一个域下的页面中通过js访问另一个不同域下的数据对象,出于安全性考 虑,几乎所有浏览器都不允许这种跨域访问,这就导致在一些a ...
- bower解决js的依赖管理
bower解决js的依赖管理 前言: 一个新的web项目开始,我们总是很自然地去下载需要用到的js类库文件,比如jQuery,去官网下载名为jquery-1.10.2.min.js文件,放到我们的项目 ...
- 在普通js文件里引入vue实例的方法
首先是我是写了一个 Loading 插件然后 是挂在打vue.prototype 原型上的. 在main.js中use使用了这个插件. 至此vue原型是就被我挂上 $loadding方法了. 然后我想 ...
- 在js文件里调用另一个js文件里的函数
这个是我今天解决的一个小问题,我在创建界面的时候,根据不同的界面需求对应创建了不同的js文件来搭建界面,搭建完毕之后再将各个生成页面的函数汇总到主界面上,通过visibility属性切换显示,这时候出 ...
- 一步一步教你用 Vue.js + Vuex 制作专门收藏微信公众号的 app
一步一步教你用 Vue.js + Vuex 制作专门收藏微信公众号的 app 转载 作者:jrainlau 链接:https://segmentfault.com/a/1190000005844155 ...
随机推荐
- maven项目 子父级工程。
一 .什么是 maven 子父级工程? 建立一个maven项目,然后在该项目 下创建一个module,子级的maven,他继承于父级项目. 1.新建立 maven项目,file ------new- ...
- Spring源码-IOC部分-Bean实例化过程【5】
实验环境:spring-framework-5.0.2.jdk8.gradle4.3.1 Spring源码-IOC部分-容器简介[1] Spring源码-IOC部分-容器初始化过程[2] Spring ...
- CentOS 7中的系统语言包及UTF-8、en_US.UTF-8和zh_CN.UTF-8的区别
UTF-8.en_US.UTF-8和zh_CN.UTF-8的区别 en_US.UTF-8.zh_CN.UTF-8叫做字符集,就是说'A'.'B'.'中'.'国'等对应的整数值,en_US.UTF-8只 ...
- hr虚线
转载请注明来源:https://www.cnblogs.com/hookjc/ <hr size="1" noshade="noshade" style= ...
- js添加元素代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- lua语言:string
转载请注明来源:https://www.cnblogs.com/hookjc/ 字符串库函数string.len(s) 返回字符串s的长度:string.rep(s, n) ...
- js trim()方法
从字符串中移除前导空格.尾随空格和行终止符. 语法 stringObj.trim() 参数 stringObj 必选.String 对象或字符串.trim 方法不修改该字符串. 返回值 已移除前导空格 ...
- 类(静态)变量和类(静态)static方法以及main方法、代码块,final方法的使用,单例设计模式
类的加载:时间 1.创建对象实例(new 一个新对象时) 2.创建子类对象实例,父类也会被加载 3.使用类的静态成员时(静态属性,静态方法) 一.static 静态变量:类变量,静态属性(会被该类的所 ...
- Sublime Python3编译环境修改
http://blog.csdn.net/qq_33304418/article/details/63337602 添加编译环境python3.6 Tools -> Build Syst ...
- 赠送4本《 PHP 程序员面试笔试宝典》
< PHP 程序员面试笔试宝典>历时一年,由机械工业出版社出版,在 2018 年 11 月问世.全书共八个章节,涉及 面试笔试经验技巧.PHP 基础知识.PHP 进阶知识,PHP 面向对象 ...