zoukankan      html  css  js  c++  java
  • 前端知识小总结

    1. 类型强制转换
    1.1.1 string强制转换为数字

    a = '32' * 1 
    a = '32' / 1 
    a = + '32' 


    1.1.2 数字强制转换为string

    a = 32 + ''
    a = String(32)
    a = (32).toString()

    1.2 使用Boolean过滤数组中的所有假值
    1.2.1

    const compact = arr => arr.filter(Boolean)
    compact([0, 1, false, 2, '', 3, 'a', 'e' * 23, NaN, 's', 34])

    同下

    [0, 1, false, 2, '', 3, 'a', 'e' * 23, NaN, 's', 34].filter(ite=>{return ite})

    1.3 三元运算符

    let s = a ? 'a为true' : 'a为false';

    1.4 短路运算符

    let param1 = expr1 && expr2
    let param2 = expr1 || expr2

    1.6 取整 | 0

    1.3 | 0 // 1
    -1.9 | 0 // -1

    1.7 判断奇偶数 & 1

    const num=3;
    !!(num & 1)    // true
    !!(num % 2)    // true

    2. 函数
    2.1 函数默认值

    func = (l, m = 3, n = 4 ) => (l * m * n);
    func(2) //output: 24

    2.2 强制参数

    mandatory = ( ) => {
      throw new Error('Missing parameter!');
    }
    foo = (bar = mandatory( )) => { // 这里如果不传入参数,就会执行manadatory函数报出错误
      return bar;
    }

    2.3 惰性载入函数,或者称为一次性函数,只执行一次便会被其子函数覆盖
    第一次运行之后就会覆写这个方法,下一次再运行的时候就不会执行判断了。当然现在只有一个判断,如果判断很多,分支比较复杂,那么节约的资源还是可观的。

    function foo(a,b){
      console.log(1)
      if(a !== b){
        console.log('aaa')
      }else{
        console.log('bbb')
      }
    }

    // 优化后

    function foo(a,b){
      console.log(2)
      if(a != b){
        foo = function(){
          console.log('aaa')
        }
      }else{
        foo = function(){
          console.log('bbb')
        }
      }
      return foo();
    }
    function foo(a,b){
      console.log(2)
      foo = function(){
        console.log('3')
      }
      return foo();
    }

    3. 代码复用
    3.1 Object [key]
    简化示例(原)

    function validate(values) {
      if(!values.first)
        return false;
      if(!values.last)
        return false;
      return true;
    }
    console.log(validate({first:'Bruce',last:'Wayne'})); // true
    (新)
    const validate = (schema, values) => {
    for(field in schema) {
      if(schema[field].required) {
        if(!values[field]) {
          return false;
        }
      }
    }
    return true;
    }
    console.log(validate({first:'Bruce',last:'Wayne'}, {first:'Bruce',last:''})); // false
    console.log(validate({first:'Bruce',last:'Wayne'}, {first:'Bruce',last:'Wayne'})); // true

    4. 数字
    4.1 精确到指定位数的小数

    const round = (n, decimals = 0) => Number(`${Math.round(`${n}e${decimals}`)}e-${decimals}`)
    round(1.345, 2) // 1.35

    4.2 数字补0操作

    const addZero2 = (num, len = 2) => (`${num}`).padStart(len , '0')
    addZero2(32,4) // 0032

    4.3 保留小数点后n位小数

    (12.34567).toFixed(2) //12.35

    5. 数组
    5.1 使用解构来交换参数数值

    [param1, param2] = [param2, param1];

    1. //添加‘,’号

    1.1添加任意位置‘,’号分割

    function getCorrect(v,n=3){
       return (v + '').length > n ? v.replace(/(d{n})/g,function (m,m1) { return m1 + ','; }) : v
    }

    1.2数字千分位分割

    function getCorrect(v) {
        return parseInt(v).toLocaleString();
    }

     

  • 相关阅读:
    ABAP-FI-Redirection of read accesses from ANEA to FAAV_ANEA failed
    招聘
    五分钟教你在长沙如何找到靠谱的驾校和教练(长沙找驾校)
    数组哪些方法能改变原数组,以及循环改变数组的情况
    FXGL游戏开发-JavaFX游戏框架
    tempermonkey.d.ts | 油猴函数类型
    post导出文件
    mescroll.js 使用
    查看托管应用池用法
    IDEA配置
  • 原文地址:https://www.cnblogs.com/zhenchaojia123/p/13129711.html
Copyright © 2011-2022 走看看