js字符串操作大全

内容导读

互联网集市收集整理的这篇技术教程文章主要介绍了js字符串操作大全，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含8794字，纯文字阅读大概需要13分钟。

内容图文

这次给大家带来js字符串操作大全，js字符串操作的注意事项有哪些，下面就是实战案例，一起来看一下。

字符方法

<!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>

slice方法、substring方法、substr方法

<!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>

trim方法

<!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>

replace方法

<!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>

split方法

<!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>

localeCompare方法

<!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>

fromCharCode方法

<!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>

相信看了本文案例你已经掌握了方法，更多精彩请关注Gxl网其它相关文章！

内容总结

以上是互联网集市为您收集整理的js字符串操作大全全部内容，希望文章能够帮你解决js字符串操作大全所遇到的程序开发问题。如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。

内容备注

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容，请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。

内容手机端

扫描二维码推送至手机访问。

本文链接：https://qyyshop.com/info/291713.html

来源：【匿名】

【上一篇】JS中时间单位比较的方法【下一篇】javascript 怎么调用php方法

更多 ►

【js字符串操作大全】教程文章相关的互联网学习教程文章

1、字符串的作用　　JavaScript 字符串用于存储和处理文本。2、类型　　1）、字符串可以存储一系列字符，如 "John Doe"。　　字符串可以是插入到引号中的任何字符。你可以使用单引号或双引号：　　var carname = "Volvo XC60";　　2）你可以使用索引位置来访问字符串中的每个字符：　　var character = carname[7];　　3）、字符串的索引从 0 开始，这意味着第一个字符索引值为 [0],第二个为 [1], 以此类推。　　你可以在字符串中使...

JavaScript 字符串转数字（整数，浮点数，进制转换）【代码】

下面是使用parseFloat()方法的示例： parseFloat("1234blue"); //returns 1234.0 parseFloat("0xA"); //returns NaN parseFloat("22.5"); //returns 22.5 parseFloat("22.34.5"); //returns 22.34 parseFloat("0908"); //returns 908 parseFloat("blue"); //returns NaNparseInt进行转换时，将字符串转成相应的整数。浮点数以后的数字都不要了。 parseInt("1234blue"); //returns 1234 parseInt("22.5"); //...

javascript 字符串数字反转字母大小写互换【代码】

// 符串abcd123ABCD456 怎么转换为 ABCD321abcd654 // 数字要倒序小写转大写, 大写转小写 Array.prototype.reverse = function() {var tmp;for (var i = 0, j = this.length - 1; i < j; i++, j--) {tmp = this[i];this[i] = this[j];this[j] = tmp;}return this; };function foo(s) {var code, a = [],b, last = 0; // 0 1:alpha 2:numfor (var i = 0; i < s.length; i++) {code = s.charCodeAt(i);if ((97 <= code && code <=...

javascript利用正则快速找出两个字符串的不同字符

//by 夏天以南 /**/[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]原文：http://www.jb51.net/article/13237.htm

JavaScript学习笔记（五）——类型、转换、相等、字符串【代码】

第六章类型相等转换等一、类型1 typeof();typeof是一个内置的JavaScript运算符，可用于探测其操作数的类型。例： 1 <script language="JavaScript" type="text/JavaScript">2 3var test1="abcdef"; //string 4 5var test2=123; //number 6 7var test3=true; //boolean 8 9var test4={...

javascript中split字符串分割函数【代码】

1、var ss=s.split("fs"); for(var i=0;i<ss.length;i++){ 处理每一个ss[i]; }2、"2:3:4:5".split(":") //将返回["2", "3", "4", "5"] "|a|b|c".split("|") //将返回["", "a", "b", "c"]3、<script type="text/javascript"> var str = "一二三四"; var str1 = "篮球、排球、乒乓球"; var arr = str.split("");//全部分割 var arr1 = str1.split("、");//按照顿号分割 var arr2 = str1.split("、",2);//按照顿号分割,保留两段 </...

JavaScript - 函数、对象、事件、字符串（三）【代码】

