前端項(xiàng)目開發(fā)中常用方法整理

業(yè)務(wù)開發(fā)中常用的方法整理芜茵,持續(xù)更新,后續(xù)打算打成npm包提供下載

1倡蝙、

2九串、獲取url中的某個(gè)參數(shù)

/**
 * @description 
 * @param {String} variable 要獲取的字段名稱
 */
export function getQueryVariable(variable) {
  // 普通url路由
  const query = window.location.search.substring(1)
  const vars = query.split('&')
  for (let i = 0; i < vars.length; i++) {
    const pair = vars[i].split('=')
    if (pair[0] === variable) {
      return pair[1]
    }
  }
  // hash路由
  const w = location.hash.indexOf('?')
  const hashQuery = location.hash.substring(w + 1)
  const hashVars = hashQuery.split('&')
  for (let i = 0; i < hashVars.length; i++) {
    const pair = hashVars[i].split('=')
    if (pair[0] === variable) {
      return pair[1]
    }
  }
  return undefined
}

3、駝峰轉(zhuǎn)下劃線

/**
 * @param data  需要轉(zhuǎn)換的數(shù)據(jù)
 * @returns {{}|*}
 */
export function objectHumpToLine(data) {
  if (typeof data != 'object' || !data) return data
  if (Array.isArray(data)) {
    return data.map(item => objectHumpToLine(item))
  }

  const newData = {}
  for (let key in data) {
    let newKey = key.replace(/([A-Z])/g, (p, m) => `_${m.toLowerCase()}`)
    newData[newKey] = objectHumpToLine(data[key])
  }
  return newData
}

4寺鸥、下劃線轉(zhuǎn)駝峰

/**
 * @param data 需要轉(zhuǎn)換的數(shù)據(jù)
 * @returns {{}|*}
 */
export function lineToCamel(data) {
  if (typeof data != 'object' || !data) return data
  if (Array.isArray(data)) {
    return data.map(item => lineToCamel(item))
  }

  const newData = {}
  for (let key in data) {
    let newKey = key.replace(/_([a-z])/g, (p, m) => m.toUpperCase())
    newData[newKey] = lineToCamel(data[key])
  }
  return newData
}

5猪钮、隨機(jī)生成數(shù)字

/**
 * 示例:生成長(zhǎng)度為 12 的隨機(jī)數(shù):randomNumber(12)
 * 示例:生成 3~23 之間的隨機(jī)數(shù):randomNumber(3, 23)
 *
 * @param1 最小值 | 長(zhǎng)度
 * @param2 最大值
 * @return int 生成后的數(shù)字
 */
export function randomNumber() {
  // 生成 最小值 到 最大值 區(qū)間的隨機(jī)數(shù)
  const random = (min, max) => {
    return Math.floor(Math.random() * (max - min + 1) + min)
  }
  if (arguments.length === 1) {
    let [length] = arguments
    // 生成指定長(zhǎng)度的隨機(jī)數(shù)字,首位一定不是 0
    let nums = [...Array(length)
      .keys()].map((i) => (i > 0 ? random(0, 9) : random(1, 9)))
    return parseInt(nums.join(''))
  } else if (arguments.length >= 2) {
    let [min, max] = arguments
    return random(min, max)
  } else {
    return Number.NaN
  }
}

6胆建、隨機(jī)生成字符串


/**
 * 隨機(jī)生成字符串
 * @param length 字符串的長(zhǎng)度
 * @param chats 可選字符串區(qū)間(只會(huì)生成傳入的字符串中的字符)
 * @return string 生成的字符串
 */
export function randomString(length, chats) {
  if (!length) length = 1
  if (!chats) chats = '0123456789qwertyuioplkjhgfdsazxcvbnm'
  let str = ''
  for (let i = 0; i < length; i++) {
    let num = randomNumber(0, chats.length - 1)
    str += chats[num]
  }
  return str
}

7烤低、深拷貝

