zl程序教程

您现在的位置是:首页 >  Javascript

当前栏目

5个能提高前端工作效率的操作

2023-03-14 09:36:07 时间

一些在前端项目中会用到的快捷操作,下面的代码都可以直接复制到控制台运行。

数字取整

 

  1. let floatNum = 100.5;  
  2. let intNum = ~~floatNum;  
  3. console.log(intNum); // 100 

 

 

5个能提高前端工作效率的骚操作

 

字符串转数字

 

  1. let str="10000" 
  2. let num = +str;  
  3. console.log(num); // 10000 

 

 

5个能提高前端工作效率的骚操作

 

Falsy和Truthy值转boolean

Falsy为Javascript中所有可以转换为false的值的统称,共8个:false本身、空字符串、null、undefined、NaN、数字0、数字-0、大数字0n。

除Falsy值外其他所有值都是Truthy

  1. let falseNum = 0; 
  2. let falseStr = ""
  3. let falseUndefined; 
  4. let falseNull = null
  5. let falseNaN = 0/0; 
  6.  
  7. let trueNum = 1; 
  8. let trueStr = "何方"
  9. let trueObj = {name:"何方"}; 
  10. let trueArr = ["前端","后端"]; 
  11.  
  12. console.log("falseNum", !!falseNum); // false 
  13. console.log("falseStr", !!falseStr); // false 
  14. console.log("falseUndefined", !!falseUndefined); // false 
  15. console.log("falseNaN",!!falseNaN); // false 
  16.  
  17. console.log("trueNum",!!trueNum); // true 
  18. console.log("trueStr",!!trueStr); // true 
  19. console.log("trueObj",!!trueObj); // true 
  20. console.log("trueArr",!!trueArr); // true 

 

5个能提高前端工作效率的骚操作

 

交换对象键值

 

  1. let obj = { 
  2.     key1: "value1"
  3.     key2: "value2" 
  4. }; 
  5. let revert = {}; 
  6. Object.entries(obj).forEach(([key, value]) => revert[value] = key); 
  7. console.log(revert); 

 

 

5个能提高前端工作效率的骚操作

 

数组去重

值类型数组

 

  1. let arrNum = [ 
  2.     1, 2, 3, 4, 5, 6, 7, 8, 9, 0, 
  3.     1, 2, 3, 4, 5, 6, 7, 8, 9, 0 
  4. ]; 
  5. let arrString = [ 
  6.     "1""2""3""4""5""6""7""8""9""0"
  7.     "1""2""3""4""5""6""7""8""9""0" 
  8. ]; 
  9. let arrMixed = [ 
  10.     1, "1""2"truefalsefalse, 1, 2, "2" 
  11. ]; 
  12.  
  13. arrNum = Array.from(new Set(arrNum)); 
  14. arrString = [...new Set(arrString)]; 
  15. arrMixed = [...new Set(arrMixed)]; 
  16.  
  17. console.log(arrNum); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 0] 
  18. console.log(arrString); // ["1""2""3""4""5""6""7""8""9""0"
  19. console.log(arrMixed); // [1, "1""2"truefalse, 2] 

 

 

5个能提高前端工作效率的骚操作

 

引用类型数组

 

  1. let arrObj = [ 
  2.     {name"何方"}, 
  3.     {name"王二"}, 
  4.     {name"何方"}, 
  5.     {name"何方"}, 
  6.     {name"何方"}, 
  7.     {name"何方"}, 
  8.     {name"王二"}, 
  9.     {name"王二"}, 
  10.     {name"王二"}, 
  11.     {name"王二"}, 
  12. ]; 
  13. let arrObj2 = []; 
  14. arrObj.forEach(item => { 
  15.     arrObj2.find(find => find.name === item.name) || arrObj2.push(item) 
  16. }); 
  17. console.log(arrObj2); 

 

 

5个能提高前端工作效率的骚操作