JS开发小技巧

• 1. 替换字符串中匹配的相同字符

// 匹配第一个相同字符
let str = "Hello world!";
str1 = str.replace("o","666")；
// 输出：Hell666 world!
// 替换所有相同字符
str2 = str.replace(/\o/g,"777");
// 输出：Hell777 w777rld!
str3 = str.replaceAll("o","888");
// 输出：Hell888 w888rld!

• 2. 反转字符串

let str = "Hello world!";
const stringReverse = (str) => str.split("").reverse().join("");
let newStr = stringReverse(str);
console.log(newStr) // 输出：!dlrow olleH

• 3. 数字字符串转换成number类型

let num = "123";
// 方法一：
num = +num; // 123
// 方法二：
num = num * 1; // 123

// 对小数优雅的取整
let number = 3.145 | 0;
console.log(number); // 输出：3 

• 4. 条件判断给字符变量赋值，也叫短路评估

// str 有值就输出本身，无值输出default str
let str = "";
let newStr = str || "default str";
console.log(newStr); // default str

• 5. 通过条件判断增加对象属性

let isAdd = true;
let person = {
	name: "sun",
	age: 28,
	...(isAdd && {work: "chengxuyuan"})
}
console.log(person); // {name: 'sun', age: 28, work: 'chengxuyuan'}

• 6. 检查某个属性是否存在对象中

// 4种
let person = {
	name: "sun",
	age: 28
}
console.log(!person.age); // false
console.log("age" in person); // true
console.log(person.hasOwnProperty("age")); // true
console.log(Object.keys(person).indexOf("age")); // 1

• 7. 统计一个数组中某个元素出现的次数

let arr = [1, 1, 3, 4, 5, 1, 2, 99, 10];
let newArr = arr.reduce((a, b) => {
	if (b in a) {
		a[b]++;
	} else {
		a[b] = 1;
	}
	return a;
}, {})
console.log(newArr); // {1: 3, 2: 1, 3: 1, 4: 1, 5: 1, 10: 1, 99: 1}

• 8. 过滤数组中值为false的元素

const arr = [12, 34, null, 6, 0, false, undefined, "sun"];
const newArr = arr.filter(Boolean);
console.log(newArr); // [12, 34, 6, 'sun']

• 9. 数组去重

const arr = [11, 11, 2, 3, 55, 11, 2, 856, 3];
const unique = (arr) => [...new Set(arr)];
let nums = unique(arr);
console.log(nums); // [11, 2, 3, 55, 856]

• 10. 获取数组中随机项

const arr = [11, 11, 2, 3, 55, 11, 2, 856, 3];
const randomItem = (arr) => arr[Math.floor(Math.random() * arr.length)];
let item = randomItem(arr);
console.log(item);

• 11. 获取数组中最大值

const arr = [11, 11, 2, 3, 55, 11, 2, 856, 3];
const maxNum = (arr, n = 1) => [...arr].sort((a, b) => b-a).slice(0, n);
let max = maxNum(arr, 2);
console.log(max); // [856, 55]

• 12. 获取数组中最小值

const arr = [11, 11, 2, 3, 55, 11, 2, 856, 3];
const minNum = (arr, n = 1) => [...arr].sort((a, b) => a-b).slice(0, n);
let min = minNum(arr, 2);
console.log(min); // [2, 2]

• 13. 快速实现一个长度为10，并且元素值相同的数组

let newArr = Array(10).fill(666);
console.log(newArr); // [666, 666, 666, 666, 666, 666, 666, 666, 666, 666]

• 14. 优化多个条件的if语句

let x = "a";
// 未优化
if(x === "a" || x === "b" || x === "c" || x === "d") {
	console.log("x值不能为空");
}
// 优化
if(["a","b","c","d"].includes(x)){
	console.log("x值不能为空");
}

• 15. 对两个数组取交集

let arr1 = [1, 2, 3, 4, 5, 6, 7];
let arr2 = [245, 35, 456, 12, 2, 6, 7];
let arr3 = arr1.filter((item) => arr2.includes(item));
console.log(arr3); // [2, 6, 7]

• 16. 数组中有则删除，没有则添加

let arr = [1, 2, 33, 456, 7];
let proccessing = (num) => {
	if (arr.includes(num)) {
		arr.splice(arr.indexOf(num), 1);
	} else {
		arr.push(num);
	}
}
proccessing(32);
console.log(arr); // [1, 2, 33, 456, 7, 32]
proccessing(32);
console.log(arr); // [1, 2, 33, 456, 7]