js对象属性名驼峰式转下划线的实例代码


Posted in Javascript onSeptember 17, 2020

一、题目示例:

思路:

1、匹配属性名字符串中的大写字母和数字

2、通过匹配后的lastIndex属性获取匹配到的大写字母和数字的位置

3、判断大写字母的位置是否为首位置以及lastIndex是否为0,为0则表示匹配结束

4、将存放位置的数组进行从小到大排序,排序后将属性名按照字符串的slice方法切割并使用下划线重组

5、遍历对象的属性名并使用函数改变为新的命名,从新赋值到新的对象上(也可以使用改变对象的ES6新语法)

6、注意,每次在调用函数后,需要清空之前存放位置的数组

js对象属性名驼峰式转下划线的实例代码

二、实现代码

let obj = {Id1: 1, idName1: 2, idAgeName1: 3};
let arr = []
function strReplace(str) {
  const UP_CASE_REG =/[A-Z]/g;
  const NUMBER_REG=/[A-Za-z][\d]/g
  let newstr = ""
  getIndex(UP_CASE_REG, str)
  getIndex(NUMBER_REG, str)
  arr.sort((a,b)=> a-b )
  for(let i = 0;i < arr.length; i ++) {
    if(i === 0) {
      newstr += str.slice(0,arr[i]) + "_"
    }
    else {
      newstr += str.slice(arr[i-1],arr[i]) + "_"
    }
  }
  newstr += str.slice(arr[arr.length-1])
  return newstr.toLowerCase()
}
function getIndex(reg, str) {
  do{
    reg.test(str)
    if(reg.lastIndex !== 0 && reg.lastIndex-1 !== 0){//reg.lastIndex-1 !== 0判断首字母是否大写
      arr.push(reg.lastIndex-1)
    }
  }while(reg.lastIndex > 0)
}
 
function strAllReplace(obj) {
  let newObj = {}
  Object.entries(obj).forEach(([key, value]) =>
  {
   newObj[strReplace(key)] = value
   arr = []
  })
  return newObj
}
console.log(strAllReplace(obj))//{id_1: 1, id_name_1: 2, id_age_name_1: 3}

js对象属性名驼峰式转下划线的实例代码

补充知识:JavaScript 对象部署 Iterator 接口

如下所示:

const name = {
      first:"hello",
      last:"world",
      fullname: "hello world"
    }

方式一、Object.keys

for (var i of Object.keys(name)) {
        console.log(i,"-",name[i])
      }

js对象属性名驼峰式转下划线的实例代码

方法二、Object.keys + Generator

function *map(item) {
      for (var i of Object.keys(item)) {
        yield [i,item[i]]
      }
    }
    for(var [key, value] of map(name)) {
      console.log(key,"-",value)
    }

js对象属性名驼峰式转下划线的实例代码

注:generator函数中不能使用箭头函数

例:

*map = (item) => {
      for (var i of Object.keys(item)) {
        yield [i,item[i]]
      }
    }

js对象属性名驼峰式转下划线的实例代码

以上这篇js对象属性名驼峰式转下划线的实例代码就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js 格式化时间日期函数小结
Mar 20 Javascript
基于jQuery实现的Ajax 验证用户名是否存在的实现代码
Apr 06 Javascript
javascript中的3种继承实现方法
Jan 27 Javascript
JavaScript对象数组排序实例方法浅析
Jun 15 Javascript
AngularJS优雅的自定义指令
Jul 01 Javascript
Javascript实现跨域后台设置拦截的方法详解
Aug 04 Javascript
超级简易的JS计算器实例讲解(实现加减乘除)
Aug 08 Javascript
简单介绍react redux的中间件的使用
Apr 06 Javascript
vue 做移动端微信公众号采坑经验记录
Apr 26 Javascript
element ui 表格动态列显示空白bug 修复方法
Sep 04 Javascript
JS/CSS实现字符串单词首字母大写功能
Sep 03 Javascript
vue-路由精讲 二级路由和三级路由的作用
Aug 06 Javascript
详细分析JavaScript中的深浅拷贝
Sep 17 #Javascript
js实现鼠标滑动到某个div禁止滚动
Sep 17 #Javascript
原生js+css实现tab切换功能
Sep 17 #Javascript
vue使用screenfull插件实现全屏功能
Sep 17 #Javascript
Vue使用screenfull实现全屏效果
Sep 17 #Javascript
详解JavaScript中的数据类型,以及检测数据类型的方法
Sep 17 #Javascript
JavaScript编码小技巧分享
Sep 17 #Javascript
You might like
如何让CI框架支持service层
2014/10/29 PHP
php相对当前文件include其它文件的方法
2015/03/13 PHP
PHP中file_put_contents追加和换行的实现方法
2017/04/01 PHP
PHP 实现手机端APP支付宝支付功能
2018/06/07 PHP
(仅IE下有效)关于checkbox 三态
2007/05/12 Javascript
javascript 贪吃蛇实现代码
2008/11/22 Javascript
点击进行复制的JS代码实例
2013/08/23 Javascript
表单元素与非表单元素刷新区别详细解析
2013/11/06 Javascript
快速解决FusionCharts联动的中文乱码问题
2013/12/04 Javascript
js图片延迟技术一般的思路与示例
2014/03/20 Javascript
JavaScript静态类型检查工具FLOW简介
2015/01/06 Javascript
JS基于面向对象实现的放烟花效果
2015/05/07 Javascript
理解JavaScript的变量的入门教程
2015/07/07 Javascript
简单实现限制uploadify上传个数
2015/11/16 Javascript
jQuery实现div随意拖动的实例代码(通用代码)
2016/01/28 Javascript
深入理解jquery中的each用法
2016/12/14 Javascript
node安装--linux下的快速安装教程
2017/03/21 Javascript
使用Webpack提高Vue.js应用的方式汇总(四种)
2017/07/10 Javascript
requireJS模块化实现返回顶部功能的方法详解
2017/10/16 Javascript
原生JS实现的碰撞检测功能示例
2018/05/18 Javascript
微信小程序常用简易小函数总结
2019/02/01 Javascript
Layui tree 下拉菜单树的实例代码
2019/09/21 Javascript
JavaScript实现点击出现子菜单效果
2021/02/08 Javascript
[01:06]DOTA2小知识课堂 Ep.01 TP出门不要忘记帮队友灌瓶哦
2019/12/05 DOTA
Python实现PS滤镜的旋转模糊功能示例
2018/01/20 Python
Python Numpy计算各类距离的方法
2019/07/05 Python
django重新生成数据库中的某张表方法
2019/08/28 Python
Python Pygame实现俄罗斯方块
2021/02/19 Python
Shell编程面试题
2012/05/30 面试题
烹调加工管理制度
2014/02/04 职场文书
大学毕业感言50字
2014/02/07 职场文书
九九重阳节标语
2014/10/07 职场文书
领导干部考核评语
2015/01/04 职场文书
投标邀请书范本
2015/02/02 职场文书
职场干货:简历中的自我评价应该这样写!
2019/05/06 职场文书
“爱眼护眼,提前预防近视”倡议书3篇
2019/10/30 职场文书