字符方法

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <title>字符方法</title>
  6. </head>
  7. <body>
  8. <script type="text/javascript">
  9. /*
  10. charAt方法和charCodeAt方法都接收一个参数，基于0的字符位置
  11. charAt方法是以单字符字符串的形式返回给定位置的那个字符
  12. charCodeAt方法获取到的不是字符而是字符编码
  13. */
  14. var str="hello world";
  15. console.log(str.charAt(1));//e
  16. console.log(str.charCodeAt(1));//101
  17. //还可以使用方括号加数字索引来访问字符串中特定的字符
  18. console.log(str[1]);//e
  19. </script>
  20. </body>
  21. </html>

字符串操作方法

concat方法

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <title>concat方法</title>
  6. </head>
  7. <body>
  8. <script type="text/javascript">
  9. var str="hello ";
  10. var res=str.concat("world");
  11. console.log(res);//hello world
  12. console.log(str);//hello    这说明原来字符串的值没有改变
  13. var res1=str.concat("nihao","!");
  14. console.log(res1);//hello nihao!   说明concat方法可以接收任意多个参数
  15. //虽然concat方法是专门用来拼接字符串的，但是实践中我们使用最多的还是加操作符+，因为其简易便行
  16. </script>
  17. </body>
  18. </html>

slice方法、substring方法、substr方法

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <title>字符串操作方法</title>
  6. </head>
  7. <body>
  8. <script type="text/javascript">
  9. /*
  10. slice方法：第一个参数指定子字符串开始位置，第二个参数表示子字符串最后一个字符后面的位置
  11. substring方法：第一个参数指定子字符串开始位置，第二个参数表示子字符串最后一个字符后面的位置
  12. substr方法：第一个参数指定子字符串开始位置，第二个参数表示返回的字符个数
  13. 这三个方法都会返回被操作字符串的一个子字符串，都接收一或两个参数
  14. 如果没有给这些方法传递第二个参数，则将字符串的长度作为结束位置。这些方法也不会修改字符串本身，只是返回一个基本类型的字符串值
  15. */
  16. var str="hello world";
  17. console.log(str.slice(3));//lo world
  18. console.log(str.substring(3));//lo world
  19. console.log(str.substr(3));//lo world
  20. console.log(str.slice(3,7));//lo w    7表示子字符串最后一个字符后面的位置   简单理解就是包含头不包含尾
  21. console.log(str.substring(3,7));//lo w
  22. console.log(str.substr(3,7));//lo worl  7表示返回7个字符
  23. console.log(str.slice(3,-4));//lo w    -4+11=7表示子字符串最后一个字符后面的位置   简单理解就是包含头不包含尾
  24. console.log(str.substring(3,-4));//hel   会转换为console.log(str.substring(3,0));
  25. //此外由于这个方法会将较小数作为开始位置，较大数作为结束位置，所以相当于调用console.log(str.substring(0,3));
  26. console.log(str.substr(3,-4));//""空字符串
  27. console.log(str.substring(3,0));
  28. </script>
  29. </body>
  30. </html>

字符串位置方法

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <title>字符串位置方法</title>
  6. </head>
  7. <body>
  8. <script type="text/javascript">
  9. /*
  10. indexOf方法和lastIndexOf方法都是从一个字符串中搜索给定的子字符串，然后返回子字符串的位置，如果没有找到，则返回-1
  11. indexOf方法是从字符串的开头向后搜索子字符串，lastIndexOf方法正好相反
  12. 这两个方法都可以接收两个参数：要查找的子字符串和查找的位置
  13. */
  14. var str="hello world";
  15. console.log(str.indexOf("o"));//4
  16. console.log(str.lastIndexOf("o"));//7
  17. console.log(str.indexOf("o",6));//7
  18. console.log(str.lastIndexOf("o",6));//4
  19. </script>
  20. </body>
  21. </html>

trim方法

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <title>trim方法</title>
  6. </head>
  7. <body>
  8. <script type="text/javascript">
  9. /*
  10. trim方法用来删除字符串前后的空格
  11. */
  12. var str="     hello world      ";
  13. console.log('('+str.trim()+')');//(hello world)
  14. console.log('('+str+')');//(     hello world      )
  15. </script>
  16. </body>
  17. </html>

字符串大小写转换方法

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <title>大小写转换</title>
  6. </head>
  7. <body>
  8. <script type="text/javascript">
  9. var str="HELLO world";
  10. console.log(str.toLowerCase());//hello world
  11. console.log(str.toUpperCase());//HELLO WORLD
  12. </script>
  13. </body>
  14. </html>

字符串模式匹配方法

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <title>字符串模式匹配</title>
  6. </head>
  7. <body>
  8. <script type="text/javascript">
  9. /*
  10. match方法：只接受一个参数，由字符串或RegExp对象指定的一个正则表达式
  11. search方法：只接受一个参数，由字符串或RegExp对象指定的一个正则表达式
  12. search方法返回字符串中第一个匹配项的索引，如果没有匹配项，返回-1
  13. */
  14. var str="cat,bat,sat,fat";
  15. var pattern=/.at/;
  16. var matches=str.match(pattern);
  17. console.log(matches.index);//0
  18. console.log(matches[0]);//cat
  19. console.log(pattern.lastIndex);//0
  20. //lastIndex表示开始搜索下一个匹配项的字符位置，从0算起
  21. var pos=str.search(/at/);
  22. console.log(pos);//1  1表示at字符串在原来字符串中第一次出现的位置
  23. </script>
  24. </body>
  25. </html>

replace方法

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <title>replace方法</title>
  6. </head>
  7. <body>
  8. <script type="text/javascript">
  9. var str="cat,bat,sat,fat";
  10. var res=str.replace("at","one");//第一个参数是字符串，所以只会替换第一个子字符串
  11. console.log(res);//cone,bat,sat,fat
  12. var res1=str.replace(/at/g,"one");//第一个参数是正则表达式，所以会替换所有的子字符串
  13. console.log(res1);//cone,bone,sone,fone
  14. </script>
  15. </body>
  16. </html>

split方法

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <title>split方法</title>
  6. </head>
  7. <body>
  8. <script type="text/javascript">
  9. /*
  10. split方法是基于指定的字符，将字符串分割成字符串数组
  11. 当指定的字符为空字符串时，将会分隔整个字符串
  12. */
  13. var str="red,blue,green,yellow";
  14. console.log(str.split(","));//["red", "blue", "green", "yellow"]
  15. console.log(str.split(",",2));//["red", "blue"]   第二个参数用来限制数组大小
  16. console.log(str.split(/[^\,]+/));// ["", ",", ",", ",", ""]
  17. //第一项和最后一项为空字符串是因为正则表达式指定的分隔符出现在了子字符串的开头，即"red"和"yellow"
  18. //[^...]  不在方括号内的任意字符    只要不是逗号都是分隔符
  19. </script>
  20. </body>
  21. </html>

localeCompare方法

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <title>localeCompare方法</title>
  6. </head>
  7. <body>
  8. <script type="text/javascript">
  9. /*
  10. 这个方法用于比较两个字符串
  11. 1.如果字符串在字母表中应该排在字符串参数之前，则返回一个负数
  12. 1.如果字符串等于字符串参数，则返回0
  13. 1.如果字符串在字母表中应该排在字符串参数之后，则返回一个正数
  14. */
  15. var str="yellow";
  16. console.log(str.localeCompare("brick"));//1
  17. console.log(str.localeCompare("yellow"));//0
  18. console.log(str.localeCompare("zoo"));//-1
  19. </script>
  20. </body>
  21. </html>

fromCharCode方法

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <title>fromCharCode方法</title>
  6. </head>
  7. <body>
  8. <script type="text/javascript">
  9. /*
  10. fromCharCode方法是接收一或多个字符编码，然后将其转换为字符串
  11. fromCharCode方法是String构造函数的一个静态方法
  12. */
  13. console.log(String.fromCharCode(104,101,108,108,111));//hello
  14. </script>
  15. </body>
  16. </html>

