js 小知识 持续更新

提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档

---

使用步骤

01–检查日期是否为周末

代码如下（示例）：

const isWeekend = (date) => [0, 6].indexOf(date.getDay()) !== -1;
console.log(isWeekend(new Date(2021, 4, 14)));
// false (Friday)
console.log(isWeekend(new Date(2021, 4, 15)));
// true (Saturday)

02–获取数组中的唯一值(数组去重—13复杂数组去重)

代码如下（示例）：

const uniqueArr = (arr) => [...new Set(arr)];

console.log(uniqueArr([1, 2, 3, 1, 2, 3, 4, 5]));
// [1, 2, 3, 4, 5]

---

03–检查变量是否为数组

代码如下（示例）：

const isArray = (arr) => Array.isArray(arr);

console.log(isArray([1, 2, 3]));
// true
console.log(isArray({ name: 'Ovi' }));

04–获取javascript语言的实际类型 (同–08)

代码如下（示例）：

const trueTypeOf = (obj) => {
  return Object.prototype.toString.call(obj).slice(8, -1).toLowerCase();
};

console.log(trueTypeOf(''));
// string
console.log(trueTypeOf(0));
// number
console.log(trueTypeOf());
// undefined
console.log(trueTypeOf(null));
// null
console.log(trueTypeOf({}));
// object
console.log(trueTypeOf([]));
// array
console.log(trueTypeOf(0));
// number
console.log(trueTypeOf(() => {}));
// function

05–在结尾处截断字符串

代码如下（示例）：

const truncateString = (string, length) => {
  return string.length < length ? string : `${string.slice(0, length - 3)}...`;
};

console.log(
  truncateString('Hi, I should be truncated because I am too loooong!', 36),
);
// Hi, I should be truncated because...

06–从中间截断字符串

代码如下（示例）：

const truncateStringMiddle = (string, length, start, end) => {
  return `${string.slice(0, start)}...${string.slice(string.length - end)}`;
};

console.log(
  truncateStringMiddle(
    'A long story goes here but then eventually ends!', // string
    25, // 需要的字符串大小
    13, // 从原始字符串第几位开始截取
    17, // 从原始字符串第几位停止截取
  ),
);
// A long story ... eventually ends!

07–滚动页面 与顶部距离()

代码如下（示例）：

scrollBar() {
      // 阻力，数值越大，滑动越慢
      const drag = 10;
      const location = 0;
      // 滑动到顶部
      const scrollToTop = () => {
        // 距离顶部的距离
        const gap = document.documentElement.scrollTop || document.body.scrollTop;
        if (gap > location) {
          var animationID = window.requestAnimationFrame(scrollToTop);
          window.scrollTo(0, gap - gap / drag);
        } else {
          window.cancelAnimationFrame(animationID);//满足条件后停止
        }
      };
      scrollToTop();
    },

08–获取javascript语言的实际类型(同–04)

代码如下（示例）：

function typeOf(obj) {
  const toString = Object.prototype.toString
  const map = {
    '[object Boolean]': 'boolean',
    '[object Number]': 'number',
    '[object String]': 'string',
    '[object Function]': 'function',
    '[object Array]': 'array',
    '[object Date]': 'date',
    '[object RegExp]': 'regExp',
    '[object Undefined]': 'undefined',
    '[object Null]': 'null',
    '[object Object]': 'object'
  }
  return map[toString.call(obj)]

09–对象/数组的深拷贝 (需与–08连用)

代码如下（示例）：

// deepCopy
export function deepCopy(data) {
  const t = typeOf(data)
  let o

  if (t === 'array') {
    o = []
  } else if (t === 'object') {
    o = {}
  } else {
    return data
  }

  if (t === 'array') {
    for (let i = 0; i < data.length; i++) {
      o.push(deepCopy(data[i]))
    }
  } else if (t === 'object') {
    for (let i in data) {
      o[i] = deepCopy(data[i])
    }
  }
  return o
}

10–money格式每三位用逗号隔开

代码如下（示例）：

export function parseMoney(s, n) {
  if (!s) return 0
  n = n > 0 && n <= 20 ? n : 2
  s = parseFloat((s + '').replace(/[^\d\.-]/g, '')).toFixed(n) + ''
  const l = s
    .split('.')[0]
    .split('')
    .reverse()
  const r = s.split('.')[1]
  let t = ''
  for (let i = 0; i < l.length; i++) {
    t += l[i] + ((i + 1) % 3 === 0 && i + 1 !== l.length ? ',' : '')
  }
  return (
    t
      .split('')
      .reverse()
      .join('') +
    '.' +
    r
  )
}

11–生成随机字符串

// 生成随机字符串
export function random_str(len = 32) {
  const $chars = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890'
  const maxPos = $chars.length
  let str = ''
  for (let i = 0; i < len; i++) {
    str += $chars.charAt(Math.floor(Math.random() * maxPos))
  }
  return str
}

12–下划转驼峰

// 下划转驼峰
export function camelCase(str) {
  return str.replace(/-[a-z]/g, str1 => str1.substr(-1).toUpperCase())
}

13–复杂数组去重一 (根据id去重)

// 数组去重
        let arr = [
            { name: "二天", artist: "狗子", },
            { name: "二根", artist: "air", id: "2" },
            { name: "羽根", artist: "air", id: "3" },
            { name: "晴天", artist: "哇啊啊", id: "6" },
            { name: "羽根", artist: "air", id: "1" },
            { name: "晴天", artist: "周杰伦", id: "4" },
            { id: 1, name: "孙七" },
            { id: 2, name: "周八" },
            { id: 2, name: "吴九" },
            { id: 3, name: "郑十" },
            { id: 9, name: "王八" },
        ];

        const removeDuplicateObj = (arr) => {

            let obj = {};

            arr = arr.reduce((newArr, next) => {

                obj[next.id] ? "" : (obj[next.id] =  newArr.push(next));

                return newArr;

            }, []);

            return arr;
        };

        console.log(removeDuplicateObj(arr));

14–数组单个项调整( 在数组某一行插入删除 多少项)

应用场景（示例）：table 将某一项数据移动至第N行

// tab列表中 将某一项移动至num行
export function handlemovelist( index, num ) {
     // 数组  index  
     // num  目标nidex
      if (num === index + 1) return
  	  cosnt item = array.splice(index, 1) // tableData 中删除已选择项，把选择项给item
      array.splice(num - 1, 0, item[0]) // 把选择项添加到tableData数组中
}

15–获取随机颜色( 十六进制)

// 获取随机颜色--十六进制
export function RandomColor () {
  return  "#" + Math.floor(Math.random() * 0xffffff).toString(16).padEnd(6, "0");
}

16–获取地址栏参数

 let dataObj = window.location.search.substr(1).split("&").reduce((obj, next, i, arr) => {
     obj[arr[i].split("=")[0]] = decodeURIComponent((arr[i].split("=")[1]));
     return obj
 }, {})
 console.log(dataObj, "----------")

总结

提示：这里对文章进行总结：