值得收藏的JavaScript 语句

1. 两个日期间的天数

const diffDays = (startDate, endDate) =>
    Math.ceil(
        Math.abs(new Date(startDate) - new Date(endDate)) /
            (1000 * 60 * 60 * 24)
    );

console.log(diffDays("2021-06-01", "2021-06-23")); // 22

2. 首字母大写

const capitalize = (strContent) =>
    `${strContent.charAt(0).toUpperCase()}${strContent.slice(1)}`;
console.log(capitalize("devPoint")); // DevPoint

3. 3. 字符串转数字

const toNumber = (str) => +str;
// 显式地将字符串转换为数字
const toNumber2 = (str) => Number(str);

console.log(toNumber("100")); // 100
console.log(toNumber2("99")); // 99

4. 数字转字符串

const toString = (num) => num + "";
// 显式地将字符串转换为数字
const toString2 = (num) => num.toString();

const number = 100.0;

console.log(typeof toString(number)); // string
console.log(typeof toString2(number)); // string

5. 验证数组是否为空

const isNotEmpty = (arr) => Array.isArray(arr) && arr.length > 0;

console.log(isNotEmpty([6, 7, 8])); // true
console.log(isNotEmpty([])); // false

6. 数组合并

const mergeArray = (a, b) => a.concat(b);
const mergeBySpread = (a, b) => [...a, ...b];
const mergeBySet = (a, b) => [...new Set(a.concat(b))];

const arr1 = [6, 7, 8, "b"];
const arr2 = ["a", 7, 8, "b"];

console.log(mergeArray(arr1, arr2)); // [6, 7, 8, 'b','a', 7, 8, 'b']
console.log(mergeBySpread(arr1, arr2)); // [6, 7, 8, 'b','a', 7, 8, 'b']
console.log(mergeBySet(arr1, arr2)); // [ 6, 7, 8, 'b', 'a' ]

7. 数组排序

const sort = (arr) => arr.sort((a, b) => a - b);
console.log(sort([10, 8, 2, 68, 3])); // [ 2, 3, 8, 10, 68 ]

8. 生成随机十六进制颜色

const randomColor = () =>
    `#${Math.random().toString(16).slice(2, 8).padStart(6, "0")}`;

const randomColor2 = () => `#${(~~(Math.random() * (1 << 24))).toString(16)}`;

console.log(randomColor()); // #4fd21f
console.log(randomColor2()); // #2c456b

9. 获取 Cookie

const getCookie = (name, strCookie) =>
    `; ${strCookie}`.split(`; ${name}=`).pop().split(";").shift();

console.log(getCookie("_ga", document.cookie)); // GA1.2.918318285.1606740576

10. 获取用户选择的文本

const getSelectedText = () => window.getSelection().toString();
console.log(getSelectedText());

11. 变量值交换

let a = 1;
let b = 2;
[a, b] = [b, a];

console.log(a, b); // 2 1

12. 获取数组最后一项

const getLast = (arr) => arr.slice(-1)[0];

const arrTest = [1, 2, 3, 4, 5];
console.log(getLast(arrTest)); // 5

13. 使用方括号动态设置对象的键

有些时候，在创建对象时，希望根据特定的条件或变量更改对象的属性名，就可以借助方括号 [] 。

const dynamic = "url";
const item = {
    brand: "DevPoint",
    [dynamic]: "devpoint.cn",
};
console.log(item); // { brand: 'DevPoint', url: 'devpoint.cn' }

14. 使用 || 设置默认值

为变量设置默认值，避免无法处理的数据出现异常。

const getTitle = (obj)=>obj.title || "";

15. 使用 length 缩短数组

缩短数组的简单方法是重新定义它的长度属性，不过这样会更改数组，意味着将丢失数组中其他值。

const shortenArray = (arr, count) => {
    arr.length = count;
    return arr;
};
const array = [0, 1, 2, 3, 4, 5, 6, 6, 8, 9];
const shortArr = shortenArray(array, 4);
console.log(array); // [ 0, 1, 2, 3 ]
console.log(shortArr); // [ 0, 1, 2, 3 ]

// 修改后
const shortenArray = (arr, count) => {
    const arrTemp = [...arr];
    arrTemp.length = count;
    return arrTemp;
};
const array = [0, 1, 2, 3, 4, 5, 6, 6, 8, 9];
const shortArr = shortenArray(array, 4);
console.log(array); // [0, 1, 2, 3, 4, 5, 6, 6, 8, 9]
console.log(shortArr); // [ 0, 1, 2, 3 ]