找到匹配字符串所在的各个位置

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <title>字符串匹配</title>
  6. </head>
  7. <body>
  8. <script type="text/javascript">
  9. /*找到匹配字符串所在的各个位置*/
  10. var str="asadajhjkadaaasdasdasdasd";
  11. var position=[];
  12. var pos=str.indexOf("d");
  13. while(pos>-1){
  14. position.push(pos);
  15. pos=str.indexOf("d",pos+1);
  16. }
  17. console.log(position);//[3, 10, 15, 18, 21, 24]
  18. </script>
  19. </body>
  20. </html>

字符串去重

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <title>字符串去重</title>
  6. </head>
  7. <body>
  8. <script type="text/javascript">
  9. //String.split() 执行的操作与 Array.join 执行的操作是相反的
  10. //split() 方法用于把一个字符串分割成字符串数组。
  11. //join方法用于将字符串数组连接成一个字符串
  12. //如果把空字符串 ("") 用作 separator，那么 stringObject 中的每个字符之间都会被分割。
  13. var str="aahhgggsssjjj";//这里字符串没有可以分隔的字符，所以需要使用空字符串作为分隔符
  14. function unique(msg){
  15. var res=[];
  16. var arr=msg.split("");
  17. //console.log(arr);
  18. for(var i=0;i<arr.length;i++){
  19. if(res.indexOf(arr[i])==-1){
  20. res.push(arr[i]);
  21. }
  22. }
  23. return res.join("");
  24. }
  25. console.log(unique(str));//ahgsj
  26. </script>
  27. </body>
  28. </html>

判断字符串中字符出现的次数

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <title>字符串操作</title>
  6. </head>
  7. <body>
  8. <script type="text/javascript">
  9. /*
  10. 1.先实现字符串去重
  11. 2.然后对去重后的数组用for循环操作，分别与原始数组中各个值进行比较，如果相等则count++,循环结束将count保存在sum数组中，然后将count重置为0
  12. 3.这样一来去重后的数组中的元素在原数组中出现的次数与sum数组中的元素是一一对应的
  13. */
  14. var str="aacccbbeeeddd";
  15. var sum=[];
  16. var res=[];
  17. var count=0;
  18. var arr=str.split("");
  19. for(var i=0;i<arr.length;i++){
  20. if(res.indexOf(arr[i])==-1){
  21. res.push(arr[i]);
  22. }
  23. }
  24. for(var i=0;i<res.length;i++){
  25. for(var j=0;j<arr.length;j++){
  26. if(arr[j]==res[i]){
  27. count++;
  28. }
  29. }
  30. sum.push(count);
  31. count=0;
  32. }
  33. console.log(res);//["a", "c", "b", "e", "d"]
  34. for(var i=0;i<res.length;i++){
  35. var str=(sum[i]%2==0)?"偶数":"奇数";
  36. console.log(res[i]+"出现了"+sum[i]+"次");
  37. console.log(res[i]+"出现了"+str+"次");
  38. }
  39. </script>
  40. </body>
  41. </html>

阿里面试-字符串操作

    1. <script type="text/javascript">
    2. var str = "www.taobao.com";
    3. var res = str.split("").reverse().join("").replace('oat','');
    4. console.log(res);//moc.oab.www
    5. </script>

