ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

es6字符串操作

2021-04-12 20:07:34  阅读:33  来源: 互联网

标签:es6 repeat endsWith let str 字符串 操作 模板


1、includes()、startsWith()、endsWith()
2、repeat()
3、模板字符串(template string)
1、includes()、startsWith()、endsWith()
includes():返回布尔值,表示是否找到了参数字符串。
startsWith():返回布尔值,表示参数字符串是否在原字符串的头部。
endsWith():返回布尔值,表示参数字符串是否在原字符串的尾部。
第一个参数:字符;
第二个参数:表示开始搜索的位置;endsWith方法针对前n个字符,其他针对从第n个位置直到字符串结束。

2、repeat()
返回一个新字符串,表示将原字符串重复n次。
参数:

如果是小数,会向下取整;
如果为小于等于-1的负数或者Infinity,会报错;
NaN等同于0;
字符串先转换呈数字。
var str = "hello world";
str.includes("h"); //true
str.startsWith("h");//true
str.endsWith("d");//true

str.startsWith("el", 1);//true 从位置1开始

str.endsWith("el", 3);//true 前3个字符包括

str.endsWith("el", 4);//false

str.endsWith("llo", 5);//true
str.endsWith("llo ", 6);//false

str.includes("wor", 6);//true 从6位置开始


var str = "*";
str.repeat(2); //"**"
str.repeat(2.2); //"**" 小数会向下取整
str.repeat(-0.3); //""
str.repeat(-2);//Uncaught RangeError: Invalid count value
str.repeat(-1.0); //Uncaught RangeError: Invalid count value
str.repeat(Infinity); // Uncaught RangeError: Invalid count value
str.repeat(NaN); // ""
str.repeat(null); // ""
str.repeat(undefined); // ""
str.repeat('na') // ""
'na'.repeat('3') // "nanana"
3、模板字符串(template string)
反引号(`)标识:可当做普通字符串,可定义多行字符串,也可在字符串中嵌入变量

模板字符串中需使用反引号则要添加转义\;
如果使用模板字符串表示多行字符串,所有的空格和缩进都会被保留在输出之中;
trim() 方法用于删除字符串的头尾空格。不会改变原始字符串;
模板字符串甚至还能嵌套。
嵌入变量方式:${变量名}

{}内可用js表达式进行运算,可引用对象属性,可调用函数;
如果{}中值不是字符串,将按照一般规则转为字符串;
如果模板字符串中变量没有声明,将报错
let [name1, name2] = ["Tom", "Jack"];
var str1 = "hello world! This is an amazing message!";
console.log(str1);

var str2 = `Today is a funny day,
we have dinner tonight,
${name1} and ${name2} are good friends`; //字符串中通过${}嵌入变量
console.log(str2);//保留输出格式

var str3 = " string";
console.log(str3.trim());//"string" trim()用于删除首尾空格
console.log(str3);//" string"

let num1 = 11;
let num2 = 22;
let str4 = `${num1} + ${num2} = ${num1+num2}`;
console.log(str4);//可进行运算

let msg = `Good morning, ${name3}`;//没有声明,将报错

//模板字符串的嵌套应用
const data = [
{ first: '<Jane>', last: 'Bond' },
{ first: 'Lars', last: '<Croft>' },
];

const tmpl = addrs => `
<table>
${addrs.map(addr => `
<tr><td>${addr.first}</td></tr>
<tr><td>${addr.last}</td></tr>
`).join('')}
</table>
`;
console.log(tmpl(data));

//引用模板字符串自身
// 写法一
let str = 'return ' + '`Hello ${name}!`';
let func = new Function('name', str);
func('Jack') // "Hello Jack!"

// 写法二
let str = '(name) => `Hello ${name}!`';
let func = eval.call(null, str);
func('Jack') // "Hello Jack!"
模板编译:(待完善)
在模板字符串之中,放置了一个常规模板。该模板使用<%…%>放置 JavaScript 代码,使用<%= … %>输出 JavaScript 表达式。

let template = `
<ul>
<% for(let i=0; i < data.supplies.length; i++) { %>
<li><%= data.supplies[i] %></li>
<% } %>
</ul>
`;
原文链接:https://blog.csdn.net/weixin_43955911/article/details/88819663

标签:es6,repeat,endsWith,let,str,字符串,操作,模板
来源: https://www.cnblogs.com/nablog/p/14649721.html

专注分享技术,共同学习,共同进步。侵权联系[admin#icode9.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有