JavaScript 中的字符串

于 2023-01-30 16:11:26 发布
阅读量434 收藏
点赞数
分类专栏： 前端JavaScript 文章标签： javascript 前端 字符串
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/html_z/article/details/128804458
版权

JavaScript 字符串

什么是字符串？

  • 字符串是用来存储和处理文本数据的
    • 比如：'一句话'、'a'等

字符串的创建方式

  • 字面量方式进行创建

    <!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body></body>
  <script>
    // 字面量创建方式
    // 双引号包含
    var a = "123";
    var b = "false";
    console.log(typeof a);
    console.log(typeof b);
  </script>
</html>

    在这里插入图片描述

  • 通过new String的方式进行创建

    <!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body></body>
  <script>
    // 通过 new String 的方式创建
    var a = new String("123");
    console.log(typeof a); // 对象
  </script>
</html>

    在这里插入图片描述

字符串的长度 length

  • 返回字符串的长度

    <!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body></body>
  <script>
    var a = "hello world";
    console.log(a.length); // 11
  </script>
</html>

字符串的方法

  • charAt返回指定位置上的内容，开始位置也是 0

    <!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body></body>
  <script>
    var a = "hello world";
    var b = a.charAt(4);
    console.log(b); // o 返回第一个o
  </script>
</html>

  • charCodeAt返回指定位置上的 Unicode 值

    <!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body></body>
  <script>
    var a = "hello world";
    var b = a.charCodeAt(1);  // e
    // 返回字符串的 Unicode 值
    console.log(b); // 101 
  </script>
</html>

  • concant连接两个或多个字符串

    <!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body></body>
  <script>
    var a = "hello world";
    var b = "你";
    var c = a.concat(b, "好！");
    console.log(c); // hello world你好！
  </script>
</html>

  • fromCharCode将 Unicode 转换为字符串

    <!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body></body>
  <script>
    var a = String.fromCharCode(101);
    console.log(a); // e
  </script>
</html>

  • indexOf返回指定字符在字符串中出现的位置，找不到返回-1

  • lastIndexOf返回指定字符在字符串中最后一次出现的位置，找不到返回-1

    <!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body></body>
  <script>
    var a = "hello world";
    
    var b = a.indexOf("o");
    console.log(b); // 4

    var c = a.lastIndexOf("l");
    console.log(c); // 9
  </script>
</html>

  • localeCompare用本地特定的方式比较两个字符串的顺序，相同返回0，不同返回-1

    <!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body></body>
  <script>
    var a = "hello";
    var b = "hello";
    var c = "world";
    console.log(a.localeCompare(b)); // 0
    console.log(a.localeCompare(c)); // -1
  </script>
</html>

  • replace找到指定字符，并替换

    <!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body></body>
  <script>
    // 找到指定的字符并进行替换
    var a = "hello world";

    var b = a.replace("hello", "");

    console.log(a); // hello world
    console.log(b); //  world
    console.log(b.length); // 6
    // 注意 world 前面的空格还在
  </script>
</html>

  • search检索与正则表达式相匹配的值，能够检索到是0，检索不到为-1

    <!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body></body>
  <script>
    var a = "hello world";

    console.log(a.search("hello")); //0
    console.log(a.search("hellox")); // -1
  </script>
</html>

  • slice

    <!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body></body>
  <script>
    var a = "hello";

    // slice 第一个参数是开始的字符，第二个参数是剪切的个数（个数不是索引值）
    console.log(a.slice("h", 2)); // he
  </script>
</html>

  • split以指定的方式将字符串进行切割，并且返回数组

    <!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body></body>
  <script>
    var a = "hello world";
    var c = "admin@13456";
    var b = a.split(" ");
    var x = c.split("@");

    console.log(b); // ['hello', 'world']
    console.log(x); // ['admin', '13456']
  </script>
