JavaScript-字符串常用方法

在 js 中字符串可以看做一个特殊的数组，所以大部分数组的属性 / 方法字符串都可以使用

获取字符串长度

.length

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Demo</title>
    <script>
        let str = "abcd";
        console.log(str.length);
    </script>
</head>
<body>
</body>
</html>

获取某个字符

[索引] / charAt

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Demo</title>
    <script>
        let str = "abcd";
        let ch = str[1];
        console.log(ch);

        let ch2 = str.charAt(1);
        console.log(ch2);
    </script>
</head>
<body>
</body>
</html>

字符串查找

indexOf / lastIndexOf / includes

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Demo</title>
    <script>
        let str = "vavcd";
        let index1 = str.indexOf("v");
        let index2 = str.lastIndexOf("v");

        console.log(index1);
        console.log(index2);

        let result = str.includes("d");
        console.log(result);
    </script>
</head>
<body>
</body>
</html>

拼接字符串

concat / +

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Demo</title>
    <script>
        let str1 = "www";
        let str2 = "BNTang";

        // 推荐
        let res1 = str1 + str2;

        let res2 = str1.concat(str2);
        
        console.log(res1);
        console.log(res2);
    </script>
</head>
<body>
</body>
</html>

截取子串

slice / substring / substr

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Demo</title>
    <script>
        let str = "abcdef";

        let subStr1 = str.slice(1, 3);
        let subStr2 = str.substring(1, 3);
        let subStr3 = str.substr(1, 3);

        console.log(subStr1);
        console.log(subStr2);
        console.log(subStr3);
    </script>
</head>
<body>
</body>
</html>

字符串切割

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Demo</title>
    <script>
        let arr1 = [1, 3, 5];
        let str1 = arr1.join("-");

        console.log(str1);

        let str2 = "1-3-5";
        let arr2 = str2.split("-");

        console.log(arr2);
    </script>
</head>
<body>
</body>
</html>

ES6

判断是否以指定字符串开头

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Demo</title>
    <script>
        let str = "https://www.cnblogs.com/BNTang";
        let result = str.startsWith("www");
        console.log(result);
    </script>
</head>
<body>
</body>
</html>

判断是否以指定字符串结尾

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Demo</title>
    <script>
        let str = "BNTang.png";
        let result = str.endsWith("png");
        console.log(result);
    </script>
</head>
<body>
</body>
</html>

字符串模板

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Demo</title>
    <script>
        let str1 = "";
        let str2 = '';
        let str3 = `https://www.cnblogs.com/BNTang`;

        console.log(typeof str3);

        let str4 = `<ul>
                        <li>我是第1个li</li>
                        <li>我是第2个li</li>
                        <li>我是第3个li</li>
                    </ul>`;
        console.log(str4);

        let name = "BNTang";
        let age = 34;
        // let str = "我的名字是：" + name + ",我的年龄是：" + age;
        let str5 = `我的名字是：${name},我的年龄是：${age}`;
        console.log(str5);
    </script>
</head>
<body>
</body>
</html>

End

posted @   BNTang  阅读(46)  评论(0)  编辑  收藏  举报
编辑推荐：
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列：向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列：如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
阅读排行：
· winform 绘制太阳，地球，月球 运作规律
· 超详细：普通电脑也行Windows部署deepseek R1训练数据并当服务器共享给他人
· TypeScript + Deepseek 打造卜卦网站：技术与玄学的结合
· AI 智能体引爆开源社区「GitHub 热点速览」
· 写一个简单的SQL生成工具
点击右上角即可分享
微信分享提示