JavaScript的String字符串对象常用操作总结


Posted in Javascript onMay 26, 2016

创建String对象方式
声明:String对象的方法也可以在所有基本字符串值中访问到。
调用构造函数String():

var str = new String();
 var str = new String('hello world');//初始化str,str.length = 11;

String访问及查找的方式
1.访问(通过索引)
(1)charAt()或[]
1个参数,参数为字符位置,返回字符

var strValue = new String('hello world');
console.log(strValue.charAt(1));//e
console.log(strValue[1]);//e,IE7及以下版本使用这种方式,会返回undefined

(2)charCodeAt()
1个参数,参数为字符位置,返回字符编码

var strValue = new String('hello world');
console.log(strValue.charCodeAt(1));//101

2.查找位置
(1)indexOf()
第一个参数为指定子字符串,第二个参数为检索位置。返回索引,如果没有找到则返回-1

var str = 'hello world'
str.indexOf('l');//2,返回找到的第一个字符的位置
str.indexOf('l',6);//9

(2)lastIndexOf()
与indexOf()的区别在于,lastIndexOf()是从字符串的末尾向前搜索子字符串

字符方法
1.扩展字符串
concat()
接受任意数量参数,用于将一个或多个字符串拼接起来,返回拼接得到新的字符串副本。

var str = new String('hello');
var result = str.concat(' world');
console.log(result);//hello world
typeof result//"string"

2.获取子字符串方法
slice(),substr(),substring(),这三个方法都会返回被操作字符串的子字符串副本,而且也都接受1或2个参数,前闭后开[)
(1)slice()

var str = 'hello';
str.slice(0,2);//"he",第一个参数指定字符串开始的位置,第二个参数表示字符串到哪里结束
str.slice(-3);//"llo",o代表-1,依次倒数,-3代表倒数第三个的l
str.slice(-2,-1);//"l",同理,-2代表倒数第二个l,-1代表倒数第一的o

(2)substring()

var str = 'hello';
str.substring(0,2);//"he",此时的参数意义同str.slice(0,2)
str.substring(-3);//"hello",substring()方法会把所有负值参数转换为0
str.substring(-3,-2);//"",同上

(3)substr()

var str = 'hello';
str.substr(1,2);//"el",第一个参数指定字符串的开始位置,第二个参数指定的则是返回的字符个数
str.substr(-3);//"llo",此时的参数意义同str.slice(-3)
str.substr(-3,-1);//"",substr()方法会将负的第二个参数转换为0

substr()方法传递负值时在IE中存在问题,它会返回原始的字符串,IE9修复了这个问题

3.将字符串转换为数组
split()
基于指定的分隔符(可以是字符串,也可以是RegExp对象)将字符串分割成多个子字符串,并将结果放在一个数组中,可接受可选的第二个参数,用于指定数组的大小,返回数组。

var color = 'blue,red,orange';
color.split();//["red,blue,orange"],长度为1
color.split(',');//["blue", "red", "orange"],长度为3
var color = 'blue-red-orange';
color.split('-');//["blue", "red", "orange"],长度为3
color.split(',',2);//["blue", "red"]

4.字符串大小写转换
toLowerCase(),toUpperCase()

var str = 'hello';
str.toUpperCase();//"HELLO"
str.toLowerCase();//"hello"

5.删除字符串空格方法
trim()
删除字符串中前置以及后缀的所有空格,然后返回结果副本。

var str = ' hello world ';
str.trim()//"hello world"

6.字符串的模式匹配方法
(1)match()
参数:只接受一个参数,要么是一个正则表达式,要么是一个RegExp()对象。
返回:数组。数组中的第一项是与整个模式匹配的字符串,之后的每一项(如果有)保存着正则表达式捕获组匹配的字符串
本质上与调用exec()相同。

var text = 'cat, bat, sat, fat';
var pattern = /.at/;

var matches = text.match(pattern);
matches // ["cat"]
matches.input // "cat, bat, sat, fat"
matches.index // 0

(2)search()
参数:与match()方法相同。
返回:字符串中第一个匹配项的索引,如果没有匹配项,则返回-1。
search()方法始终从前向后找

var text = 'cat, bat, sat, fat';
var pattern = /at/;

text.search(pattern) // 1

(3)replace()
参数:接收两个参数,第一个参数可以是一个RegExp对象或者一个字符串(这个字符串不会转换成正则表达式),第二个参数可以是一个字符串或者一个函数。
如果 第一个参数是字符串,那么只会替换第一个子字符串。要想替换所有子字符串,唯一的办法就是提供一个正则表达式,而且要指定全局标志(g)标志。
如果 第二个参数是字符串,那么还可以使用一些特殊的字符序列,将正则表达式操作得到的值插入到结果字符串中。
也可以是函数,传递给函数的参数依次是模式的匹配项,模式的匹配项在字符串中的位置,和原始字符串。在正则表达式定义了多个捕获组的情况下,传递给函数的参数依次是模式的匹配项,第一个捕获组的匹配项,以此类推,但最后两个参数分别是模式的匹配项在字符串中的位置和原始字符串。