</html>
BloggerM
关注
专栏目录
JavaScript中字符串的replace用法
人无远虑,必有近忧.
11-17 3669
1. 两种替换方法 1.1 replace(param_old, param_new) 用param_new去替换param_old 如下例子： var str_format = "yyyy-MM-dd-hh-mm-ss"; //比如要用“”来替换“-” var str_new = str_format.replace("-", ""); console.log(str_new ); /** 输出结果： yyyyMM-dd-hh-mm-ss **/ //很明显这不是我们想要的 这种单纯非格式的替换必须使用
JavaScript中字符串与数字间的运算
Potry Code的博客
08-09 5624
JavaScript中字符串与数字间的运算分三种情况 第一种：字符串+数字 "12"+34="1234"; 带双引号的为字符串，如果和一个数字相加，那么它的结果为字符串。除非两个数字都不带双引号，则才可以实现两个数字的相加。 12+34=46; 第二种：第一个（无论是字串还是数字）前面有符号： +"12"+34=46; 因为"12"前面有+号（或者叫连字符），+号前面没有别的东西了，所以就判...
Javascript中字符串去重的方法总结
weixin_43263355的博客
09-28 9286
概要 在现实应用中，我们常常需要从页面抓取出一些数据进行二次处理。在抓取出来的数据中，常常包含大量的重复数据，需要去掉重复数据。 本文介绍几种方式来去掉字符串中的重复内容。 解决方案 解决方案 解决方案1，基于ES6的新特新， 例如Set，展开运算符等。 现在要去掉字符串***aaabbbcccddd***的重复项。代码如下： var str = [... new Set("aaabbbcccddd")].join("") 运行结果是： abcd 该方法主要是通过将字符串转为Set，而Set这种数据结构不
JavaScript中字符串比较大小
热门推荐
不忘初心，方得始终
04-19 4万+
一. 大于(&gt;), 小于(&lt;)运算符javascript字符串在进行大于(小于)比较时，会根据第一个不同的字符的ascii值码进行比较，当数字(number)与字符串(string)进行比较大小时，会强制的将数字(number)转换成字符串(string)然后再进行比较(function(){ console.log('13'&gt;'3'); // 输出：false ...
JavaScript中字符串去掉特殊字符和转义字符
qq_44910471的博客
04-13 6455
JavaScript中字符串去掉特殊字符和转义字符
JavaScript中字符串运算符的使用
JAVA编程词(Java)
12-21 3069
字符串运算符是用于两个字符串型数据之间的运算符，它的作用是将两个字符串连接起来。在JavaScript中，可以使用+和+=运算符对两个字符串进行连接运算。其中，+运算符用于连接两个字符串，而+=运算符则连接两个字符串，并将结果赋给第一个字符串。 另外，JavaScript脚本会根据操作数的数据类型来确定表达式中的“+”是算术运算符还是字符串运算符。在两个操作数中只要有一个是字符串类型，那么这个“
JavaScript字符串包含
bsegebr的博客
03-11 4123
在任何编程语言中，检查字符串是否包含子字符串都是常见的任务。例如，假设您正在构建在线游戏。您可能需要检查用户名是否包含禁止使用的短语，以确保所有用户名都适合您的游戏。 JavaScript字符串包含 有三种方法可检查JavaScript字符串是否包含另一个字符或字符序列： includes（）。 indexOf（）。 正则表达式（regex）。 在本教程中，我们将讨论可以使用这三种方法来检查JavaScript字符串是否包含另一个字符串的方法。 includes（） ES6中引入的JavaScript
JavaScript中字符串连接/拼接的四种方式
Colbyzn的博客
08-02 1万+
JavaScript中连接字符串的方式，目前所知道的总共有4种，分别是使用加号字符、使用${}配合反引号、使用concat( )函数、使用join( ）函数。
JavaScript中字符串去重的六种方法
qq_41445106的博客
07-06 5234
关于字符串的去重有多种方式，最容易联想到的其实算是将字符串转为数组，对数组进行去重，这里我提供一种字符串去重的方式。 举个例子：已知字符串"a,a,b,c,c,d",统计每个字符出现的次数,结果显示a:2,b:1,c:2,d:1,去掉重复的字符,使结果显示abcd <script type="text/javascript"> var str="a,a,b,c,c,d" var...
javascript中字符串的‘单‘与“双“引号
allway2的博客
05-23 3677
通常在使用 javascript 进行编码时，您会遇到对字符串使用“单”或“双”引号的情况，并且想知道两者之间是否有任何真正的区别，如果有，使用一个是否有优势其他的报价类型？这篇文章就是来回答的！继续阅读！ 目录 两种报价风格的区别 选择正确的引用风格 单引号和双引号 - 优点和缺点 离别词 两种引用风格的区别 单引号 (' ') 和双引号 (" ") 都用于表示 Javascript 中的字符串。选择引用样式由您决定，一种样式相对于另一种样式没有特殊的语义。尽管如此，重要的是要注意
Javascript中字符串相关常用的使用方法总结
11-09
随着ECMAScript标准的不断发展，ES6及之后版本引入了许多新的字符串处理方法，进一步增强了JavaScript字符串操作的能力： 1. **检查字符串开头或结尾** - `startsWith(searchString[, position])` 和 `endsWith...
JavaScript中字符串与Unicode编码互相转换的实现方法
11-22
本文实例讲述了JavaScript中字符串与Unicode编码互相转换的实现方法。分享给大家供大家参考，具体如下： 这段代码演示了JavaScript中字符串与Unicode编码的转换: // 为了控制台的演示方便, 变量没有添加 var 定义 /...
JavaScript中字符串(string)转json的2种方法
10-24
主要介绍了JavaScript中字符串(string)转json的2种方法,两种方法分别是使用js函数eval()和、使用jquery.parseJSON()方法,需要的朋友可以参考下
JavaScript中字符串拼接的基本方法
12-02
在字符串中插入特殊字符，如换行符，需要使用转义字符“\”。例如，要在字符串中添加一个新行，可以这样做： ```javascript var confirmString = "You did not enter a response to the last " + "question.Submit ...
JavaScript中字符串的常用操作方法及特殊字符
10-18
字符串的操作对于处理文本数据是必不可少的，而特殊字符则是在字符串中具有特定意义或用于特殊功能的字符。在本篇文档中，我们将详细探讨JavaScript中字符串的常用操作方法以及如何插入和使用特殊字符。 首先，我们...
JavaScript 基本认识
HTML_Z的博客
01-26 3761
JavaScript 的基本认识：什么是 JavaScript、JavaScript 的注释以及基本语法结构
JavaScript 高级
HTML_Z的博客
04-16 3138
JavaScript 高级：原型、继承、函数。
web 数据类型
HTML_Z的博客
03-10 1289
数据类型简介、简单数据类型、获取变量数据类型、数据类型的转换
学习函数进阶
HTML_Z的博客
03-31 1057
函数的定义和调用、this的指向、严格模式、高阶函数、闭包、递归
javascript 中字符串 变量
最新发布
05-30
在 JavaScript 中，字符串变量可以通过以下方式进行定义和赋值： ```javascript // 使用单引号定义字符串变量 var str1 = 'Hello, world!'; // 使用双引号定义字符串变量 var str2 = "Hello, world!"; // 可以使用反斜杠转义特殊字符 var str3 = "It's a \"nice\" day."; // 可以使用模板字符串，使用反引号定义 var str4 = `Hello, ${name}!`; // 可以使用 String() 函数进行类型转换 var str5 = String(123); // 可以使用 toString() 方法进行类型转换 var num = 123; var str6 = num.toString(); ``` 其中，`var` 是定义变量的关键字，后面跟着变量名。变量名可以是任何合法的标识符，字符串可以使用单引号、双引号或反引号定义。如果字符串中需要包含引号，可以使用反斜杠进行转义；如果需要动态生成字符串，可以使用模板字符串，并使用 `${}` 来表示变量。 另外，JavaScript 中的基本类型数据可以通过对应的构造函数（如 `String()`）来创建对象形式，这样就可以调用对象的方法。但是，由于 JavaScript 中的基本类型数据是不可变的，因此在实际开发中，更多的是直接使用基本类型数据，而不是创建对象形式。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值