js系列-string字符串，模板字面量

定义方式

    //字面量
    let str = 'abc';
    console.log(str);//'abc'
    //对象方式
    let strob = new String('abc');
    console.log(strob);//String('abc')

两种定义方式区别：

1.类型不同
    //字面量
    let str = 'abc';
    console.log(typeof str);//'string'
    //对象方式
    let strob = new String('abc');
    console.log(typeof strob);//'object'
2.取值
    //对象方式定义
    console.log(strob.toString());//'abc'
    console.log(strob.valueOf());//'abc'

转义符\

有些字符有双层含义，需要使用 \ 转义符号进行含义转换。下例中引号为字符串边界符，如果输出引号时需要使用转义符号。

   let str = 'my name \'zhang\'';
   console.log(str);//my name 'zhang'

常用转义符号列表如下

符号	说明
\0	空字符
\'	单引号
\"	双引号
\\	反斜杠
\n	换行
\r	回车
\v	垂直制表符
\t	水平制表符
\b	退格
\f	换页
\uXXXX	unicode 码
\u{X} ... \u{XXXXXX}	unicode codepoint
\xXX	Latin-1 字符(x小写)

 字符串拼接

使用 + 可以连接多个内容组合成字符串，经常用于组合输出内容使用。

1.字符串拼接
    let age = 20;
    let name = '张三';
    console.log(name + '的年龄' + age + '岁');
2.长字符串拼接
    let longString = "这是一个非常长的字符串，需要 " +
        "跨多条线换行" +
        "否则,我的代码是不可读的.";
3.反斜杠方式连接长字符串
    let longString = "这是一个非常长的字符串，需要\
                    跨多条线换行\
                    否则,我的代码是不可读的.";

使用 += 在字符串上追回字符内容

    let str = '张三';
    str += '的年龄是20岁'
    console.log(str);

模板字面量（ES6） 

上面我们已经体验了字符串连接使用'+'的方式，ES6为我们提供了一种更强大更便捷的方式-模板字面量。

比较：

    let age = 20;
    let name = '张三';
    console.log(name + '的年龄' + age + '岁');//ES5
    console.log(`${name}的年龄${age}岁`);//ES6，语法是反单引号``

${}中不仅支持变量，还支持函数或函数表达式。下面做一个实例：

    let front = ['html', 'css', 'js'];
    let html = `<ul>
    ${front.map((item, index) => {
        return `<li>${item}</li>`;
    }).join('')}
    </ul>`;
    document.body.innerHTML = html;

在上面实例中，${}中写的是表达式，还使用了模板字面量嵌套。

获取长度

使用length属性可以获取字符串长度

console.log("csdn.net".length)//8

大小写转换

使用toLowerCase()和toUpperCase()转换

//转字符为小写格式
console.log("CSDN.net".toLowerCase())//'csdn.net'
//将字符转换成大写格式 
console.log("csdn.net".toUpperCase())//'CSDN.NET'

使用toLocaleLowerCase()和toLocaleUpperCase() ,地区特定转换方法(推荐) 

//转字符为小写格式
console.log("CSDN.net".toLocaleLowerCase())//'csdn.net'
//将字符转换成大写格式 
console.log("csdn.net".toLocaleUpperCase())//'CSDN.NET'

移除空白

使用trim删除字符串左右的空白字符

    let str = '   csdn.net  ';
    console.log(str.length);//13
    console.log(str.trim().length);//8

使用trimLeft删除左边空白，使用trimRight删除右边空白

let name = "   csdn.net   ";
console.log(name);
console.log(name.trimLeft());
console.log(name.trimRight()); 

获取单字符

根据从0开始的位置获取字符

    let web = 'csdn.net';
    console.log(web.charAt(2));//'d'

使用数字索引获取字符串

    let web = 'csdn.net';
    console.log(web[2]);//'d'

截取字符串

使用 slice、substr、substring 函数都可以截取字符串。

• slice、substring 第二个参数为截取的结束位置
• substr 第二个参数指定获取字符数量

    let web = 'csdn.net';
    //slice
    console.log(web.slice(2, 4));//'dn'
    //substring
    console.log(web.substring(2, 4));//'dn'
    //substr
    console.log(web.substr(2, 2));//'dn'

查找字符串

从开始获取字符串位置，检测不到时返回 -1

    let web = 'csdn.net';
    console.log(web.indexOf('n'));//2
    console.log(web.indexOf('n', 4));//5 从第4位置向后搜索

从结尾来搜索字符串位置

    let web = 'csdn.net';
    console.log(web.lastIndexOf('n'));//5
    console.log(web.lastIndexOf('n', 3));//3 从第3位置向前搜索

search() 方法用于检索字符串中指定的子字符串，也可以使用正则表达式搜索

    let web = 'csdn.net';
    console.log(web.search('.net'));//4
    console.log(web.search(/\.net/));//4

includes （ES6）字符串中是否包含指定的值，第二个参数指查找开始位置

    let web = 'csdn.net';
    console.log(web.includes('d'));//true
    console.log(web.includes('d', 4));//false

startsWith 开始位置是否是指定字符串，第二个参数为查找的开始位置。

    let web = 'csdn.net';
    console.log(web.startsWith('cs'));//true
    console.log(web.startsWith('dn', 2));//true

endsWith 结束位置是否是指定字符串，第二个参数为查找的结束位置。

    let web = 'csdn.net';
    console.log(web.endsWith('.net'));//true
    console.log(web.endsWith('.net', 5));//false

替换字符串

replace 方法用于字符串的替换操作

    let name = "baidu.com";
    let web = name.replace("baidu", "qq");
    console.log(web);//'qq.com'

默认只替换一次，如果全局替换需要使用正则（更强大的使用会在正则表达式章节介绍）

    let str = "2023/02/12";
    console.log(str.replace(/\//g, "-"));//'2023-02-12'

第二个参数也可以是一个函数 ，这个函数接收3个参数：匹配字符串或正则，匹配项在字符串中的位置，整个字符串

重复生成

下例是根据参数重复生成星号

function star(num = 3) {
	return '*'.repeat(num);
}
console.log(star());//'***'

下面是模糊后三位电话号码

    let phone = "12345678911";
    console.log(phone.slice(0, -3) + "*".repeat(3));//'12345678***'

类型转换

分隔字母

    let name = "csdn";
    console.log(name.split(""));// ["c", "s", "d", "n"]

将字符串转换为数组

console.log("1,2,3".split(",")); //[1,2,3]

隐式类型转换会根据类型自动转换类型

let st = 99 + '';
console.log(typeof st); //string

使用 String 构造函数可以显示转换字符串类型

let num = 99;
console.log(typeof String(num));

js中大部分类型都是对象，可以使用类方法 toString转化为字符串

let num = 99;
console.log(typeof num.toString()); //string

let arr = ['html', 'css', 'js'];
console.log(typeof arr.toString()); //string