【JavaScript】内置对象 - 字符串对象 ⑥ ( String 字符串拼接 | concat 函数 | String 字符串截取 | substr 函数 | substring 函数 )

韩曙亮

发布于 2024-06-10 08:09:07

600

发布于 2024-06-10 08:09:07

文章被收录于专栏：韩曙亮的移动开发专栏韩曙亮的移动开发专栏

String 字符串对象参考文档 : https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/String

一、String 字符串拼接

1、concat 函数拼接字符串

concat 函数的作用是拼接字符串 , 将若干字符串参数连接到调用 concat 函数的字符串后面 , 并返回一个新的字符串 ;

字符串是不可变的 , 调用 concat 函数不会改变调用者字符串 , 返回的字符串是新创建的字符串 ;

concat 函数语法如下 :

concat(str1)
concat(str1, str2)
concat(str1, str2, /* …, */ strN)

str1 , str2 等字符串是要连接的一个或多个字符串 ;
返回值是多个字符串的拼接结果 ; 这是一个新的字符串 ;

参考文档 : https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/String/concat

2、代码示例 - 拼接字符串

代码示例 :

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <!-- 设置 meta 视口标签 -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no,maximum-scale=1.0,minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>JavaScript</title>
    <style></style>
    <script>
        // 给定一个字符串
        var str = 'Hello';

        // 拼接字符串
        console.log(str.concat(' World'));
    </script>
</head>

<body>
</body>

</html>

执行结果 :

二、String 字符串截取

1、substr 函数截取字符串

substr 函数可以获取字符串的一部分子字符串 , 截取从指定的索引开始的指定个数的字符串 ;

该操作不会改变调用该函数的字符串 , 返回的结果是一个新字符串 ;

substr 函数原型如下 :

substr(start)
substr(start, length)

start 参数 : 截取字符串开始索引 , 包含该索引 ;
length 参数 : 截取字符串长度 , 如果没有该参数则截取到字符串末尾 ;

参考文档 : https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/String/substr

该函数已经不推荐使用 , 官方文档中推荐使用 substring 函数和 slice 函数 ;

代码示例 :

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <!-- 设置 meta 视口标签 -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no,maximum-scale=1.0,minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>JavaScript</title>
    <style></style>
    <script>
        // 给定一个字符串
        var str = 'Hello';

        // 拼接字符串
        console.log(str.concat(' World'));

        // 截取字符串
        console.log(str.substr(2, 2));
    </script>
</head>

<body>
</body>

</html>

执行结果 :

2、substring 函数截取字符串

substring 函数可以截取从指定索引位置开始 ( 包括该索引 ) 到指定索引位置结束 ( 不包括该索引 ) 的子字符串 ;

substring 函数原型如下 :

substring(indexStart)
substring(indexStart, indexEnd)

indexStart 参数 : 要截取的第一个字符索引 , 包括该索引的字符 ;
indexEnd 参数 : 要排除的第一个字符索引 , 该索引的字符不包含在内 ; 如果没有该参数 , 则截取到字符串末尾 ;

参考文档 : https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/String/substring

代码示例 :

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <!-- 设置 meta 视口标签 -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no,maximum-scale=1.0,minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>JavaScript</title>
    <style></style>
    <script>
        // 给定一个字符串
        var str = 'Hello';

        // 拼接字符串
        console.log(str.concat(' World'));

        // 截取字符串
        console.log(str.substr(2, 2));

        // 截取字符串
        console.log(str.substring(2, 4));
    </script>
</head>

<body>
</body>

</html>

执行结果 :