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 相关文章推荐
Javascript中引用示例介绍
Feb 21 Javascript
node.js+Ajax实现获取HTTP服务器返回数据
Nov 26 Javascript
JS实现的生成随机数的4个函数分享
Feb 11 Javascript
JavaScript前补零操作实例
Mar 11 Javascript
深入解读JavaScript中的Iterator和for-of循环
Jul 28 Javascript
简要了解jQuery移动web开发的响应式布局设计
Dec 04 Javascript
JS简单实现String转Date的方法
Mar 02 Javascript
ichart.js绘制虚线、平均分虚线效果的实现代码
May 05 Javascript
jQuery多文件异步上传带进度条实例代码
Aug 16 Javascript
基于jstree使用AJAX请求获取数据形成树
Aug 29 Javascript
Vue-cli-webpack搭建斗鱼直播步骤详解
Nov 17 Javascript
ES6 Class中实现私有属性的一些方法总结
Jul 08 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中的注释、变量、数组、常量、函数应用介绍
2012/11/16 PHP
WordPress中is_singular()函数简介
2015/02/05 PHP
php实现的mongodb操作类
2015/05/28 PHP
php使用ftp远程上传文件类(完美解决主从文件同步问题的方法)
2016/09/23 PHP
php实现HTML实体编号与非ASCII字符串相互转换类实例
2016/11/02 PHP
使用Jquery Aajx访问WCF服务(GET、POST、PUT、DELETE)
2012/03/16 Javascript
nodejs教程 安装express及配置app.js文件的详细步骤
2013/05/11 NodeJs
js使用正则实现ReplaceAll全部替换的方法
2014/08/22 Javascript
纯css实现窗户玻璃雨滴逼真效果
2015/08/23 Javascript
ionic cordova一次上传多张图片(类似input file提交表单)的实现方法
2016/12/16 Javascript
详解能在多种前端框架下使用的表格控件
2017/01/11 Javascript
angular实现商品筛选功能
2017/02/01 Javascript
AngularJS实现根据不同条件显示不同控件
2017/04/20 Javascript
AngularJS中重新加载当前路由页面的方法
2018/03/09 Javascript
jQuery实现点击图标div循环放大缩小功能
2018/09/30 jQuery
微信小程序实现省市区三级地址选择
2020/06/21 Javascript
js计算最大公约数和最小公倍数代码实例
2019/09/11 Javascript
OpenLayers3实现图层控件功能
2020/09/25 Javascript
Python pickle类库介绍(对象序列化和反序列化)
2014/11/21 Python
Python的迭代器和生成器使用实例
2015/01/14 Python
python timestamp和datetime之间转换详解
2017/12/11 Python
Python读取MRI并显示为灰度图像实例代码
2018/01/03 Python
python处理csv数据动态显示曲线实例代码
2018/01/23 Python
Python matplotlib绘制饼状图功能示例
2019/09/10 Python
Python 矩阵转置的几种方法小结
2019/12/02 Python
python为什么要安装到c盘
2020/07/20 Python
Python实现区域填充的示例代码
2021/02/03 Python
Html5饼图绘制实现统计图的方法
2020/08/05 HTML / CSS
德国运动营养和健身网上商店:Myprotein.de
2018/07/18 全球购物
俄罗斯汽车零件和配件在线商店:CarvilleShop
2019/11/29 全球购物
英国豪华装饰照明品牌的在线零售商:Inspyer Lighting
2019/12/10 全球购物
商场活动策划方案
2014/01/24 职场文书
计划生育标语
2014/06/23 职场文书
2014年招生工作总结
2014/11/26 职场文书
社区植树节活动总结
2015/02/06 职场文书
如何有效防止sql注入的方法
2021/05/25 SQL Server