关于javascript:js常用方法梳理

1、将下标转为中文零一二三 …

export function transfromNumber(number){const  INDEX_MAP = ['零'，'一'.....]
  if(!number) return
  if(number === 10) return INDEX_MAP[number]
  return [...number.toString()].reduce((pre, cur) => pre  + INDEX_MAP[cur] , '' )
}

2、判断整数的不同办法

/* 1. 增加一个是数字的判断 */
function isInteger(obj) {return typeof obj === 'number' && obj%1 === 0}

/* 2. 应用 Math.round、Math.ceil、Math.floor 判断 整数取整后还是等于本人。利用这个个性来判断是否是整数 */
function isInteger(obj) {return Math.floor(obj) === obj
}

/* 3. 通过位运算符 */
function isInteger(obj) {return (obj | 0) === obj
}

/* 4.ES6 提供了 Number.isInteger */

3、dom 节点平滑滚动到可视区域，顶部，底部

原生的 scrollTo 办法没有动画，相似于锚点跳转，比拟僵硬，能够通过这个办法会自带平滑的适度成果

function scrollTo(element) {element.scrollIntoView({ behavior: "smooth", block: "start"}) // 顶部
    element.scrollIntoView({behavior: "smooth", block: "end"}) // 底部
    element.scrollIntoView({behavior: "smooth"}) // 可视区域
}

4、获取随机色彩

function getRandomColor(){return `#${Math.floor(Math.random() * 0xffffff) .toString(16)}`;
}

5、检测是否为空对象

通过应用 Es6 的 Reflect 静态方法判断他的长度就能够判断是否是空数组了，也能够通过 Object.keys() 来判断

function isEmpty(obj){return  Reflect.ownKeys(obj).length === 0 && obj.constructor === Object;
}

6、Boolean 转换

function toBoolean(value, truthyValues = ['true']){const normalizedValue = String(value).toLowerCase().trim();
  return truthyValues.includes(normalizedValue);
}
toBoolean('TRUE'); // true
toBoolean('FALSE'); // false
toBoolean('YES', ['yes']); // true

7、各种数组克隆办法

const clone = (arr) => arr.slice(0);
const clone = (arr) => [...arr];
const clone = (arr) => Array.from(arr);
const clone = (arr) => arr.map((x) => x);
const clone = (arr) => JSON.parse(JSON.stringify(arr));
const clone = (arr) => arr.concat([]);
const clone = (arr) => structuredClone(arr);

8、比拟两个工夫大小

通过调用 getTime 获取工夫戳比拟就能够了

function compare(a, b){return a.getTime() > b.getTime();}

9、计算两个工夫之间的月份差别

function monthDiff(startDate, endDate){return  Math.max(0, (endDate.getFullYear() - startDate.getFullYear()) * 12 - startDate.getMonth() + endDate.getMonth());
}

10、从工夫中提取年月日时分秒

因为 toISOString 会失落时区，导致时间差八小时，所以在格式化之前咱们加上八个小时工夫即可

function extract(date){const d = new Date(new Date(date).getTime() + 8*3600*1000);
  return new Date(d).toISOString().split(/[^0-9]/).slice(0, -1);
}
console.log(extract(new Date())) // ['2022', '09', '19', '18', '06', '11', '187']

11、判断一个参数是不是函数

function isFunction(v){return ['[object Function]', '[object GeneratorFunction]', '[object AsyncFunction]', '[object Promise]'].includes(Object.prototype.toString.call(v));
}

12、计算两个坐标之间的间隔

function distance(p1, p2){return `Math.sqrt(Math.pow(p2.x - p1.x, 2) + Math.pow(p2.y - p1.y, 2));
}

13、检测两个 dom 节点是否笼罩重叠

有些场景下咱们须要判断 dom 是否产生碰撞了或者重叠了，咱们能够通过 getBoundingClientRect 获取到 dom 的 x1,y1,x2,y2 坐标而后进行坐标比对即可判断进去

function overlaps = (a, b) {return (a.x1 < b.x2 && b.x1 < a.x2) || (a.y1 < b.y2 && b.y1 < a.y2);
}

14、判断是否是 NodeJs 环境

function isNode(){return typeof process !== 'undefined' && process.versions != null && process.versions.node != null;}

15、参数求和

function sum(...args){args.reduce((a, b) => a + b);
}