// 深拷貝 主要解決數(shù)組里面有函數(shù)的
export function deepCopy(source) {
  if (!isObject(source)) return source //如果不是對(duì)象的話直接返回
  let target = Array.isArray(source) ? [] : {} //數(shù)組兼容
  for (var k in source) {
    if (source.hasOwnProperty(k)) {
      if (typeof source[k] === 'object') {
        target[k] = deepCopy(source[k])
      } else {
        target[k] = source[k]
      }
    }
  }
  return target
}
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市笆载,隨后出現(xiàn)的幾起案子扑馁,更是在濱河造成了極大的恐慌,老刑警劉巖凉驻,帶你破解...
    沈念sama閱讀 221,548評(píng)論 6 515
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件腻要,死亡現(xiàn)場(chǎng)離奇詭異,居然都是意外死亡涝登,警方通過查閱死者的電腦和手機(jī)雄家,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,497評(píng)論 3 399
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)胀滚,“玉大人趟济,你說(shuō)我怎么就攤上這事⊙柿” “怎么了顷编?”我有些...
    開封第一講書人閱讀 167,990評(píng)論 0 360
  • 文/不壞的土叔 我叫張陵,是天一觀的道長(zhǎng)褐荷。 經(jīng)常有香客問我勾效,道長(zhǎng),這世上最難降的妖魔是什么叛甫? 我笑而不...
    開封第一講書人閱讀 59,618評(píng)論 1 296
  • 正文 為了忘掉前任层宫,我火速辦了婚禮,結(jié)果婚禮上其监,老公的妹妹穿的比我還像新娘萌腿。我一直安慰自己,他們只是感情好抖苦,可當(dāng)我...
    茶點(diǎn)故事閱讀 68,618評(píng)論 6 397
  • 文/花漫 我一把揭開白布毁菱。 她就那樣靜靜地躺著米死,像睡著了一般。 火紅的嫁衣襯著肌膚如雪贮庞。 梳的紋絲不亂的頭發(fā)上峦筒,一...
    開封第一講書人閱讀 52,246評(píng)論 1 308
  • 那天,我揣著相機(jī)與錄音窗慎,去河邊找鬼物喷。 笑死,一個(gè)胖子當(dāng)著我的面吹牛遮斥,可吹牛的內(nèi)容都是我干的峦失。 我是一名探鬼主播,決...
    沈念sama閱讀 40,819評(píng)論 3 421
  • 文/蒼蘭香墨 我猛地睜開眼术吗,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼尉辑!你這毒婦竟也來(lái)了?” 一聲冷哼從身側(cè)響起较屿,我...
    開封第一講書人閱讀 39,725評(píng)論 0 276
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤隧魄,失蹤者是張志新(化名)和其女友劉穎,沒想到半個(gè)月后吝镣,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體堤器,經(jīng)...
    沈念sama閱讀 46,268評(píng)論 1 320
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,356評(píng)論 3 340
  • 正文 我和宋清朗相戀三年末贾,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了闸溃。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 40,488評(píng)論 1 352
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡拱撵,死狀恐怖辉川,靈堂內(nèi)的尸體忽然破棺而出洽糟,到底是詐尸還是另有隱情硫眯,我是刑警寧澤,帶...
    沈念sama閱讀 36,181評(píng)論 5 350
  • 正文 年R本政府宣布刹前,位于F島的核電站集索,受9級(jí)特大地震影響屿愚,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜务荆,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,862評(píng)論 3 333
  • 文/蒙蒙 一妆距、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧函匕,春花似錦娱据、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,331評(píng)論 0 24
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)忌穿。三九已至,卻和暖如春结啼,著一層夾襖步出監(jiān)牢的瞬間掠剑,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,445評(píng)論 1 272
  • 我被黑心中介騙來(lái)泰國(guó)打工郊愧, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留澡腾,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 48,897評(píng)論 3 376
  • 正文 我出身青樓糕珊,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親毅糟。 傳聞我的和親對(duì)象是個(gè)殘疾皇子红选,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,500評(píng)論 2 359

推薦閱讀更多精彩內(nèi)容