JS 中的数据特殊处理

写法不清楚可查看“1. 从数组中移除重复项”这个标题下的示例

一、日期处理

1. 检查日期是否有效

该方法用于检测给出的日期是否有效：

const isDateValid = (...val) => !Number.isNaN(new Date(...val).valueOf());

详细代码：

selectBtn() {
  let result1= this.isDateValid("December 17, 1995 03:24:00");
  let result2= this.isDateValid("December 37, 1995 03:24:00");
  console.log("数据结果：",result1);// true
  console.log("数据结果：",result2);// false
},
isDateValid(val) {
  let ab = new Date(val).valueOf()
  let a = !Number.isNaN(ab);
  return a;
},

简单示例：isDateValid(“December 17, 1995 03:24:00”); // true

2. 计算两个日期之间的间隔

该方法用于计算两个日期之间的间隔时间：

const dayDif = (date1, date2) => Math.ceil(Math.abs(date1.getTime() - date2.getTime()) / 86400000)

 详细代码：

getData() {
  let a = new Date("2021-11-3")
  let b = new Date("2022-2-1")
  let dayDif = this.dayDif(a,b);
  console.log("数据结果：",dayDif); //90
},
dayDif(date1,date2) {
  return Math.ceil(Math.abs(date1.getTime() - date2.getTime()) / 86400000)
},

简单示例：dayDif(new Date(“2021-11-3”), new Date(“2022-2-1”)) // 90

3. 查找日期位于一年中的第几天

该方法用于检测给出的日期位于今年的第几天：

const dayOfYear = (date) => Math.floor((date - new Date(date.getFullYear(), 0, 0)) / 1000 / 60 / 60 / 24);

简单示例：dayOfYear(new Date()); // 307

4. 时间戳 转换为 时间格式

该方法用于将时间戳转换为时间格式 "YY-MM-DD hh:mm:ss"：

getDate(data) {
    let dt = new Date(data);
    return (
        dt.getFullYear() +
        "-" +
        this.add0((dt.getMonth() + 1)) +
        "-" +
        this.add0(dt.getDate()) +
        " " +
        this.add0(dt.getHours()) +
        ":" +
        this.add0(dt.getMinutes()) +
        ":" +
        this.add0(dt.getMinutes())
    );
},
add0(m){return m<10?'0'+m:m },

简单示例：getData("1668045635000"); // 2022-11-10 10:00:00

二、字符串处理

1. 字符串首字母大写

该方法用于将英文字符串的首字母大写处理：

const capitalize = str => str.charAt(0).toUpperCase() + str.slice(1)

简单示例：capitalize(“hello world”) // Hello world

2. 字符串替换所有指定的字符

该方法用于将字符串中指定的字符全部替换为新的字符：

getNewStr1(str){
    str.replace("-","!"); // 只替换第一个匹配的字符
}
getNewStr2(str){
    str.replace(/\-/g,"!"); // 替换掉匹配的所有指定字符(g为全局标志)
}

简单示例：getNewStr1("2022-10-01") // 2022!10-01

简单示例：getNewStr2("2022-10-01") // 2022!10!01

3. 翻转字符串

该方法用于将一个字符串进行翻转操作，返回翻转后的字符串

const reverse = str => str.split(‘’).reverse().join(‘’);

简单示例：reverse(‘hello world’); // ‘dlrow olleh’

4. 随机字符串

该方法用于生成一个随机的字符串：

const randomString = () => Math.random().toString(36).slice(2);

简单示例：randomString();

5. 去除字符串中的HTML

该方法用于去除字符串中的HTML元素：

const stripHtml = html => (new DOMParser().parseFromString(html,'text/html')).body.textContent || '';

6. 手机号码脱敏处理

// 手机号码脱敏处理:方法1
var phone="13812345678";
var str=phone.substring(0,3)+"****"+phone.substring(7);
// 手机号码脱敏处理:方法2
var phone="13812345678";
var str=phone.substr(0,3)+"****"+phone.substring(7);
// 区别是：
// substring第一个参数是开始下标，第二个是结束下标
// substr第一个参数是开始下标，第二个是截取几位
// 手机号码脱敏处理:方法3
var phone="13812345678"
var pho=/(\d{3})\d*(\d{4})/
var str=phone.replace(pho,'$1****$2');
console.log(str)

 

三、数组处理

1. 从数组中移除重复项

该方法用于移除数组中的重复项：

const removeDuplicates = (arr) => […new Set(arr)];

在 Vue 中的正常写法：

removeDuplicates(arr) {
    let a = new Set(arr)
    console.log("a是多少",a);
},

简单示例：console.log(removeDuplicates([1, 2, 2, 3, 3, 4, 4, 5, 5, 6])); // [1, 2, 3, 4, 5, 6]

2. 判断数组是否为空

该方法用于判断一个数组是否为空数组，它将返回一个布尔值：

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

 Array.isArray(object) 

参数：object：要检测的内容

返回值：返回值是布尔类型的。
如果传进来的object是数组，返回true，如果不是数组，则返回false。

简单示例：isNotEmpty([1, 2, 3]); // true

3. 合并两个数组

可以使用下面两个方法来合并两个数组：

mergeArray(a, b) {
    let merge = a.concat(b)
},

简单示例：mergeArray([1,2], [1,2]); // [1, 2, 1, 2]

四、数字操作

1. 获得一组数的平均值

const average = (…args) => args.reduce((a, b) => a + b) / args.length;

简单示例：average(1, 2, 3, 4, 5); // 3

2. 获取两个整数之间的随机整数

该方法用于获取两个整数之间的随机整数

const random = (min, max) => Math.floor(Math.random() * (max - min + 1) + min);

简单示例：random(1, 50);

3. 指定位数四舍五入

该方法用于将一个数字按照指定位进行四舍五入：

const round = (n, d) => Number(Math.round(n + "e" + d) + "e-"+ d)

简单示例：round(1.005, 2) //1.01
简单示例：round(1.555, 2) //1.56

五、浏览器操作

1. 复制内容到剪切板

该方法使用 navigator.clipboard.writeText 来实现将文本复制到剪贴板：

const copyToClipboard = (text) => navigator.clipboard.writeText(text);

简单示例：copyToClipboard(“Hello World”);

2. 获取选中的文本

该方法通过内置的 getSelection 属性获取用户选择的文本：

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

简单示例：getSelectedText();

3. 滚动到页面顶部

该方法用于在页面中返回顶部：

const goToTop = () => window.scrollTo(0, 0);

简单示例：goToTop();

4. 判断当前是否是苹果设备

该方法用于检测当前的设备是否是苹果的设备：

const isAppleDevice = () => /Mac|iPod|iPhone|iPad/.test(navigator.platform);

简单示例：isAppleDevice();

5. 是否滚动到页面底部

该方法用于判断页面是否已经底部：

const scrolledToBottom = () => document.documentElement.clientHeight + window.scrollY >= document.documentElement.scrollHeight;

6. 重定向到一个URL

该方法用于重定向到一个新的URL：

const redirect = url => location.href = url

简单示例：redirect("")

六、其他操作

1. 随机布尔值

该方法可以返回一个随机的布尔值，使用Math.random()可以获得0-1的随机数，与0.5进行比较，就有一半的概率获得真值或者假值。

const randomBoolean = () => Math.random() >= 0.5;

简单示例：randomBoolean();