1.字符串的Unicode表示法
JavaScript允许采用"\uxxxx"的形式表示一个字符,“xxxx”表示字符的Unicode码点;这种表示法仅限于表示码点在“\u0000~\uFFFF"之间的字符,超过这个范围的字符需要用2个双字节的形式表达;ES6对此进行了改进,只要将码点放入大括号就能正确解读该字符;==大括号表示法等价于utf-16编码;
// JavaScript允许使用\uxxxx形式表示字符串
console.log("\u0061"); // a
// 局限性:超过\uFFFF的字符需要用两个双字节的形式表示
console.log("\uD872\uDFB7"); // 𠮷
// ES6新特性:只要将码点放入大括号,就能正确识别
console.log("\u{20BB7}"); // 𠮷
// 大括号表示法等价于UTF-16编码
let res1 = "\u{1F680}" === "\uD83D\uDE80"; // true
console.log(res1);
2.codePointAt()方法(字符===>码点)
作用:返回32位的utf-16字符的码点;参数:字符在字符串中的位置,从0开始;
const s = "韛";
let res1 = s.codePointAt(0);
3.String.fromCodePoint()方法(码点===>字符)
作用:与codePointAt()相反,根据指定码点返回字符;ES5的String.formCharCode方法也是根据码点返回字符,但是无法处理32位的utf-16编码,该方法能够弥补这一缺陷;语法:
String.fromCodePoint(0x20BB7);
4.字符串的遍历器接口
ES6为字符串添加了遍历器接口,使得字符串能使用for…of方法遍历;优点:能识别大于\uFFFF的字符,传统的for循环无法识别;
// 利用码点创建一个字符串
let text = String.fromCodePoint(0x20BB7);
// for循环
for(let i = 0 ; i < text.length ; i++){
console.log(text[i]); // for循环认为text包含两个不可打印的字符
}
// for...of遍历
for(let str of text){
console.log(str); // 𠮷 for of循环能正确识别
}
5. at()
ES5中charAt()方法,返回给定位置的字符串,但是局限性在于该方法无法识别大于\uFFFF的字符;at()方法(有提案但是尚未实现)能解决该问题,该方法可以用垫片库实现;
6.normalize()
作用:表示语调符号和重音符号;
7.includes()、startsWith()、endsWith()
includes()
作用:查找参数字符串是否包含在目标字符串中,返回布尔值;语法:
str.includes("text"[,pos]);
const str = "hello world";
let res1 = str.includes("ll",0);
console.log(res1);
startsWith()
作用:查找参数字符串是否包含在源字符串的头部,返回布尔值;指定位置时,指定的位置开始就是源字符串头部;语法:
str.startsWith("text"[,pos]);
let res2 = str.startsWith("w",6);
console.log(res2);
endsWith()
作用:查找参数字符串是否包含在源字符串的尾部,返回布尔值;第二个参数表示从该位置之前的位置开始查找;语法:
str.endsWith("text"[,pos]);
let res3 = str.endsWith("o",8);
console.log(res3);
8.repeat()方法
作用:返回将字符串重复指定次数后组成的新字符串;语法:
str.repeat(n);
参数是字符串、小数、0~-1之间的数值、NaN、负数或Infinity时的返回值:
const str = "peanut";
let res1 = str.repeat("3");
let res2 = str.repeat("haha");
console.log(res1);
console.log(res2);
let res3 = str.repeat(2.9);
let res4 = str.repeat(2.4);
console.log(res3);
console.log(res4);
let res5 = str.repeat(-0.5);
console.log(res5);
let res6 = str.repeat(NaN);
console.log(res6);
let res7 = str.repeat(-5);
let res8 = str.repeat(+Infinity);
let res9 = str.repeat(-Infinity);
9.padStart()、padEnd()
ES2017引入的功能;作用:用于使用指定字符补全字符串长度;
padStart(),接受两个参数:
作用:字符串头部补全;语法:
padStart(num,text);
padEnd(),接受两个参数;
作用:字符串头部补全;语法:
padEnd(num,text);
关于字符串长度的几种情况:
原字符串长度 >= 指定的最小长度:返回原字符串;
const str = "peanut";
let res1 = str.padStart(5);
let res2 = str.padEnd(5);
console.log(res1,res2);
原字符串长度 < 指定的最小长度:按照指定字符补全不足的字符;
let res3 = str.padStart(10,"☹");
let res4 = str.padEnd(10,"-");
console.log(res3);
console.log(res4);
原字符串长度与补全字符长度之和 > 指定的最小长度:截去超出位数的补全字符串;
let res5 = str.padStart(8,"☹☹☹");
let res6 = str.padEnd(8,"---");
console.log(res5);
console.log(res6);
不指定用于补全的字符:默认使用空格补全;
let res7 = str.padStart(8);
let res8 = str.padEnd(8);
console.log(res7);
console.log(res8);
常见用途:
为数值补全指定位数;提示字符串格式;
let num = "86";
let num_padS = num.padStart(4,"0");
let num_padE = num.padEnd(4,"0");
console.log(num_padS);
console.log(num_padE);
let data = "12";
let data_S = data.padStart(10,"YYYY-MM-12");
console.log(data_S);
模板字符串
模板字符串就是增强版的字符串,用反引号标识;作用:当普通字符串使用、定义多行字符串、在字符串中嵌入变量;在模板字符串中使用反引号时,要注意转义;
const str1 = `peanut \`run\` `;
console.log(str1);
用来表示多行字符时,所有的换行和空格都会被保留;
const str2 = `peanut
like code!`;
console.log(str2);
如果不想保留字符串中的换行,可以使用trim方法;
``.trim();
在模板字符串中嵌入变量,需要将变量写在${}中;
// 4.在模板字符串中嵌入变量,需要将变量写在${}中
for(let i = 0 ; i < 5 ; i++){
document.write(`这是第${i}次循环!`);
}
大括号中可以是任何JavaScript表达式、可以进行运算、引用对象属性、调用函数;
// 5.1 大括号可以是 任意表达式
const x = 1;
const y = 2;
console.log(`${x} + ${y} = ${x + y}`); // 1 + 2 = 3
// 5.2 也可以进行运算
console.log(`${x+ y}`); // 3
// 5.3 引用对象属性
// 定义对象
const person = {
name : "peanut",
age : 33
}
console.log(`my name is ${person.name} , ${person.age} years old!`); // my name is peanut , 33 years old!
// 5.4 调用函数
function test() {
console.log("peanut 666");
}
`test text : ${test()}`; // peanut 666
如果大括号中的值不是字符串,将按照一般的规则将其转换为字符串;比如对象,会调用对象的toString方法转换为字符串;如果大括号中的内容是字符串,则会原样输出;模板字符串可嵌套使用;引用模板字符串本身:
// 写法1:
let str = "return" + "`hello ${name}`";
let fn = new Function("name",str);
console.log(fn("宝鸡"));
// 写法2:
let func = (name) => `Hello ${name}!`;
func('Jack') // "Hello Jack!"
11.实例:模板编译(略:p60)
12.标签模板
13.String.row()
作用:可以作为处理模板字符串的基本方法,会将所有变量替换,并对反斜线进行转义,方便下一步作为字符串使用;
14.模板字符串的限制
模板字符串默认会将字符串转义,因而无法在模板字符串中插入其他语言;
转载请注明原文地址:https://blackberry.8miu.com/read-9032.html