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 相关文章推荐
IE/FireFox具备兼容性的拖动代码
Aug 13 Javascript
SyntaxHighlighter代码加色使用方法
Sep 07 Javascript
JQuery 实现在同一页面锚点链接之间的平滑滚动
Oct 29 Javascript
如何处理JSON中的特殊字符
Nov 30 Javascript
jquery实现转盘抽奖功能
Jan 06 Javascript
JavaScript Date对象应用实例分享
Oct 30 Javascript
微信小程序实现留言功能
Oct 31 Javascript
微信小程序封装分享与分销功能过程解析
Aug 13 Javascript
详解基于Vue/React项目的移动端适配方案
Aug 23 Javascript
js实现点击生成随机div
Jan 16 Javascript
JS实现简单移动端鼠标拖拽
Jul 23 Javascript
JavaScript的一些小技巧分享
Jan 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
PHP限制页面只能在微信自带浏览器访问的代码
2014/01/15 PHP
php中时间函数date及常用的时间计算
2017/05/12 PHP
yii 2.0中表单小部件的使用方法示例
2017/05/23 PHP
利用PHP如何统计Nginx日志的User Agent数据
2019/03/06 PHP
PHP开发api接口安全验证操作实例详解
2020/03/26 PHP
tp5.1 框架数据库-数据集操作实例分析
2020/05/26 PHP
用tip解决Ext列宽度不够的问题
2008/12/13 Javascript
javascrip客户端验证文件大小及文件类型并重置上传
2011/01/12 Javascript
基于BootStrap实现局部刷新分页实例代码
2016/08/08 Javascript
jQuery实现鼠标悬停3d菜单展开动画效果
2017/01/19 Javascript
神级程序员JavaScript300行代码搞定汉字转拼音
2017/05/20 Javascript
简单谈谈require模块化jquery和angular的问题
2017/06/23 jQuery
用JS实现简单的登录验证功能
2017/07/28 Javascript
解决Vue使用mint-ui loadmore实现上拉加载与下拉刷新出现一个页面使用多个上拉加载后冲突问题
2017/11/07 Javascript
深入理解webpack process.env.NODE_ENV配置
2020/02/23 Javascript
[02:02:38]VG vs Mineski Supermajor 败者组 BO3 第一场 6.6
2018/06/07 DOTA
[55:45]LGD vs OG 2019国际邀请赛淘汰赛 胜者组 BO3 第三场 8.24
2019/09/10 DOTA
Python实现脚本锁功能(同时只能执行一个脚本)
2017/05/10 Python
浅谈Python对内存的使用(深浅拷贝)
2018/01/17 Python
对Python 2.7 pandas 中的read_excel详解
2018/05/04 Python
pygame游戏之旅 按钮上添加文字的方法
2018/11/21 Python
Python使用os.listdir()和os.walk()获取文件路径与文件下所有目录的方法
2019/04/01 Python
Selenium+Python 自动化操控登录界面实例(有简单验证码图片校验)
2019/06/28 Python
Keras - GPU ID 和显存占用设定步骤
2020/06/22 Python
Numpy中np.random.rand()和np.random.randn() 用法和区别详解
2020/10/23 Python
html5如何及时更新缓存文件(js、css或图片)
2013/06/24 HTML / CSS
全球知名旅游社区法国站点:TripAdvisor法国
2016/08/03 全球购物
荷兰包包购物网站:The Little Green Bag
2018/03/17 全球购物
SOKOLOV官网:俄罗斯珠宝首饰品牌
2021/01/02 全球购物
在子网210.27.48.21/30种有多少个可用地址?分别是什么?
2014/07/27 面试题
法院四风对照检查材料思想汇报
2014/10/06 职场文书
2015年普法依法治理工作总结
2015/05/26 职场文书
2015秋季新学期开学寄语
2015/05/28 职场文书
基于Redis位图实现用户签到功能
2021/05/08 Redis
漫改真人电影「萌系男友是燃燃的橘色」公开先导视觉图
2022/03/21 日漫
码云(gitee)通过git自动同步到阿里云服务器
2022/12/24 Servers