js最实用string(字符串)类型的使用及截取与拼接详解


Posted in Javascript onApril 26, 2019

var a = '世界上最远的距离不是天涯海角';

一、通过字符获取位置或通过位置获取字符:

//指定位置返回字符
console.log(str.charAt(1));
console.log(str[1]);
//指定位置返回字符编码
console.log(str.charCodeAt(1));
 
//返回字符串位置
console.log(str.indexOf("o"));//不存在返回-1
console.log(str.lastIndexOf("o"));

在浏览器中执行结果如下:

假如现在有个变量:

var a = '世界上最远的距离不是天涯海角';

var b = '最远的距离';

现在想动态获取到变量b之前的字符串,和变量之后的字符串,则可以这样

1.利用slice获取到之前的字符串;

2.获取到变量b的长度,在b初始位置后加上b的长度,及从b的尾部截取a的长度(当然a当长度可以省略!);

二、拼接字符串:

一般有两种:

a.直接用“+”;

b.concat函数

三、切割方法

console.log(str.slice(3,7));//开始、结束(有开始、有结束)
console.log(str.substring(3,7));//开始、结束(有开始、有结束)
console.log(str.substr(3,7));//开始、长度(有开始、无结束、有长度)
 
console.log(str.slice(-3,-2));//第一个负值与长度相加,第二个负值与长度相加
console.log(str.substring(3,-1));//第一个负值转换为0,第二个负值转换为0,如果开始大于结束,则对调
console.log(str.substr(-3,-1));//第一个负值与长度相加,第二个负值转换为0

下面看个例子:

var type可为dir/file

if (type !== 'dir' && name.indexOf('.') !== -1) {//file
 basename=name.substr(0,name.lastIndexOf('.'));
 extension=name.substr(name.lastIndexOf('.'));
} else {//dir
 basename=name;
 extension=false;
}


//中文

四、去掉前后空格

var strValue = " hello world! ";
var trimedStrValue = strValue.trim();
console.log(strValue);
console.log(trimedStrValue);

五、大小写转换方法

var strLowUp = "HELLO world!";
console.log(str.toLowerCase());
console.log(str.toUpperCase());
console.log(strLowUp);

六、与模式有关的方法,调用者为字符串,参数为模式(正则对象或正则表达式或字符串)

1、匹配方法,本质上与调用RegExp的exec()方法相同(调用者为正则表达式或正则对象,参数为字符串)
 //返回数组对象,第一项为匹配到的字符串,其它项为捕获组匹配到的字符串
//返回对象同时具有index和input属性,index为匹配到字符串的索引,input为进行匹配的字符串str

 2、查询/搜索方法
 //返回值为匹配字符的索引,如未查询到则返回-1

 search() 方法用于检索字符串中指定的子字符串,或检索与正则表达式相匹配的子字符串。

3、替换方法,两个参数,用参数二替换参数一,参数一为字符串或正则表达式,参数二为字符串或函数

a. //正则

b. 字符串

c. 函数

//如果第二个参数是函数
//函数接收的参数为:匹配到的子字符串、
  第一个捕获组匹配到的子字符串、
  第二个捕获组匹配到的子字符串...、模式匹配项的索引、原始字符串
var repStr = str.replace(/at/g,function(match,index,input){
console.log(match);//at
console.log(index);//
console.log(input);//cat,bat,sat,fat
return "an";
});
 
console.log(repStr);//can,ban,san,fan

4、分割方法,将字符串按照指定的分隔符分割为多个子字符串

//返回值为存放多个子字符串的数组
var str = "red,blue,green,yellow";
var strArray = str.split(",");
var strArray = str.split(/[^\,]+/);//匹配所有不是逗号字符作为分隔符
console.log(strArray);//["red", "blue", "green", "yellow"]
 
//第二个参数用于控制数组的长度
var strArray = str.split(",",2);
console.log(strArray);//["red", "blue", "green", "yellow"]

七、比较方法,返回值为1(>0)、0、-1(<0)

var strValue = "yellow";
console.log(strValue.localeCompare("brick"));//>0
console.log(strValue.localeCompare("yellow"));//0
console.log(strValue.localeCompare("zoo"));//<0