字符序列 替换文本
$$ $
$& 匹配整个pattern中的子字符串
$' 匹配的子字符串之后的子字符串
$` 匹配的字符串之前的子字符串
$n 匹配第n个捕获组中的子字符串,$1
$nn 匹配第nn个捕获组的子字符串,$01

var text = 'xxx-love-xxx';
var pattern = /xxx/g;

var result = text.replace(pattern,'2')
result// "2-love-2"

text.replace(/(xxx)-\w{4}-(xxx)/g,'I love YOU');//"I love YOU"
var text = 'xxx-love-xxx';
var pattern1 = /xxx/g;

var result = text.replace(pattern1,'$$')
result// "$-love-$"

var result = text.replace(pattern1,'$&2')
result//"xxx2-love-xxx2"

var result = text.replace(pattern1,'$\'')
result//"-love-xxx-love-"
Javascript 相关文章推荐
jQuery 源码分析笔记(4) Ready函数
Jun 02 Javascript
JQuery 自定义CircleAnimation,Animate方法学习笔记
Jul 10 Javascript
js判断选择的时间是否大于今天的代码
Aug 20 Javascript
ie浏览器使用js导出网页到excel并打印
Mar 11 Javascript
Augularjs-起步详解
Jul 08 Javascript
EasyUI在Panel上动态添加LinkButton按钮
Aug 11 Javascript
判断jQuery是否加载完成,没完成继续判断的解决方法
Dec 06 jQuery
vue配置接口域名方法总结
May 12 Javascript
vue excel上传预览和table内容下载到excel文件中
Dec 10 Javascript
vue项目中使用particles实现粒子背景效果及遇到的坑(按钮没有点击响应)
Feb 11 Javascript
JavaScript实现多文件下载方法解析
Aug 07 Javascript
vue实现可拖拽的dialog弹框
May 13 Vue.js
jquery.form.js框架实现文件上传功能案例解析(springmvc)
May 26 #Javascript
jQuery过滤特殊字符及JS字符串转为数字
May 26 #Javascript
Bootstrap自定义文件上传下载样式
May 26 #Javascript
jQuery控制文本框只能输入数字和字母及使用方法
May 26 #Javascript
JavaScript中0和""比较引发的问题
May 26 #Javascript
Jquery实现select multiple左右添加和删除功能的简单实例
May 26 #Javascript
怎么引入(调用)一个JS文件
May 26 #Javascript
You might like
vBulletin HACK----显示话题大小和打开新窗口于论坛索引页
2006/10/09 PHP
php str_replace的替换漏洞
2008/03/15 PHP
PHP 杂谈《重构-改善既有代码的设计》之一 重新组织你的函数
2012/04/09 PHP
探讨PHP函数ip2long转换IP时数值太大产生负数的解决方法
2013/06/06 PHP
php操作mongoDB实例分析
2014/12/29 PHP
PHP中多线程的两个实现方法
2016/10/14 PHP
Zend Framework基于Command命令行建立ZF项目的方法
2017/02/18 PHP
PHPExcel实现表格导出功能示例【带有多个工作sheet】
2018/06/13 PHP
Laravel框架基于ajax实现二级联动功能示例
2019/01/17 PHP
用javascript实现计算两个日期的间隔天数
2007/08/14 Javascript
Javascript !!的作用
2008/12/04 Javascript
多次注册事件会导致一个事件被触发多次的解决方法
2013/08/12 Javascript
JS小功能(checkbox实现全选和全取消)实例代码
2013/11/28 Javascript
了解Javascript的模块化开发
2015/03/02 Javascript
JS返回iframe中frameBorder属性值的方法
2015/04/01 Javascript
javascript实现省市区三级联动下拉框菜单
2015/11/17 Javascript
angularjs项目的页面跳转如何实现(5种方法)
2017/05/25 Javascript
JavaScript 获取元素在父节点中的下标(推荐)
2017/06/28 Javascript
基于jquery实现多级菜单效果
2017/07/25 jQuery
jQuery图片查看插件Magnify开发详解
2017/12/25 jQuery
使用vue重构资讯页面的实例代码解析
2019/11/26 Javascript
详解webpack的clean-webpack-plugin插件报错
2020/10/16 Javascript
[46:16]2018DOTA2亚洲邀请赛3月30日 小组赛B组 iG VS VP
2018/03/31 DOTA
python实现一次创建多级目录的方法
2015/05/15 Python
手把手教你如何用Pycharm2020.1.1配置远程连接的详细步骤
2020/08/07 Python
常用的四种CSS透明属性介绍
2014/04/12 HTML / CSS
NBA德国官方网上商店:NBA Store德国
2018/04/13 全球购物
Surfdome西班牙:世界上最受欢迎的生活方式品牌
2019/02/13 全球购物
智能钱包:Ekster
2019/11/21 全球购物
大学生职业生涯规划方案
2014/01/03 职场文书
给领导的致歉信范文
2014/01/13 职场文书
入党积极分子批评与自我批评思想汇报
2014/09/14 职场文书
2014年大学生村官工作总结
2014/11/19 职场文书
中学教代会开幕词
2016/03/04 职场文书
Redis如何一键部署脚本
2021/04/12 Redis
详解MySQL事务的隔离级别与MVCC
2021/04/22 MySQL