快捷導(dǎo)航

JS實(shí)現(xiàn)的駝峰式和連字符式轉(zhuǎn)換功能分析

更新時(shí)間：2016年12月21日 15:20:21 作者：trace332

這篇文章主要介紹了JS實(shí)現(xiàn)的駝峰式和連字符式轉(zhuǎn)換功能,結(jié)合實(shí)例形式分析了JS實(shí)現(xiàn)字符串的駝峰式與連接符式轉(zhuǎn)換的實(shí)現(xiàn)技巧,涉及js字符串遍歷、轉(zhuǎn)換及正則表達(dá)式相關(guān)操作方法,需要的朋友可以參考下

本文實(shí)例講述了JS實(shí)現(xiàn)的駝峰式和連字符式轉(zhuǎn)換功能。分享給大家供大家參考，具體如下：

在網(wǎng)上找的這段,比較喜歡

1.駝峰轉(zhuǎn)連字符:

var s = "fooStyleCss";
s = s.replace(/([A-Z])/g,"-$1").toLowerCase();
//利用正則進(jìn)行替換,簡(jiǎn)潔明了,很棒

2.轉(zhuǎn)駝峰

var s1 = "foo-style-css";
s1 = s1.replace(//-(/w)/g, function(all, letter){
 return letter.toUpperCase();
});

這段2看的不是很明白

于是自己寫一個(gè),^_^,這個(gè)很容易懂吧,就是代碼多了點(diǎn);

var s = "style-sheet-base";
var a = s.split("-");
var o = a[0];
for(var i=1;i<a.length;i++){
  o = o + a[i].slice(0,1).toUpperCase() + a[i].slice(1);
}

再寫一個(gè),這次用正則:

var s1 = "style-sheet-base";
s1 = s1.replace(//-(/w)/g, function(x){return x.slice(1).toUpperCase();});

哈哈,有意思吧

PS：這里再為大家提供2款非常方便的正則表達(dá)式工具供大家參考使用：

JavaScript正則表達(dá)式在線測(cè)試工具：
http://tools.jb51.net/regex/javascript

正則表達(dá)式在線生成工具：
http://tools.jb51.net/regex/create_reg

更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《JavaScript替換操作技巧總結(jié)》、《JavaScript查找算法技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》、《JavaScript中json操作技巧總結(jié)》、《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)》

希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。

您可能感興趣的文章:

相關(guān)文章

javascript實(shí)現(xiàn) 在光標(biāo)處插入指定內(nèi)容
javascript實(shí)現(xiàn) 在光標(biāo)處插入指定內(nèi)容...
2007-05-05
Three.js如何用軌跡球插件（trackball）增加對(duì)模型的交互功能詳解
這篇文章主要給大家介紹了關(guān)于Three.js如何用軌跡球插件，也就是trackball增加對(duì)模型的交互功能的相關(guān)資料，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面來(lái)一起看看吧。
2017-09-09
跟我學(xué)習(xí)javascript的定時(shí)器
跟我學(xué)習(xí)javascript的定時(shí)器，告訴大家具體的使用方法，并向大家提出了一個(gè)消息要求，制作一個(gè)定時(shí)器，有沒有朋友感興趣，挑戰(zhàn)一下
2015-11-11
Bootstrap table 服務(wù)器端分頁(yè)功能實(shí)現(xiàn)方法示例
這篇文章主要介紹了Bootstrap table 服務(wù)器端分頁(yè)功能實(shí)現(xiàn)方法,結(jié)合實(shí)例形式詳細(xì)分析了Bootstrap table 服務(wù)器端后臺(tái)交互與分頁(yè)功能相關(guān)操作技巧,需要的朋友可以參考下
2020-06-06
JS畫圖(非VML)--兼容IE/FF
JS畫圖(非VML)--兼容IE/FF...
2006-12-12
JS延遲加載的幾種方式小結(jié)
JS延遲加載,也就是等頁(yè)面加載完成之后再加載 JavaScript 文件,JS延遲加載有助于提高頁(yè)面加載速度,本文小編給大家介紹了JS延遲加載的幾種方式小結(jié),感興趣的小伙伴跟著小編一起來(lái)看看吧
2024-08-08
select自定義小三角樣式代碼（實(shí)用總結(jié)）
這篇文章主要介紹了select自定義小三角樣式，通過(guò)css HTML js 代碼詳細(xì)展示了操作過(guò)程，自定義小三角樣式，也可以做出select文字居中的效果,需要的朋友可以參考下
2017-08-08
JavaScript中常見的數(shù)據(jù)類型判斷方法小結(jié)
在?JS?編程中,正確判斷數(shù)據(jù)類型是必備技能,也是面試常問的內(nèi)，本文將探討四種常用的數(shù)據(jù)類型判斷方法，通過(guò)了解它們的特點(diǎn)和適用范圍,能夠更好地處理不同數(shù)據(jù)類型的情況,避免出現(xiàn)錯(cuò)誤和提升代碼質(zhì)量,需要的朋友可以參考下
2023-06-06
js中hash和ico的關(guān)聯(lián)分析
這篇文章主要介紹了js中hash和ico的關(guān)聯(lián)分析,以實(shí)例形式分析了location.hash與ico的加載順序關(guān)系,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
2015-02-02
antd項(xiàng)目實(shí)現(xiàn)彩蛋效果的詳細(xì)代碼
這篇文章主要介紹了antd項(xiàng)目如何實(shí)現(xiàn)彩蛋效果,首先在components目錄下創(chuàng)建Transform目錄，包括index.css、index.js，index.js是主要的邏輯代碼，下面對(duì)代碼進(jìn)行分析，需要的朋友可以參考下
2022-09-09