字符串:String
-
ES6 - 模板字符串:` `
// ES6 模板字符串 let name = "xiaokange"; let zhiye = "chengxuyuan";
-
传统字符串拼接和模板字符串拼接
// 传统字符串拼接 let str = "My name is " + name + ", I'm a " + zhiye + " !"; // ES6 模板字符串拼接 let str1 = `My name is ${name}, I'm a ${zhiye} !`;
-
采用反引号标识符,(’),将变量放入 ${} 中;
可以是运算表达式、也可以是对象属性、也可以是对象的属性、可以是函数的调用;- 可以定义多行字符串,需要注意的是:所有的空格和缩进都会被保留在输出中;
- ${} 中可以放任意JavaScript表达式;
-
// 运算表达式 var a = 1; var b = 2; var str21 = `The result is ${a+b}`; // 对象属性 var obj = { "a": 1, "b": 2 }; var str22 = `result is ${obj.a+obj.b}`; // 函数调用 function fn() { return 3; }
var str23 = `result is ${ fn() }`; -
标签模板
var namex = "XiaoKang"; var height = 180; // 标签+模板字符串 tagFn `他叫${namex},身高${height}cm。`; //标签模板:可以理解为 标签函数 + 模板字符串 // 定义一个函数,作为标签 function tagFn(arr, v1, v2) { console.log(arr); // ["他叫",",身高","cm。"] 数组类型,内容为除 ${} 以外的其他字符串,按顺序组合 console.log(v1); // ZhangSan console.log(v2); // 180 }
-
字符串 String 类扩展
// repeat() 函数:将目标字符串重复 N 次,返回一个新的字符串,不影响目标字符串。 var name1 = 'Zxk'; // 目标字符串 var name2 = name1.repeat(3); // 变量 name1 被重复 3 次 console.log(name1); console.log(name2); // includes()函数:判断字符串中是否包含指定的子字符串,返回 true 表示含有,false 表示未含有,第二个参数选填,表示开始搜索的位置。 var name3 = "我是小铭同学"; name3.includes('K'); // true 含有 name3.includes('Z'); // false 未含有 name3.includes('同学', 1); // true,表示从第 2 个字符开始搜索,含有 // 类似与 indexOf(),其返回值为 -1 (表示未含有)和 1(表示含有)
-
startsWith()函数、endsWith()函数、charAt()方法和codePointAt()函数
// charAt()方法:返回指定位置的字符 var str111 = "zxk"; var str222 = "k"; str111.length; // 2 str222.length; // 2 str111.charAt(0); // z str111.charAt(1); // x // <!-- 乱码,无法读取 --> str222.charAt(0); // '�' str222.charAt(1); // '�' // codePointAt()函数:js中一个字符固定为 2 个字节,对于 4 字节存储的字符,js会认为它是两个字符,此时它的长度 length=2。对于 4 字节的字符,js无法正确读取字符。 str222.codePointAt(); // 结果:134071 返回的是十进制编码 换成十六进制:20bb7 对应的Unicode编码就是 \u20bb7
-
String.fromCodePoint()函数和String.raw()函数
// String.fromCodePoint()函数:一个字符对应的码点,返回的结果是对应的字符 String.fromCodePoint(134071); //吉 可以证明 codePointAt()读取的是自4字节的字符 // String.raw()函数:返回字符串最原始的样貌,即使字符串中含有转义字符,它都视而不见,直接输出 console.log(`hello \n world!`); // 输出结果:换行 String.raw(`hello \n world!`); // 原样输出