手动封装字符串新增方法

1,077 阅读1分钟

在ES6之前,字符串拼接工作都是直接使用"+"进行拼接的,当数据复杂或者要拼接的东西很多时,都会觉得比较麻烦。ES6出来后,使用``字符串模板来做"+"的拼接工作 格式:

stringxxx...${js代码}stringxxx...

例如

let obj = {
	name: "alice",
	age: 18,
	sex: 'famale'
}
const me = `
	我的名字叫${obj.name},我今年${obj.age},我的性别是${obj.sex} 
`
console.log(me);

字符串模板的好处是,可以根据需要随意的换行,中间插入变量使用${xxx},{ }里面能识别js代码

关于ES6字符串新增方法

由于用法比较简单,我就不写使用的例子,直接讲完用法就手动实现封装

  1. 新增字符串查找方法

★includes(要找的东西)

用于查找字符串是否包含要找的东西,返回 true/false

String.prototype._includes = function (findStr) {
	return this.indexOf(findStr) == -1 ? false : true;
}
let test = "abcd"._includes("abc");
console.log(test)//true

★startsWith(检测的东西)

用于检测 字符串是否已谁开头,返回 true/false

String.prototype._startsWith=function(str){
	return this.slice(0,str.length) == str
}
console.log("abcd"._startsWith("ab"));

★endsWith(检测的东西)

是否已什么结尾,返回 true/false

String.prototype._endsWith = function(str){
	return this.slice(-str.length) == str
}
console.log("abcd"._endsWith("ab"));//false
console.log("abcd"._endsWith("cd"));//true
  1. 字符串重复

★repeat(n)

参数n表示字符串重复n次

返回一个重复包含n个初始字符串的新字符串

String.prototype._repeat = function (n) {
	let self =  this.valueOf();
	let res = "";
	let temp = Number(n) || 0;
	if (temp) {
		for (let i = 0; i < temp; i++) {
			res +=self;
		}
		return res;
	}
}
console.log("abc"._repeat(2));
  1. 填充字符串

★padStart(整个填充后的字符串的长度,填充的东西)

往字符串前面填充插入字符串,返回填充后的字符串

String.prototype._padStart = function (len, padString) {
	let str = this;
	padString = padString.toString();
	if (padString.length > len - this.length) {
		padString = padString.toString().slice(0, len - this.length);
		while (str.length < len) {
			str += padString;
		}
	}
	//padString.length小于len - this.length情况:
	// 如果padString没有内容,则每一位填充位置用空格填充;
	// 如果有内容,则重复填充(有点像图片repeat填充)
	else if(padString.length == 0){
		while (str.length < len) {
			str = " " + str;
		}
	}else{
		//padString中的字符可能需要重复出现
		// 前面需要填充len-this.length位,而我填充的字符串只有padString.length
		while (str.length < len) {
			str = padString + str;
		}
	}		
	return str;
}
console.log("abc"._padStart(6, "122111"));

★padEnd(整个字符串的长度,填充的东西)

往字符串后面填充插入字符串

String.prototype._padEnd = function (len, padString) {
	let str = this;
	padString = padString.toString();
	if (padString.length > len - this.length) {
		padString = padString.toString().slice(0, len - this.length);
		while (str.length < len) {
			str = str + padString;
		}
	}
	else if (padString.length == 0) {
		while (str.length < len) {
			str += " ";
		}
	} else {
		while (str.length < len) {
			str += padString;
		}
	}
	return str;
}
console.log("abc"._padEnd(6, "122111"));