以上所述是小编给大家介绍的js string使用截取与拼接详解整合,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
JavaScript脚本性能的优化方法
Feb 02 Javascript
javascript 单选框,多选框美化代码
Aug 01 Javascript
JQuery将文本转化成JSON对象需要注意的问题
May 09 Javascript
jquery实现弹出层遮罩效果的简单实例
Mar 03 Javascript
jQuery实现选中弹出窗口选择框内容后赋值给文本框的方法
Nov 23 Javascript
微信小程序 wxapp画布 canvas详细介绍
Oct 31 Javascript
Vue封装的可编辑表格插件方法
Aug 28 Javascript
vueJs实现DOM加载完之后自动下拉到底部的实例代码
Aug 31 Javascript
JS选取DOM元素常见操作方法实例分析
Dec 10 Javascript
浅谈Vue项目骨架屏注入实践
Aug 05 Javascript
在Vue mounted方法中使用data变量详解
Nov 05 Javascript
详解vue路由
Aug 05 Javascript
微信小程序实现的绘制table表格功能示例
Apr 26 #Javascript
Vue使用Canvas绘制图片、矩形、线条、文字,下载图片
Apr 26 #Javascript
微信小程序如何修改本地缓存key中单个数据的详解
Apr 26 #Javascript
js验证身份证号码记录的方法
Apr 26 #Javascript
详解VScode编辑器vue环境搭建所遇问题解决方案
Apr 26 #Javascript
react高阶组件添加和删除props
Apr 26 #Javascript
详解微信小程序-canvas绘制文字实现自动换行
Apr 26 #Javascript
You might like
PHP面向对象分析设计的61条军规小结
2010/07/17 PHP
apache+codeigniter 通过.htcaccess做动态二级域名解析
2012/07/01 PHP
Laravel5框架添加自定义辅助函数的方法
2018/08/01 PHP
javascript脚本编程解决考试分数统计问题
2008/10/18 Javascript
理解 JavaScript 预解析
2009/10/25 Javascript
jquery CSS选择器笔记
2010/03/29 Javascript
通过jquery还原含有rowspan、colspan的table的实现方法
2012/02/10 Javascript
JavaScript String.replace函数参数实例说明
2013/06/06 Javascript
JavaScript全排列的六种算法 具体实现
2013/06/29 Javascript
jquery append()方法与html()方法的区别及使用介绍
2014/08/01 Javascript
js图片闪动特效可以控制间隔时间如几分钟闪动一下
2014/08/12 Javascript
使用requestAnimationFrame实现js动画性能好
2015/08/06 Javascript
JS基于面向对象实现的多个倒计时器功能示例
2017/02/28 Javascript
用nodejs实现json和jsonp服务的方法
2017/08/25 NodeJs
Webpack优化配置缩小文件搜索范围
2017/12/25 Javascript
Bootstrap 中data-[*] 属性的整理
2018/03/13 Javascript
详解vue-cli下ESlint 配置说明
2018/09/03 Javascript
vue+Vue Router多级侧导航切换路由(页面)的实现代码
2018/12/20 Javascript
vue中v-show和v-if的异同及v-show用法
2019/06/06 Javascript
python提取图像的名字*.jpg到txt文本的方法
2018/05/10 Python
pandas 按照特定顺序输出的实现代码
2018/07/10 Python
解决tensorflow模型参数保存和加载的问题
2018/07/26 Python
python发送告警邮件脚本
2018/09/17 Python
python 检查文件mime类型的方法
2018/12/08 Python
美国最大的在线水培用品商店:GrowersHouse.com
2018/08/14 全球购物
澳大利亚玩具剧场:Toy Playhouse
2019/03/03 全球购物
eBay奥地利站:eBay.at
2019/07/24 全球购物
日本亚马逊官方网站:Amazon.co.jp
2020/04/14 全球购物
Java模拟试题
2014/11/10 面试题
优秀会计求职信
2014/07/04 职场文书
2015年毕业生自我鉴定模板
2014/09/19 职场文书
企业2014年度工作总结
2014/12/10 职场文书
会计求职信怎么写
2015/03/20 职场文书
2019年描写人生经典诗句大全
2019/07/08 职场文书
MongoDB使用场景总结
2022/02/24 MongoDB
Li list-style-image 图片垂直居中实现方法
2023/05/21 HTML / CSS