js對(duì)象屬性名駝峰式轉(zhuǎn)下劃線的實(shí)例代碼
一、題目示例:
思路:
1、匹配屬性名字符串中的大寫字母和數(shù)字
2、通過(guò)匹配后的lastIndex屬性獲取匹配到的大寫字母和數(shù)字的位置
3、判斷大寫字母的位置是否為首位置以及l(fā)astIndex是否為0,為0則表示匹配結(jié)束
4、將存放位置的數(shù)組進(jìn)行從小到大排序,排序后將屬性名按照字符串的slice方法切割并使用下劃線重組
5、遍歷對(duì)象的屬性名并使用函數(shù)改變?yōu)樾碌拿?,從新賦值到新的對(duì)象上(也可以使用改變對(duì)象的ES6新語(yǔ)法)
6、注意,每次在調(diào)用函數(shù)后,需要清空之前存放位置的數(shù)組
二、實(shí)現(xiàn)代碼
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}
補(bǔ)充知識(shí):JavaScript 對(duì)象部署 Iterator 接口
如下所示:
const name = { first:"hello", last:"world", fullname: "hello world" }
方式一、Object.keys
for (var i of Object.keys(name)) { console.log(i,"-",name[i]) }
方法二、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) }
注:generator函數(shù)中不能使用箭頭函數(shù)
例:
*map = (item) => { for (var i of Object.keys(item)) { yield [i,item[i]] } }
以上這篇js對(duì)象屬性名駝峰式轉(zhuǎn)下劃線的實(shí)例代碼就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
解決FireFox下[使用event很麻煩]的問(wèn)題
解決FireFox下[使用event很麻煩]的問(wèn)題...2006-11-11JavaScript獲取當(dāng)前運(yùn)行腳本文件所在目錄的方法
這篇文章主要介紹了JavaScript獲取當(dāng)前運(yùn)行腳本文件所在目錄的方法,涉及JavaScript文件目錄操作的相關(guān)技巧,需要的朋友可以參考下2016-02-02JS基于面向?qū)ο髮?shí)現(xiàn)的拖拽功能示例
這篇文章主要介紹了JS基于面向?qū)ο髮?shí)現(xiàn)的拖拽功能,涉及javascript面向?qū)ο笈c頁(yè)面元素動(dòng)態(tài)操作的相關(guān)技巧,需要的朋友可以參考下2016-12-12Canvas?drawImage方法實(shí)現(xiàn)圖片壓縮詳解
這篇文章主要為大家介紹了Canvas?drawImage方法實(shí)現(xiàn)圖片壓縮詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-11-11分享12個(gè)Webpack中常用的Loader(小結(jié))
這篇文章主要介紹了分享12個(gè)Webpack中常用的Loader(小結(jié)),文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2021-03-03prototype與__proto__區(qū)別詳細(xì)介紹
這篇文章主要介紹了prototype與__proto__區(qū)別詳細(xì)介紹的相關(guān)資料,需要的朋友可以參考下2017-01-01js移動(dòng)端事件基礎(chǔ)及常用事件庫(kù)詳解
這篇文章主要為大家詳細(xì)介紹了js移動(dòng)端事件基礎(chǔ)及常用事件庫(kù),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-08-08