js字符串操作总结的更多相关文章

  1. js字符串操作

    javascript中字符串常用操作总结.JS字符串操作大全 String对象属性 (1) length属性 length算是字符串中非常常用的一个属性了,它的功能是获取字符串的长度.当然需要注意的是 ...

  2. 页面循环绑定（变量污染问题），js面向对象编程（对象属性增删改查），js字符串操作，js数组操作

    页面循环绑定(变量污染问题) var lis = document.querySelectorAll(".ul li") for ( var i = 0 ; i < lis. ...

  3. js 字符串操作函数有哪些

    js 字符串操作函数有哪些 一.总结 一句话总结:js字符串函数都是字符串对象的方法,是通过调用字符串方法的方式调用,和java,php里面不一样. 1.字符串替换函数怎么用? 这里的正则表示是加双引 ...

  4. js字符串操作函数

    js字符串函数 JS自带函数 concat 将两个或多个字符的文本组合起来,返回一个新的字符串. var a = "hello"; var b = ",world&quo ...

  5. js字符串操作总结(必看篇)

    本文链接: https://www.jb51.net/article/97915.htm 字符方法 <!DOCTYPE html> <html lang="en" ...

  6. javascript中字符串常用操作总结、JS字符串操作大全

    字符串的操作在js中非常频繁,也非常重要.以往看完书之后都能记得非常清楚,但稍微隔一段时间不用,便会忘得差不多,记性不好是硬伤啊...今天就对字符串的一些常用操作做个整理,一者加深印象,二者方便今后温 ...

  7. JS字符串操作大全

    String对象属性 (1) length属性 length算是字符串中非常常用的一个属性了,它的功能是获取字符串的长度.当然需要注意的是js中的中文每个汉字也只代表一个字符,这里可能跟其他语言有些不 ...

  8. js--javascript中字符串常用操作总结、JS字符串操作大全

    字符串的操作在js中非常频繁,也非常重要.以往看完书之后都能记得非常清楚,但稍微隔一段时间不用,便会忘得差不多,记性不好是硬伤啊...今天就对字符串的一些常用操作做个整理,一者加深印象,二者方便今后温 ...

  9. js 字符串操作函数

    concat() – 将两个或多个字符的文本组合起来,返回一个新的字符串. indexOf() – 返回字符串中一个子串第一处出现的索引.如果没有匹配项,返回 -1 . charAt() – 返回指定 ...

随机推荐

  1. Fiddler修改请求和响应

    通过设置断点,Fiddler可以做到: 1. 修改HTTP请求头信息.例如修改请求头的UA, Cookie, Referer 信息,通过"伪造"相应信息达到达到相应的目的(调试,模 ...

  2. java基础笔记（2）----流程控制

    java流程控制结构包括顺序结构,分支结构,循环结构. 顺序结构: 程序从上到下依次执行,中间没有任何判断和跳转. 代码如下: package com.lvsling.test; public cla ...

  3. ASP.NET没有魔法——ASP.NET MVC Razor与View渲染

    对于Web应用来说,它的界面是由浏览器根据HTML代码及其引用的相关资源进行渲染后展示给用户的结果,换句话说Web应用的界面呈现工作是由浏览器完成的,Web应用的原理是通过Http协议从服务器上获取到 ...

  4. 十个 PHP 开发者最容易犯的错误

    PHP 语言让 WEB 端程序设计变得简单,这也是它能流行起来的原因.但也是因为它的简单,PHP 也慢慢发展成一个相对复杂的语言,层出不穷的框架,各种语言特性和版本差异都时常让搞的我们头大,不得不浪费 ...

  5. 使用linux下的crontab定时任务跑定时脚本

    使用linux下的crontab定时任务跑定时脚本 tags:定时任务 定时脚本 crontab linux定时脚本 linux 引言:应该有许多人曾经很好奇一些定时脚本是怎么做出来的.我们这次就来说 ...

  6. 使用jmeter+ant进行接口自动化测试(数据驱动)之二：利用apache-ant执行测试用例并生成HTML格式测试报告

    在 使用jmeter+ant进行接口自动化测试(数据驱动)之一 介绍了如何使用csv文件来批量管理接口 本次接着介绍如何利用apache-ant执行测试用例并生成HTML格式测试报告 ①下载安装 ap ...

  7. C语言第三次博客作业

    一.PTA实验作业 1 1.实验代码 int i,N; char sex; float high; scanf("%d",&N); for(i =1;i <=N;i ...

  8. Alpha冲刺Day3

    Alpha冲刺Day3 一:站立式会议 今日安排: 我们把项目大体分为四个模块:数据管理员.企业人员.第三方机构.政府人员.数据管理员这一模块,数据管理员又可细分为两个模块:基础数据管理和风险信息管理 ...

  9. 201421123042 《Java程序设计》第12周

    1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结多流与文件相关内容. 2. 面向系统综合设计-图书馆管理系统或购物车 使用流与文件改造你的图书馆管理系统或购物车. 2.1 简述如何 ...

  10. Xen Server虚拟机数据恢复的方法和数据恢复过程

    在服务器运行过程中如果出现意外情况突然断电很容易引起服务器故障,服务器中的硬件设备损坏可以修复或者购买,但是服务器中的数据一旦发生故障丢失,对于企业来说将是不可估量的损失.那么服务器数据一旦丢失就除了 ...