JavaScript   发布时间:2022-04-16  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了js中如何完美的解析数据大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。

自从有了前后端分离,一些后端小伙伴给出的数据结构也来越混乱了。以为分离减轻了他们的负担接口的质量会非常高但是人的惰性却体现的很“完美”。

由于js是若类型的语言,所以在使用数据的时候经常会出现这个几个错误

而这些异常很难发现,及时发上线了都不一定能发现。因为这些问题都是由于数据异常导致的。如果优雅的解决或者说避免这些问题影响到用户体验呢?

// 第二种,感谢es6
let {country={area:{city:{name:'你没名字'}}}} = user;
这个感觉也不是很好的解决方案

// 第三种,利用reduce构建一个解析函数
function getValue(obj,key){
return key.split('.').reduce(function(o,k){
// o,当前对象
// key,数组下一个元素
if((typeof o === 'undefined' || o === null)){
return k.indexOf('[array]') !== -1?[]:o
}else{
return k.indexOf('[array]') !== -1?(o[k.replace('[array]','')]||[]):o[k]
}
},obj)
}

let user1;

let user2 = {

}

let user3 = {
country:{
area:{
city:{
name:'12312'
}
}
}
}
let user4 = {
country:[
{
city:{
name:'12312'
}
}
]
}

let user5 = {
country:{
city:[1,2,3]
}
}

console.log(getValue(user1,'country.area.city.name'))

console.log(getValue(user2,'country.area.city.name'))

console.log(getValue(user3,'country.area.city.name'))

console.log(getValue(user5,'country.city[array]'))
console.log(getValue(user5,'country.city[array].1'))
console.log(getValue(user5,'country.city[array].10'))
console.log(getValue(user5,'country.city[array].1.name'))
console.log(getValue(user5,'country.city[array].persion[array]'))

// 输出结果
undefined
undefined
"12312"
[1,3]
2
undefined
undefined
[]

代码测试:https://jsbin.com/zoberem/edit?js,console

最后关于前端异常上报,这是一个很大的研究方向,市面上也有一些解决方案,但是真正推广的我目前没发现。

大佬总结

以上是大佬教程为你收集整理的js中如何完美的解析数据全部内容,希望文章能够帮你解决js中如何完美的解析数据所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。
标签: