js字符串⽅法⼤全以及模板字符串⽤法字符串
1 什么是字符串
单引号或者双引号引起来的字符序列。
⽰例:
var str ="hello";
var str ="hi";
var str =new String("hello");
console.log(typeof str);//object
2 字符串操作
charAt() 对应位置上的字符
charCodeAt() 对应位置上的字符编码
String.fromCharCode() 编码对应的字符
function fnCharAt(){
var str ="China is great";
//charAt()对应位置上的字符
var ch = str.charAt(0);// C
//charCodeAt()对应位置上的字符编码
var chNum = str.charCodeAt(0);// 99 'a'--97
//String.fromCharCode()编码对应的字符
var ch2 = String.fromCharCode(90);// Z
console.log(ch2);
}
indexOf()
从左到右到第⼀个满⾜的字符串的位置
function fnIndexOf(){
var str ="wlecome to beijing";
//从左到右到第⼀个满⾜的字符串的位置
//不到则返回-1
var index = str.indexOf(" ");// 7
var index2 = str.lastIndexOf(" ");// 10  从右往左,编号从左往右
console.log(index, index2);
}
substr()
字符串截取,slice()与数组slice()⽅法类似,substr() 和 substring()对⽐如下。
function fnSubstr(){
var str ="good good study , day day up";
//从下标为5开始,截取后⾯的字符串
var substr = str.substr(5);
//从下标为5开始,截取4个字符
var substr2 = str.substr(5,4);//good
//从下标为5开始,截取后⾯的字符串,此时等价于substr(5)
var substr3 = str.substring(5);
//从下标为5开始,截取到下标为10,不包含10
var substr4 = str.substring(5,10);
var substr5 = str.substring(10,5);//等价于上⾯
console.log(substr2);
}
split()
字符串分割,分割为数组, 数组可以通过 join() 连接
function fnSplit(){
var str ="what is your name?";
var arr = str.split(" ");//['what','is','your','name?']
console.log(arr);
}
replace()
字符串替换 原数组不变
function fnReplace(){
var str ="tmd,祝你幸福!,tmd,永远不见";
// var newStr = place("tmd","**"); //默认替换第⼀个var newStr = str.split("tmd").join("**");
console.log(newStr);
}
fnReplace();
字符串颠倒
function fnReverse(){
var str ="qwjehq";
var str1 = str.split("").reverse().join("");
console.log(str1);
}
3 ES6 字符串
3.1 模板字符串
1. 反单引号引起来
2. 遇到变量⽤ ${} 括起来
3. 原理 正则实现
let name ="lisi";
let age =18;
js arguments
let res =`My name is ${name},I am ${age} years old`;
//内部原理,正则表达式的使⽤
res = place(/\$\{([^}]*)\}/g,function(){
console.log(arguments);
/*
[Arguments] {
'0': '${name}',
'1': 'name',
'2': 11,
'3': 'My name is ${name}, I am ${age}'
}
*/
return eval(arguments[1]);// eval('name')
});
console.log(res);
3.1.1 模板字符串拼接
let info =[name, age];
let lis = info.map(function(item){
return`<li>${item}</li>`;
});
let ulString =`
<ul>
${lis.join("")}
</ul>
`;
document.write(ulString);//将拼接的字符串写到页⾯
/*  结果
<ul>
<li>lisi</li> <li>18</li>
</ul>
*/
3.1.2 模板标签
//定义tag标签
function tag(str){
console.log(str);
console.log(arguments);// {0:['My name is ',',I am ',' years old'],1:'lisi',2:18} let res ="";
let arr =[];
let arr2 = arguments[0];
for(var k in arguments){
if(k !=0){
arr.push(arguments[k]);
}
}
for(var key in arr){
res += arr2[key].toUpperCase()+ arr[key].toString().toUpperCase();
}
res += arr2[arr2.length -1].toUpperCase();
console.log(res);
}
// 模版标签,tag标签,需要定义
let res2 = tag`My name is ${name},I am ${age} years old`;
3.2 es6 字符串操作
startsWith()以某字串开头
endsWith()以某字串结尾
includes()是否包含某字串
repeat()重复
padStart()/padEnd()填充⾸部填充/尾部填充
let url ="www.baidu";
let flag = url.startsWith("Http");// false
console.log(flag);
// endWith()
let img_name ="2.png";
let bool = dsWith("png");
console.log(bool);// true
// includes() 是否包含某字串
console.log("tom".includes("L"));// false
// repeat()
console.log("abc".repeat(3));
/
/ padStart()/padEnd()
console.log("0".padStart(8,9));// 8总长度 9填充字符 '99999990' console.log("0".padEnd(8,9));// 09999999

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。