字符串扩展
字符串扩展
1.includes startsWith endsWith
2.repeat
一、includes startsWith endsWith
这三个方法是非常相似的,返回的结果也都是布尔类型。
let a = "starry";
console.log(a.includes("s")) //是否包含s,包含返回 true
console.log(a.includes("s",1)) //可以接收参数,这里表示从下标为1开始查找,所以返回 false
console.log(a.startsWith("st")) // 表示是不是以st为开头,是返回 true
console.log(a.startsWith("st",1)) // 同样可以接收参数,所以返回 false
console.log(a.endsWith("rry")) //是不是以rry结尾,是返回 true
console.log(a.endsWith("rry",1)) // !!!这里是false,因为他是从下标为1往前找
console.log(a.endsWith("s",1)) // true
二、repeat
顾名思义就是重复字符串
let a = "starry";
console.log(a.repeat(3)) //starrystarrystarry 重复三次
console.log(a.repeat(2.8)) //starrystarry 小数向下取整,重复两次
console.log(a.repeat(0)) // 返回空字符串
console.log(a.repeat("3")) //starrystarrystarry 字符串数组转换为数字重复
console.log(a.repeat("sta")) //无意义返回空字符串
字符串常用方法回顾
1.字符串拼接: 使用加号运算符或模板字符串(ES6引入的新特性)来拼接字符串。
// 使用加号运算符
const name = "Alice";
const greeting = "Hello, " + name + "!";
// 使用模板字符串
const name = "Alice";
const greeting = `Hello, ${name}!`;
2.字符串长度: 使用length属性获取字符串的长度。
const str = "Hello";
console.log(str.length); // 输出:5
3.字符串查找和替换: 使用indexOf、lastIndexOf、search等方法查找字符串,并使用replace方法进行替换。
const str = "Hello, world!";
console.log(str.indexOf("world")); // 输出:7
console.log(str.lastIndexOf("o")); // 输出:8
console.log(str.search("world")); // 输出:7
console.log(str.search(/world/i)); // 输出:7(不区分大小写)
console.log(str.replace("world", "Universe")); // 输出:Hello, Universe!
4.大小写转换: 使用toUpperCase将字符串转换为大写,使用toLowerCase将字符串转换为小写。
const str = "Hello, World!";
console.log(str.toUpperCase()); // 输出:HELLO, WORLD!
console.log(str.toLowerCase()); // 输出:hello, world!
5.字符串分割和连接: 使用split方法将字符串分割成数组,并使用join方法将数组连接成字符串。
const str = "Apple, Banana, Cherry";
const arr = str.split(", ");
console.log(arr); // 输出:["Apple", "Banana", "Cherry"]
const newStr = arr.join(" - ");
console.log(newStr); // 输出:Apple - Banana - Cherry
数值扩展
1.支持二进制、八进制、十六进制写法
2.Number.isFinite Number.isNaN
3.isInteger
4.EPSILON
5.Math.trunc
6.Math.sign
一、支持二进制、八进制、十六进制写法
let num1 = 100;
let num2 = 0b100; //二进制写法
let num3 = 0o100; //八进制写法
let num4 = 0x100; //十六进制写法
console.log(num1); //100
console.log(num2); //4
console.log(num3); //64
console.log(num4); //256
二、Number.isFinite Number.isNaN
这个两个方法,主要区别与之前直接挂载在window下的isFinite和isNaN方法,使Number的方法归Number管,更加的模块化。Number.isFinite判断是否为有限数值,Number.isNaN判断是否为非数值。
let num1 = isFinite(100);
let num2 = isFinite(100/0);
let num3 = isFinite(Infinity);
let num4 = isFinite("100");
console.log(num1); // true
console.log(num2); // 0为除数,无限返回false
console.log(num3); // 无穷大 无限返回false
console.log(num4); // window下的isFinite会把字符串转化为数字,所以是true
-------------------------------------------------------------------------
let num1 = Number.isFinite(100);
let num2 = Number.isFinite(100/0);
let num3 = Number.isFinite(Infinity);
let num4 = Number.isFinite("100");
console.log(num1); // true
console.log(num2); // 0为除数,无限返回false
console.log(num3); // 无穷大 无限返回false
console.log(num4); // !!!不会转化,直接返回false
--------------------------------------------------------------------------
let num1 = isNaN(100);
let num2 = isNaN(NaN);
let num3 = isNaN("starry");
let num4 = isNaN("100");
console.log(num1); // false
console.log(num2); // true
console.log(num3); // true
console.log(num4); // false
--------------------------------------------------------------------------
let num1 = Number.isNaN(100);
let num2 = Number.isNaN(NaN);
let num3 = Number.isNaN("starry");
let num4 = Number.isNaN("100");
console.log(num1); // false
console.log(num2); // true
console.log(num3); // false 只要不是NaN直接false
console.log(num4); // false
三、isInteger
整数判断
let num1 = Number.isInteger(100)
let num2 = Number.isInteger(100.0) //!!!这里是true
let num3 = Number.isInteger(100.1)
let num4 = Number.isInteger("starry")
let num5 = Number.isInteger("100")
console.log(num1,num2,num3,num4,num5) //true true false false false
四、EPSILON
极小常量,表示1与大于1的最小浮点数之间的差,总所周知,JS中0.1+0.2是不等于0.3,这个时候就可以用极小常量来让他们相等。
function isEqual(x,y){
return Math.abs(x - y) < Number.EPSILON
}
console.log(isEqual(0.1+0.2,0.3)) //true
console.log(0.1+0.2===0.3) //false
五、Math.trunc
将小数部分抹掉,返回一个整数
console.log(Math.trunc(1.2)) //1
console.log(Math.trunc(1.8)) //1
console.log(Math.trunc(-1.2)) // -1 如果是floor是-2 ceil是-1
console.log(Math.trunc(-1.8)) // -1 如果是floor是-2 ceil是-1
六、sign
判断一个数到底是正数、复数、0。对于非数字会先转换
console.log(Math.sign(-100)) // -1
console.log(Math.sign(100)) // 1
console.log(Math.sign(0)) // +0
console.log(Math.sign(-0)) // -0
console.log(Math.sign("starry")) // NaN
数值常用方法回顾
1.toFixed():将数字四舍五入为指定小数位数,并返回一个字符串表示结果。
const num = 3.14159;
console.log(num.toFixed(2)); // 输出:3.14
2.toPrecision():将数字转换为指定的有效位数,并返回一个字符串表示结果。
const num = 123.456;
console.log(num.toPrecision(4)); // 输出:123.5
3.parseInt():将字符串解析为整数。
const str = "123";
console.log(parseInt(str)); // 输出:123
4.parseFloat():将字符串解析为浮点数。
const str = "3.14";
console.log(parseFloat(str)); // 输出:3.14
5.Math.round():将数字四舍五入为最接近的整数。
console.log(Math.round(3.6)); // 输出:4
6.Math.ceil():将数字向上取整。
console.log(Math.ceil(3.1)); // 输出:4
7.Math.floor():将数字向下取整。
console.log(Math.floor(3.9)); // 输出:3
8.Math.max():返回一组数字中的最大值。
console.log(Math.max(1, 2, 3)); // 输出:3
9.Math.min():返回一组数字中的最小值。
console.log(Math.min(4, 5, 6)); // 输出:4
数组扩展
1.展开运算符 …
2.Array.from
3.Array.of
4.find findIndex
5.fill
6.flat flatMap !!!
一、展开运算符 …
三个功能,复制、拼接以及和解构赋值混合使用
// 1.复制
let arr1 = [1,2,3]
let arr2 = arr1.concat() //传统复制
let arr3 = [...arr1] // 展开运算符复制,浅复制
console.log(arr2,arr3) // [1,2,3] [1,2,3]
// 2.拼接
let arr4 = [1,2,3]
let arr5 = [4,5,6]
let arr6 = [...arr4,...arr5]
console.log(arr6) //[1, 2, 3, 4, 5, 6]
// 3.和解构赋值混合使用
let myarr = [1, 2, 3, 4, 5, 6]
let [a,b,...c] = myarr
console.log(a,b,c) // 1 2 [3, 4, 5, 6]
二、Array.from
把类似与arguments这样的伪数组转换为真正的数组
function text(){
console.log(Array.from(arguments))
}
text(1,2,3,4)
三、Array.of
新建数组,解决Array创建数组只有一个值会初始化为长度的问题
let arr1 = Array(3)
console.log(arr1) // [空属性 × 3]
let arr2 = Array.of(3)
console.log(arr2)// [3]
四、find findIndex
查值
let arr = [2,3,5,4,6,1,2]
let res1 = arr.find(function(item){
return item > 3
})
let res2 = arr.findIndex(function(item){
return item > 3
})
let res3 = arr.findLast(function(item){
return item > 3
})
let res4 = arr.findLastIndex(function(item){
return item > 3
})
console.log(res1) // 5 返回第一个大于3的值
console.log(res2) // 2 返回第一个大于3的值的下标
console.log(res3) // 6 返回从后往前第一个大于3的值
console.log(res4) // 4 返回从后往前第一个大于3的值的下标
五、fill
填充
//新建时填充,在一些源码测试中用到
let arr = new Array(3).fill("staryy") //新建一个长度为3的空数组并且全部填充
console.log(arr) // ['staryy', 'staryy', 'staryy']
let arr1 = [1,2,3]
console.log(arr1.fill("starry")) //['starry', 'starry', 'starry'] 全部替换
let arr2 = [1,2,3]
console.log(arr2.fill("starry",1,2)) // [1, 'starry', 3] 传入参数,从下标1开始到下标2结束替换
六、flat flatMap !!!
扁平化!!!开发中经常使用
//简单示例
let arr1 = [1,2,3,[4,5,6]]
let arr2 = arr1.flat()
console.log(arr2) //[1, 2, 3, 4, 5, 6]
// 模拟开发环境
let arr3 = [
{
name:"A",
list:[1,2,3]
},
{
name:"B",
list:[2,3,4]
}
]
let arr4 = arr3.flatMap(function(item){
return item.list
})
console.log(arr4) //[1, 2, 3, 2, 3, 4]
数组常用方法回顾
1.push():向数组末尾添加一个或多个元素,并返回新的长度。
const array = [1, 2, 3];
array.push(4);
console.log(array); // 输出: [1, 2, 3, 4]
2.pop():移除并返回数组的最后一个元素。
const array = [1, 2, 3];
const lastElement = array.pop();
console.log(lastElement); // 输出: 3
console.log(array); // 输出: [1, 2]
3.unshift():向数组开头添加一个或多个元素,并返回新的长度。
const array = [1, 2, 3];
array.unshift(0);
console.log(array); // 输出: [0, 1, 2, 3]
4.shift():移除并返回数组的第一个元素。
const array = [1, 2, 3];
const firstElement = array.shift();
console.log(firstElement); // 输出: 1
console.log(array); // 输出: [2, 3]
5.concat():将两个或多个数组合并为一个新数组,并返回结果。
const array1 = [1, 2, 3];
const array2 = [4, 5, 6];
const newArray = array1.concat(array2);
console.log(newArray); // 输出: [1, 2, 3, 4, 5, 6]
6.slice():返回数组的指定部分(浅拷贝)。
const array = [1, 2, 3, 4, 5];
const newArray = array.slice(1, 4);
console.log(newArray); // 输出: [2, 3, 4]
7.splice():从数组中删除、替换或添加元素,并返回被删除的元素。
const array = [1, 2, 3, 4, 5];
const deletedElements = array.splice(1, 2, 6, 7);
console.log(deletedElements); // 输出: [2, 3]
console.log(array); // 输出: [1, 6, 7, 4, 5]
8.forEach():对数组中的每个元素执行提供的函数。
javascript
const array = [1, 2, 3];
array.forEach((element) => {
console.log(element);
});
// 输出:
// 1
// 2
// 3