js字符串操作总结(必看篇)
本文链接: https://www.jb51.net/article/97915.htm
字符方法
<!DOCTYPE html>
<html lang=
"en"
>
<head>
<meta charset=
"utf-8"
>
<title>字符方法</title>
</head>
<body>
<script type=
"text/javascript"
>
/*
charAt方法和charCodeAt方法都接收一个参数,基于0的字符位置
charAt方法是以单字符字符串的形式返回给定位置的那个字符
charCodeAt方法获取到的不是字符而是字符编码
*/
var
str=
"hello world"
;
console.log(str.charAt(1));
//e
console.log(str.charCodeAt(1));
//101
//还可以使用方括号加数字索引来访问字符串中特定的字符
console.log(str[1]);
//e
</script>
</body>
</html>
concat方法
<!DOCTYPE html>
<html lang=
"en"
>
<head>
<meta charset=
"utf-8"
>
<title>concat方法</title>
</head>
<body>
<script type=
"text/javascript"
>
var
str=
"hello "
;
var
res=str.concat(
"world"
);
console.log(res);
//hello world
console.log(str);
//hello 这说明原来字符串的值没有改变
var
res1=str.concat(
"nihao"
,
"!"
);
console.log(res1);
//hello nihao! 说明concat方法可以接收任意多个参数
//虽然concat方法是专门用来拼接字符串的,但是实践中我们使用最多的还是加操作符+,因为其简易便行
</script>
</body>
</html>
<!DOCTYPE html>
<html lang=
"en"
>
<head>
<meta charset=
"utf-8"
>
<title>字符串操作方法</title>
</head>
<body>
<script type=
"text/javascript"
>
/*
slice方法:第一个参数指定子字符串开始位置,第二个参数表示子字符串最后一个字符后面的位置
substring方法:第一个参数指定子字符串开始位置,第二个参数表示子字符串最后一个字符后面的位置
substr方法:第一个参数指定子字符串开始位置,第二个参数表示返回的字符个数
这三个方法都会返回被操作字符串的一个子字符串,都接收一或两个参数
如果没有给这些方法传递第二个参数,则将字符串的长度作为结束位置。这些方法也不会修改字符串本身,只是返回一个基本类型的字符串值
*/
var
str=
"hello world"
;
console.log(str.slice(3));
//lo world
console.log(str.substring(3));
//lo world
console.log(str.substr(3));
//lo world
console.log(str.slice(3,7));
//lo w 7表示子字符串最后一个字符后面的位置 简单理解就是包含头不包含尾
console.log(str.substring(3,7));
//lo w
console.log(str.substr(3,7));
//lo worl 7表示返回7个字符
console.log(str.slice(3,-4));
//lo w -4+11=7表示子字符串最后一个字符后面的位置 简单理解就是包含头不包含尾
console.log(str.substring(3,-4));
//hel 会转换为console.log(str.substring(3,0));
//此外由于这个方法会将较小数作为开始位置,较大数作为结束位置,所以相当于调用console.log(str.substring(0,3));
console.log(str.substr(3,-4));
//""空字符串
console.log(str.substring(3,0));
</script>
</body>
</html>
<!DOCTYPE html>
<html lang=
"en"
>
<head>
<meta charset=
"utf-8"
>
<title>字符串位置方法</title>
</head>
<body>
<script type=
"text/javascript"
>
/*
indexOf方法和lastIndexOf方法都是从一个字符串中搜索给定的子字符串,然后返回子字符串的位置,如果没有找到,则返回-1
indexOf方法是从字符串的开头向后搜索子字符串,lastIndexOf方法正好相反
这两个方法都可以接收两个参数:要查找的子字符串和查找的位置
*/
var
str=
"hello world"
;
console.log(str.indexOf(
"o"
));
//4
console.log(str.lastIndexOf(
"o"
));
//7
console.log(str.indexOf(
"o"
,6));
//7
console.log(str.lastIndexOf(
"o"
,6));
//4
</script>
</body>
</html>
<!DOCTYPE html>
<html lang=
"en"
>
<head>
<meta charset=
"utf-8"
>
<title>trim方法</title>
</head>
<body>
<script type=
"text/javascript"
>
/*
trim方法用来删除字符串前后的空格
*/
var
str=
" hello world "
;
console.log(
'('
+str.trim()+
')'
);
//(hello world)
console.log(
'('
+str+
')'
);
//( hello world )
</script>
</body>
</html>
<!DOCTYPE html>
<html lang=
"en"
>
<head>
<meta charset=
"utf-8"
>
<title>大小写转换</title>
</head>
<body>
<script type=
"text/javascript"
>
var
str=
"HELLO world"
;
console.log(str.toLowerCase());
//hello world
console.log(str.toUpperCase());
//HELLO WORLD
</script>
</body>
</html>
<!DOCTYPE html>
<html lang=
"en"
>
<head>
<meta charset=
"utf-8"
>
<title>字符串模式匹配</title>
</head>
<body>
<script type=
"text/javascript"
>
/*
match方法:只接受一个参数,由字符串或RegExp对象指定的一个正则表达式
search方法:只接受一个参数,由字符串或RegExp对象指定的一个正则表达式
search方法返回字符串中第一个匹配项的索引,如果没有匹配项,返回-1
*/
var
str=
"cat,bat,sat,fat"
;
var
pattern=/.at/;
var
matches=str.match(pattern);
console.log(matches.index);
//0
console.log(matches[0]);
//cat
console.log(pattern.lastIndex);
//0
//lastIndex表示开始搜索下一个匹配项的字符位置,从0算起
var
pos=str.search(/at/);
console.log(pos);
//1 1表示at字符串在原来字符串中第一次出现的位置
</script>
</body>
</html>
<!DOCTYPE html>
<html lang=
"en"
>
<head>
<meta charset=
"utf-8"
>
<title>replace方法</title>
</head>
<body>
<script type=
"text/javascript"
>
var
str=
"cat,bat,sat,fat"
;
var
res=str.replace(
"at"
,
"one"
);
//第一个参数是字符串,所以只会替换第一个子字符串
console.log(res);
//cone,bat,sat,fat
var
res1=str.replace(/at/g,
"one"
);
//第一个参数是正则表达式,所以会替换所有的子字符串
console.log(res1);
//cone,bone,sone,fone
</script>
</body>
</html>
<!DOCTYPE html>
<html lang=
"en"
>
<head>
<meta charset=
"utf-8"
>
<title>split方法</title>
</head>
<body>
<script type=
"text/javascript"
>
/*
split方法是基于指定的字符,将字符串分割成字符串数组
当指定的字符为空字符串时,将会分隔整个字符串
*/
var
str=
"red,blue,green,yellow"
;
console.log(str.split(
","
));
//["red", "blue", "green", "yellow"]
console.log(str.split(
","
,2));
//["red", "blue"] 第二个参数用来限制数组大小
console.log(str.split(/[^\,]+/));
// ["", ",", ",", ",", ""]
//第一项和最后一项为空字符串是因为正则表达式指定的分隔符出现在了子字符串的开头,即"red"和"yellow"
//[^...] 不在方括号内的任意字符 只要不是逗号都是分隔符
</script>
</body>
</html>
<!DOCTYPE html>
<html lang=
"en"
>
<head>
<meta charset=
"utf-8"
>
<title>localeCompare方法</title>
</head>
<body>
<script type=
"text/javascript"
>
/*
这个方法用于比较两个字符串
1.如果字符串在字母表中应该排在字符串参数之前,则返回一个负数
1.如果字符串等于字符串参数,则返回0
1.如果字符串在字母表中应该排在字符串参数之后,则返回一个正数
*/
var
str=
"yellow"
;
console.log(str.localeCompare(
"brick"
));
//1
console.log(str.localeCompare(
"yellow"
));
//0
console.log(str.localeCompare(
"zoo"
));
//-1
</script>
</body>
</html>
<!DOCTYPE html>
<html lang=
"en"
>
<head>
<meta charset=
"utf-8"
>
<title>fromCharCode方法</title>
</head>
<body>
<script type=
"text/javascript"
>
/*
fromCharCode方法是接收一或多个字符编码,然后将其转换为字符串
fromCharCode方法是String构造函数的一个静态方法
*/
console.log(String.fromCharCode(104,101,108,108,111));
//hello
</script>
</body>
</html>
<!DOCTYPE html>
<html lang=
"en"
>
<head>
<meta charset=
"utf-8"
>
<title>字符串匹配</title>
</head>
<body>
<script type=
"text/javascript"
>
/*找到匹配字符串所在的各个位置*/
var
str=
"asadajhjkadaaasdasdasdasd"
;
var
position=[];
var
pos=str.indexOf(
"d"
);
while
(pos>-1){
position.push(pos);
pos=str.indexOf(
"d"
,pos+1);
}
console.log(position);
//[3, 10, 15, 18, 21, 24]
</script>
</body>
</html>
<!DOCTYPE html>
<html lang=
"en"
>
<head>
<meta charset=
"utf-8"
>
<title>字符串去重</title>
</head>
<body>
<script type=
"text/javascript"
>
//String.split() 执行的操作与 Array.join 执行的操作是相反的
//split() 方法用于把一个字符串分割成字符串数组。
//join方法用于将字符串数组连接成一个字符串
//如果把空字符串 ("") 用作 separator,那么 stringObject 中的每个字符之间都会被分割。
var
str=
"aahhgggsssjjj"
;
//这里字符串没有可以分隔的字符,所以需要使用空字符串作为分隔符
function
unique(msg){
var
res=[];
var
arr=msg.split(
""
);
//console.log(arr);
for
(
var
i=0;i<arr.length;i++){
if
(res.indexOf(arr[i])==-1){
res.push(arr[i]);
}
}
return
res.join(
""
);
}
console.log(unique(str));
//ahgsj
</script>
</body>
</html>
<!DOCTYPE html>
<html lang=
"en"
>
<head>
<meta charset=
"utf-8"
>
<title>字符串操作</title>
</head>
<body>
<script type=
"text/javascript"
>
/*
1.先实现字符串去重
2.然后对去重后的数组用for循环操作,分别与原始数组中各个值进行比较,如果相等则count++,循环结束将count保存在sum数组中,然后将count重置为0
3.这样一来去重后的数组中的元素在原数组中出现的次数与sum数组中的元素是一一对应的
*/
var
str=
"aacccbbeeeddd"
;
var
sum=[];
var
res=[];
var
count=0;
var
arr=str.split(
""
);
for
(
var
i=0;i<arr.length;i++){
if
(res.indexOf(arr[i])==-1){
res.push(arr[i]);
}
}
for
(
var
i=0;i<res.length;i++){
for
(
var
j=0;j<arr.length;j++){
if
(arr[j]==res[i]){
count++;
}
}
sum.push(count);
count=0;
}
console.log(res);
//["a", "c", "b", "e", "d"]
for
(
var
i=0;i<res.length;i++){
var
str=(sum[i]%2==0)?
"偶数"
:
"奇数"
;
console.log(res[i]+
"出现了"
+sum[i]+
"次"
);
console.log(res[i]+
"出现了"
+str+
"次"
);
}
</script>
</body>
</html>
<script type=
"text/javascript"
>
var
str =
"www.taobao.com"
;
var
res = str.split(
""
).reverse().join(
""
).replace(
'oat'
,
''
);
console.log(res);
//moc.oab.www
</script>
js字符串操作总结(必看篇)的更多相关文章
- 利用JS提交表单的几种方法和验证(必看篇)
第一种方式:表单提交,在form标签中增加onsubmit事件来判断表单提交是否成功 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 <scr ...
- 基于StringUtils工具类的常用方法介绍(必看篇)
前言:工作中看到项目组里的大牛写代码大量的用到了StringUtils工具类来做字符串的操作,便学习整理了一下,方便查阅. isEmpty(String str) 是否为空,空格字符为false is ...
- 浅谈 js 字符串 trim 方法之正则篇
原文:浅谈 js 字符串 trim 方法之正则篇 关于 trim 其实没啥好说的,无非就是去除首位空格,对于现代浏览器来说只是简单的正则 /^\s+|\s+$/ 就可以搞定了.而且支持中文空格 等 ...
- (转载)Android之有效防止按钮多次重复点击的方法(必看篇)
为了防止测试妹子或者用户频繁点击某个按钮,导致程序在短时间内进行多次数据提交or数据处理,那到时候就比较坑了~ 那么如何有效避免这种情况的发生呢? 我的想法是,判断用户点击按钮间隔时间,如果间隔时间太 ...
- js 字符串操作函数有哪些
js 字符串操作函数有哪些 一.总结 一句话总结:js字符串函数都是字符串对象的方法,是通过调用字符串方法的方式调用,和java,php里面不一样. 1.字符串替换函数怎么用? 这里的正则表示是加双引 ...
- js字符串操作
javascript中字符串常用操作总结.JS字符串操作大全 String对象属性 (1) length属性 length算是字符串中非常常用的一个属性了,它的功能是获取字符串的长度.当然需要注意的是 ...
- 页面循环绑定(变量污染问题),js面向对象编程(对象属性增删改查),js字符串操作,js数组操作
页面循环绑定(变量污染问题) var lis = document.querySelectorAll(".ul li") for ( var i = 0 ; i < lis. ...
- 模块化 require.js 入门教学(前端必看系列)
在工作的时候总是会用到模块化开发,那接下来我就顺着这个问题来说一下什么是模块化 前端模块化 !!! JS 模块化提供给我们三种规范 分别就是 No.1 commonjs 这个其实也就代表了node. ...
- js字符串操作总结
字符方法 <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf- ...
随机推荐
- go语言设计模式之bridge
著名的桥接模式罗.. bridge.go package bridge import ( "errors" "fmt" "io" ) typ ...
- 【hdu4045】Machine scheduling(dp+第二类斯特林数)
传送门 题意: 从\(n\)个人中选\(r\)个出来,但每两个人的标号不能少于\(k\). 再将\(r\)个人分为不超过\(m\)个集合. 问有多少种方案. 思路: 直接\(dp\)预处理出从\(n\ ...
- AcWing 13. 找出数组中重复的数字
习题地址 https://www.acwing.com/solution/acwing/content/2919/. 题目描述给定一个长度为 n 的整数数组 nums,数组中所有的数字都在 0∼n−1 ...
- NOIP 2016 玩具谜题
洛谷 P1563 玩具谜题 洛谷传送门 JDOJ 3136: [NOIP2016]玩具谜题 D1 T1 JDOJ传送门 Description 小南有一套可爱的玩具小人, 它们各有不同的职业. 有一天 ...
- 创建windows服务方法
将exe程序创建windows服务 sc create TestService binpath= "c:/in estapp.exe" displayname= "Tes ...
- 阿里小哥带你玩转JVM:揭秘try-catch-finally在JVM底层都干了些啥?
让我们准备一个函数: 然后,反编译他的字节码: 首先我们介绍异常表:在编译生成的字节码中,每个方法都附带一个异常表. 异常表中的每一个条目代表一个异常处理器,并且由 from 指针.to 指针 ...
- 如何使用pm2一键部署node应用
准备工作 准备一台linux服务器(本文档以阿里centos为例) 安装nodejs.git.pm2等环境 项目代码 本地已经安装用于连接 Linux 实例的工具,如 Xshell 基本流程 前两步传 ...
- 借助Git实现本地与GitHub远程双向传输(同步GitHub仓库)以及一些使用错误解决
前言 GitHub作为程序员必备的学习交流平台,虽然在国内速度不算快,但只要好好利用这个平台,我相信还是可以学习到很多东西.在暑期的时候,我曾经就初次远程连接到了GitHub,但开学后,不知道为什么又 ...
- ElasticSearch安装中文分词器IK
1.安装IK分词器,下载对应版本的插件,elasticsearch-analysis-ik中文分词器的开发者一直进行维护的,对应着elasticsearch的版本,所以选择好自己的版本即可.IKAna ...
- XML的互相序列化对象
using System.Xml.Serialization; using System.IO; using System.Xml; namespace Common { public class X ...