关于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);
}

评论

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

这个站点使用 Akismet 来减少垃圾评论。了解你的评论数据如何被处理