创建字符串和字符串的常用方法

最新推荐文章于 2024-01-24 15:27:48 发布

zhou_nj

最新推荐文章于 2024-01-24 15:27:48 发布

阅读量1.8k

点赞数

文章标签： javascript

本文链接：https://blog.csdn.net/zhou_nj/article/details/119736441

版权

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>
    <script>
        // new String类型的对象
        let str1 = new String('Hello')
        console.log(str1);
    </script>
</body>

</html>

第二种方式：

<!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>
    <script>
         // 第二种方式：直接定义
         let str = 'HelloWorld'
        console.log(str);
    </script>
</body>

</html>

2.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>
    <script>
         let str = 'HelloWorld'
         console.log(str.charAt(2));
    </script>
</body>

</html>

3.concat() 连接两个或更多字符串，并返回新的字符串，也可以直接用"+"拼接

<!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>
    <script>
         let str = 'HelloWorld'
         let str1="你好"
         console.log(str.concat(str1));
         console.log(str+str1);
    </script>
</body>

</html>

4.indexOf() 返回某个指定的字符串值在字符串中首次出现的位置。如果找不到返回-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>
    <script>
         let str = 'HelloWorld'
         console.log(str.indexOf('o'));
        console.log(str.indexOf('x'));
    </script>
</body>

</html>

5. 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>
    <script>
         let str = 'HelloWorld'
         console.log(str.lastIndexOf('o'));
        console.log(str.lastIndexOf('x'));
    </script>
</body>

</html>

6.includes() 查找字符串中是否包含指定的字符串，包含返回true，不包含返回false：

<!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>
    <script>
         let str = 'HelloWorld'
         console.log(str.includes('ll'));
        console.log(str.includes('cb'))
    </script>
</body>

</html>

7.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>
    <script>
         let str = 'HelloWorld'
          // 注意：能取到3位置，但是取不到6位置。
         console.log(str.slice(3,6));
        //  可以传负数，表示从后往前数位置
         console.log(str.slice(-6,-3));
        //  只传一个参数，表示从起始位往后全部截取
        console.log(str.slice(3));

    </script>
</body>

</html>

8.substring() 提取字符串中两个指定的索引号之间的字符

<!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>
    <script>
         let str = 'HelloWorld'
         console.log(str.substring(3,6));

    </script>
</body>

</html>

9.substr() 从起始索引号提取字符串中指定数目的字符

<!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>
    <script>
         let str = 'HelloWorld'
         console.log(str.substr(3,6));
    </script>
</body>

</html>

10.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>
    <script>
         let str = "张家辉,刘青云,古天乐"
        // 根据,号 分割字符串，并返回一个数组
        console.log(str.split(','));
    </script>
</body>

</html>

11.toLowerCase() 把字符串转换为小写

<!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>
    <script>
         let str = "HelloWorld"
         console.log(str.toLowerCase());
    </script>
</body>

</html>

12. toUpperCase() 把字符串转换为大写

<!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>
    <script>
         let str = "HelloWorld"
         console.log(str.toUpperCase());
    </script>
</body>

</html>

13.trim() 去除字符串两边的空白

<!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>
    <script>
         let str = "  HelloWorld  "
        //  原来str字符串的长度
         console.log(str.length);
        //  去除两端空格后的长度
         console.log(str.trim().length);
    </script>
</body>

</html>