给个思路，以下代码怎么优化（if-else）

Question

export const fillValueToPanel = (target, resouce, isRate = false) => {
    Object.keys(target).forEach(key => {
        let val;
        if (key != 'deviation' && key != 'deviationRate') {
            if (!isRate) {
                val = resouce[key].toLocaleString()
            } else {
                val = signFigures(resouce[key] * 100) + ' %'
            }
        } else if (key == 'deviationRate') {
            val = signFigures(resouce[key] * 100) + ' %'
        } else {
            val = resouce[key].toLocaleString()
        }
        target[key].value = val
    });
}

Answer 1

感觉不是优化if-else，而是优化怎么组织代码。
target[key].value的取值来源是signFigures(resouce[key] * 100) + ' %' 或者resouce[key].toLocaleString()，结果写了一坨流水式代码。

const fillValueToPanel = (target, resouce, isRate = false) => {
    Object.keys(target).forEach(key => {
        target[key].value = key === 'deviationRate' || key !== 'deviation' && isRate
            ? signFigures(resouce[key] * 100) + ' %'
            : resouce[key].toLocaleString();
    });
}

Answer 2

参考上面myskies的回答，进一步简化一下：

export const fillValueToPanel = (target, resource, isRate = false) => {
    Object.keys(target).forEach(key => {
        target[key].value = (key !== 'deviation' && isRate) ? `${signFigures(resource[key] * 100)} %` : resource[key].toLocaleString()
    })
}

Answer 3

不知道你所谓的优化是指什么？
if else 效果也很好，逻辑清晰，可读性很高

export const fillValueToPanel = (target, resource, isRate = false) => {
    Object.keys(target).forEach(key => {
        let val = resource[key].toLocaleString() ;
        if( key=='deviationRate' || (key!='deviation' && isRate) ){
            val = signFigures(resouce[key] * 100) + ' %';
        }
        target[key].value = val;
    }
}

或者

export const fillValueToPanel = (target, resource, isRate = false) => {
    Object.keys(target).forEach(key => {
        target[key].value = ( key=='deviationRate' || (key!='deviation' && isRate) )?( signFigures(resouce[key] * 100) + ' %' ):( resource[key].toLocaleString() );
    }
}

Answer 4

export const fillValueToPanel = (target, resouce, isRate = false) => {
    let val;
    
    if (key !== 'deviation' && isRate) {
      val = signFigures(resouce[key] * 100) + ' %';
    } else {
      val = resouce[key].toLocaleString();
    }

    target[key].value = val;
}

Answer 5

Object.keys(target).forEach(key => {
  target[key].value = 
    key == 'deviationRate' || key != 'deviation' && key != 'deviationRate' && isRate ?
    signFigures(resouce[key] * 100) + ' %' : 
    resouce[key].toLocaleString();
});

Answer 6

export const fillValueToPanel = (target, resouce, isRate = false) =>{
    Object.keys(target).forEach(key =>{
        let val;
        if(key != 'deviation' && key != 'deviationRate'){
            !isRate?val = resouce[key].toLocaleString():val = signFigures(resouce[key] * 100) + ' %'
        }else if(key == 'deviationRate'){
            val = signFigures(resouce[key] * 100) + ' %'
        }else{
            val = resouce[key].toLocaleString()
        }
        target[key].value = val
    })
}

Answer 7

Object.keys(target).forEach(key =>{
    const typeString = resouce[key].toLocaleString()
    const typeSign = signFigures(resouce[key] * 100) + ' %'
    switch(key) {
        case 'deviation':
            val = typeString
            break
        case 'deviationRate':
            val = typeSign
            break
        default:
            val = isRate ? typeSign : typeString
            break
    }
})