【JS】纪录

【简写if执行条件】

if ( ValueData=== true)

可以简写为：

if (ValueData)

只有当ValueData是真值的时候，以上两个语句才可以替换。

如果判断假值

let a;
if ( a !== true ) {
  // do something...
}

可以简写为：

let a;
if ( !a ) {
  // do something...
}

【JS循环简写】

      const arr = [1, 2, 3, 4, 5, 6];
      for (let k = 0; k < arr.length; k++) {
        console.log(arr[k], 'arr[k]');
      }

可以简写为：

const arr = [1, 2, 3, 4, 5, 6];   
for (const index in arr) {
  console.log(arr[index], 'arr[index]');
}

【for循环与for...of】

for循环是一种基本的循环结构，它可以用于遍历数组或对象的属性。

for循环的写法如下：

for (let i = 0; i < arr.length; i++) {
  console.log(arr[i]);
}

for...of循环是ES6中引入的一种新的循环结构，它可以用于遍历可迭代对象（如数组和字符串）。

for...of循环的写法如下：

for (let item of arr) {
  console.log(item);
}

 for...of循环相对于for循环的优势在于，它可以更简洁、更直观地遍历数组或对象的属性。而且，for...of循环的遍历顺序是按照数组或对象的顺序进行的，而不是按照属性名或索引顺序进行的。

 

【短路求值】

如果想通过判断参数是否为null或者undefined来分配默认值的话，我们不需要写六行代码，而是可以使用一个短路逻辑运算符，只用一行代码来完成相同的操作。

let dbHost;
if (process.env.DB_HOST) {
  dbHost = process.env.DB_HOST;
} else {
  dbHost = 'localhost';
}

可以简写为：

const dbHost = process.env.DB_HOST || 'localhost';

【Array.find 简写】

const pets = [
 { type: 'Dog', name: 'Max'},
 { type: 'Cat', name: 'Karl'},
 { type: 'Dog', name: 'Tommy'},
]

function findDog(name) {
 for(let i = 0; i<pets.length; ++i) {
  if(pets[i].type === 'Dog' && pets[i].name === name) {
   return pets[i];
  }
 }
}

可以简写为

pet = pets.find(pet => pet.type ==='Dog' && pet.name === 'Tommy');
console.log(pet); // { type: 'Dog', name: 'Tommy' }

【简写 Object[key]】

对Obj对象里的值进行验证

function validate(values) {
 if(!values.first)
  return false;
 if(!values.last)
  return false;
 return true;
}
console.log(validate({first:'Bruce',last:'Wayne'})); // true

有很多表单，你需要进行验证，但有不同的字段和规则。那么，构建一个可以在运行时配置的通用验证函数

// 对象验证规则
const schema = {
 first: {
  required:true
 },
 last: {
  required:true
 }
}
 
// 通用验证函数
const validate = (schema, values) => {
 for(field in schema) {
  if(schema[field].required) {
   if(!values[field]) {
    return false;
   }
  }
 }
 return true;
}
console.log(validate(schema, {first:'Bruce'})); // false
console.log(validate(schema, {first:'Bruce',last:'Wayne'})); // true

【 简写双重按位非运算符-Math.floor(取小值)】

Math.floor(4.9) === 4  //true

可以简写为：

~~4.9 === 4  //true

【三元运算符简写-if-else】

const x = 20;
let answer;
if (x > 10) {
  answer = 'is greater';
} else {
  answer = 'is lesser';
}

可以简写为：

const answer = x > 10 ? 'is greater' : 'is lesser';

【或者 - ||】

要取 ‘或者’ 时，不能这样写

if(this.flag==null||0)

正确写法为

if (this.flag == null || this.flag == 0) 

【数组遍历】

arr.forEach===会对每个元素都进行遍历比对，console会打印三条信息

arr.forEach(item =>{
    if(item.name == 'lxy'){
        console.log('存在')
}
})

arr.find===进行比对，存在才执行 不存在不执行，console只会打印一条信息

 if (this.accounts && this.accounts.find(e => e === this.currentCorpId)) {
        // 存在当前
      } else {
        // 不存在当前
        this.accounts.push(this.currentCorpId);
      }

【数组操作】删除数组第⼀个元素（不改变原数组，返回新数组）

var arr = [1, 2, 3, 4, 5];
var newArr = arr.slice(0);
newArr.splice(0, 1);
console.log(newArr);

const arr = response.rows;
          const newArr = arr.slice(0);
          newArr.splice(0, 1);
          this.reconciliaList = newArr;

【输入框只能输入数字】用正则限制输入框只能输入整数，不能输入小数点等符号

οnkeyup="this.value=this.value.replace(/[^\d]/g,'') " onafterpaste="this.value=this.value.replace(/[^\d]/g,'') "

<el-input
                onkeyup="this.value=this.value.replace(/[^\d]/g,'') "
                onafterpaste="this.value=this.value.replace(/[^\d]/g,'') "
                maxlength="9"  //限制最多只能输入9位
              />