JS 函数JS 函数是被设计为执行特定任务的代码块JS 函数会在某代码调用它时被执行JS 函数语法JS 函数通过 function 关键词进行定义，其后是函数名和括号()函数名可包含字母、数字、下划线、美元符号（规则与变量名相同）括号内是参数列表，多个参数之间使用逗号分隔：(参数1，参数2，参数3...)由函数执行的代码被放置在花括号中：{...}function functionName(var1,var2,var3,...){//执行代码//return ... } JS 函数调用当事件发生时...

JavaScript 优雅简单的拼接字符串【代码】

前言最近维护一个老系统，里面有大量js拼接字符串的代码，这里总计一下js拼接字符串JS 原生字符串拼接JavaScript里面的字符串可以直接用 + 来拼接return "<a style=‘text-decoration:underline‘ onClick=‘" + valsAr[1] + " return false;" + "‘ data-rowId=‘" + row_id + "‘ href=‘javascript:;‘ title=‘" + valsAr[0] + "‘>" + valsAr[0] + "</a> "; 以上就是拼接一个带js事件的a标签，可以看出来里面混合了单引号和双...

简单的js数字字符串混合排序方法【代码】【图】

最终效果：实现方法：// 使用js中Array类型的原生方法sort与String类型的原生方法localeCompare实现afterSortDataList = beforeSortDataList.sort(function (a, b) {return a.name.localeCompare(b.name, ‘zh-CN‘, { numeric: true });}) 关于localeCompare方法的详细使用方式，可以前往下面的地址查阅https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/String/localeCompare原文：https://ww...

JavaScript数组和字符串的方法【代码】

数组的所有方法join():数组转字符串(原数组不会发生改变)let arr = ['a','b','c'] let newArr = arr.join('')//参数可以是空格逗号连字符等 console.log(newArr)//abc console.log(arr)//['a','b','c']push():向数组的末尾添加一个或多个元素，并返回新的长度(原数组发生改变)let arr = [1,2,3] arr.push(4) console.log(arr)//[1,2,3,4]pop():删除数组的最后一个元素(原数组发生改变)let arr = ['a','b','c'] arr.pop() console...

[Javascript] 如何自定义字符串格式化输出【代码】

在其他语言中十分常见的字符串格式化输出，居然在 Javascript 中不见踪影，于是决定自己实现该方法，以下就是个人编写的最简洁实现：String.prototype.format = function(){var args = arguments;returnthis.replace(/\{(\d+)\}/gm, function(ms, p1){returntypeof(args[p1]) == ‘undefined‘ ? ms : args[p1]}); } 应用示例：>>> "{0} is not {1}".format("Linux", "Unix") "Linux is not Unix" 原文：http://www.cnblogs.com/if...

javascript中字符串格式json如何转化成json对象【代码】

什么是JSONJSON(JavaScript Object Notation)是一种优美的JavaScript对象创建方法。JSON也是一种轻量级数据交换格式。JSON非常易于人阅读与编写，同时利于机器解析与生成。JSON是在AJAX中代替XML交换数据的更佳方案。JSON格式与语法var jsonobject={ //对象内的属性语法(属性名与属性值是成对出现的) propertyname:value, //对象内的函数语法(函数名与函数内容是成对出现的) functionname:function(){...

js正则表达式校验输入字符串是否是手机号码【代码】【图】

js 如何校验手机号码呢?手机号有如下规则:(1)必须全为数字;(2)必须是11位.(有人说还有10位的手机号,这里先不考虑);(3)必须以1开头(有人见过以2开头的手机号吗?)(4)第2位是34578中的一个.js方法如下:/**** check mobile phone:(1)must be digit;(2)must be 11* @param string* @returns {boolean}*/ telRuleCheck2 = function (string) {var pattern = /^1[34578]\d{9}$/;if (pattern.test(string)) {return true;}console.log(‘ch...

js中字符串的替换

定义和用法replace() 方法用于在字符串中用一些字符替换另一些字符，或替换一个与正则表达式匹配的子串。语法stringObject.replace(regexp/substr,replacement)参数描述 regexp/substr 必需。规定子字符串或要替换的模式的 RegExp 对象。请注意，如果该值是一个字符串，则将它作为要检索的直接量文本模式，而不是首先被转换为 RegExp 对象。 replacement 必需。一个字符串值。规定了替换文本或生成替换文本的函数。返回值一个新的...

JS字符串截取 “指定字符” 前面和后面的内容！【代码】

JS字符串截取 “指定字符” 前面和后面的内容！var string= "07/12" var before = string.split(‘/‘)[0] var after = string.split(‘/‘)[1] console.log(before,after) // 07 12 原文：https://www.cnblogs.com/silent007/p/9306464.html

首页 / JAVASCRIPT / js字符串操作大全

js字符串操作大全

内容导读

内容图文

内容总结

内容备注

内容手机端

【js字符串操作大全】教程文章相关的互联网学习教程文章

7-JavaScript 字符串

JavaScript 字符串转数字（整数，浮点数，进制转换）【代码】

javascript 字符串数字反转字母大小写互换【代码】

javascript利用正则快速找出两个字符串的不同字符

JavaScript学习笔记（五）——类型、转换、相等、字符串【代码】

javascript中split字符串分割函数【代码】

JavaScript - 函数、对象、事件、字符串（三）【代码】

JavaScript 优雅简单的拼接字符串【代码】

简单的js数字字符串混合排序方法【代码】【图】

JavaScript数组和字符串的方法【代码】

[Javascript] 如何自定义字符串格式化输出【代码】

javascript中字符串格式json如何转化成json对象【代码】

js正则表达式校验输入字符串是否是手机号码【代码】【图】

js中字符串的替换

JS字符串截取 “指定字符” 前面和后面的内容！【代码】

字符串 - 相关标签

JAVASCRIPT - 技术教程分类

JAVASCRIPT - 最新教程

JAVASCRIPT - 最热教程