大佬们遇到过这个问题吗？如何理解map中的三目运算表达式

Question

我的代码：
constcountBy=(arr,fn)=>arr.map(val=>(typeoffn==='function'?fn(val):val[fn]))
高手的代码：
constcountBy=(arr,fn)=>arr.map(typeoffn==='function'?fn:val=>val[fn])
测试代码：
console.log(countBy([1,2,3,4,5,6],a=>a%3))
console.log(countBy([6.8,4.2,6.1],Math.floor))
console.log(countBy(['one','two','three'],'length'))
发现居然是等效的！那高手的typeoffn==='function'?fn:val=>val[fn]这句怎么理解？如果fn是函数，val[fn]有意义吗？箭头函数前面不传入val,箭头后面居然也能用val!

Answer 1

他这是把你里面的判断给提到外面来了map接收一个函数用三目先判断fn的类型是函数就可以直接用，参数是默认传入的不是函数就包裹一层

Answer 2

不要把简单的问题想成复杂化。map接受一个函数，你传具名函数也好，或者平时习惯性写的匿名箭头函数也好；本质上就是在循环中给每个可迭代元素进行函数调用，传入三个参数。我觉得你把每个过程都保存到一个变量中就很好理解了，就像代码简洁是一个优点，但过度简洁反而会破坏代码可读性。constcountBy=(arr,fn)=>{//如果fn是一个函数，那就使用这个函数。//不是的话设置一个默认函数，就认为数组是一个对象数组，fn也就是对象的key//返回对象数组中的指定key值constcallback=typeoffn==='function'?fn:val=>val[fn]returnarr.map(callback);}