js记录随笔

雨化

已于 2023-12-07 17:16:06 修改

阅读量288

点赞数

分类专栏： js 文章标签： js

于 2020-02-18 19:54:45 首次发布

本文链接：https://blog.csdn.net/Qing_X_C/article/details/104381116

版权

js 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

reduce对数组对象去重

let a = [{name:'lili'},{name:'小红'},{name:'小明'},{name:'lili'}]
let obj={}
a = a.reduce((x,y)=>{
  obj[y.name] ? '' : (obj[y.name] = true && x.push(y));
  return x
},[])
console.log(a) // [{name:'lili'},{name:'小红'},{name:'小明'}]
console.log(obj) // {lili: 1, 小红: 2, 小明: 3 }

展开查看更多

// showMore 默认false
<div v-for="(item, index) in list" :key="index">
  <div v-if="index < 2 || showMore">
  // 默认只显示前2个
  </div>
</div>
<div @tap="showMore = !showMore" v-if="list.length > 2">
  <text>{{!showMore ? '展开更多' : '收起'}}</text>
</div>

js数字计算后精度问题

使用bignumber.js

// 解决 19.99*100出现1998.9999999999
new BigNumber(refundPrice).multipliedBy(100).toNumber()

js两个数组取不一样得值

let arr1 = [1, 2, 3, 4]; let arr2 = [3, 4, 5, 6];
let result = arr1.filter(x => !arr2.includes(x)); console.log(result); // [1, 2]

正则表达式

// 以/结束的字符串，去掉结束的/
let str = 'name/ds/'
if(/\.?\/$/.test(str)) {
   str = str.replace(/\.?\/$/,"")
}

URL转码

// 发送方
encodeURIComponent(JSON.stringify(url))
// 接收方
JSON.parse(decodeURIComponent(productInfo))

数值处理，大于6位数以万为单位

// num要处理的数值，point小数点位数
function numberFormatter(num, point) {
    let numStr = Number(num).toFixed(0).toString()
       // 十万以内直接返回 
    if (numStr.length < 6) {
       return num;
    }
       //大于8位数是亿
    else if (numStr.length > 8) {
        let decimal = numStr.substring(numStr.length - 8, numStr.length - 8 + point);
        return parseFloat(parseInt(num / 100000000) + '.' + decimal) + '亿';
    }
        //大于6位数是十万 (以10W分割 10W以下全部显示)
     else if (numStr.length > 5) {
        let decimal = numStr.substring(numStr.length - 4, numStr.length - 4 + point)
        return parseFloat(parseInt(num / 10000) + '.' + decimal) + '万';
    }
}

js阻止事件传播父元素，子元素点击不同事件

子元素/父元素同时加阻止事件传播才有效
var evt = e || event;
if(evt.stopPropagation){
	//IE上阻止事件的传播
	evt.stopPropagation();
	//阻止默认行为
	evt.preventDefault();
}else{
	//w3c标准的阻止事件的传播
	evt.cancelBubble = true;
	//w3c标准的阻止默认行为
	evt.returnValue = false;
}

扩展运算符替换

扩展运算符可以用arr.concat(arr2)代替

** 获取js万位**

Math.round((11100 /10000) * 100) / 100;// 1.11

项目中需要禁止点击有几种方案:

css方式

	pointer-events: none;
    cursor:not-allowed;

js方式（给父元素加事件，禁止冒泡）

	return false;

js封装的函数也可以操作dom，只要参数到位，返回的参数没法判断，那就重新判断用操作dom的条件

js获取当前日期时间并格式化，24小时格式

const myDate = new Date();
const nowDate = myDate.toLocaleString('chinese', { hour12: false }).replace(/:d{1,2}$/, ' ');
// "2020/3/5 11:41:30"
const reg = new RegExp('/', 'g');
const newDateTime = nowDate.replace(reg, '-');
// "2020-3-5 11:41:30"