亚洲乱色熟女一区二区三区丝袜,天堂√中文最新版在线,亚洲精品乱码久久久久久蜜桃图片,香蕉久久久久久av成人,欧美丰满熟妇bbb久久久

LOGO OA教程 ERP教程 模切知識(shí)交流 PMS教程 CRM教程 開(kāi)發(fā)文檔 其他文檔  
 
網(wǎng)站管理員

5 個(gè)提高你工作效率的 JavaScript 實(shí)用程序庫(kù)

admin
2024年10月13日 22:49 本文熱度 1560

?

英文 | https://javascript.plainenglish.io/5-javascript-utility-libraries-to-improve-your-efficiency-d49e53c5c936


前言
作為一名前端開(kāi)發(fā)人員,我通過(guò)這些 JavaScript 庫(kù)極大地提高了自己的效率,比如格式化日期、處理 URL 參數(shù)、調(diào)試移動(dòng)網(wǎng)頁(yè)等。因此,我想和你們分享這些內(nèi)容,希望也能幫助到您。
1.使用“Day.js”格式化日期和時(shí)間
網(wǎng)址:https://day.js.org/en/
作為一名開(kāi)發(fā)人員,我厭倦了在 JavaScript 中操作日期和時(shí)間,因?yàn)樗闊┝恕?/span>
例如,當(dāng)我們想要打印當(dāng)前的日期和時(shí)間時(shí),我們需要編寫(xiě)一大段代碼來(lái)完成。
const getDate = () => {  const fillZero = (t) => {    return t < 10 ? `0${t}` : t  }  const d = new Date()  const year = d.getFullYear()  const month = fillZero(d.getMonth() + 1)  const day = fillZero(d.getDate())  const hour = fillZero(d.getHours())  const minute = fillZero(d.getMinutes())  const second = fillZero(d.getSeconds())
 return `${year}-${month}-${day} ${hour}:${minute}:${second}`}console.log(getDate()) // 2022-05-09 07:19:14

幸運(yùn)的是,使用 Day.js 只需一行代碼即可完成。

console.log(dayjs().format('YYYY-MM-DD HH:mm:ss')) // 2022-05-09 07:19:14

注意:“Day.js 是一個(gè)極簡(jiǎn)主義 JavaScript 庫(kù),它通過(guò)與 Moment.js 兼容的 API 來(lái)解析、驗(yàn)證、操作和顯示現(xiàn)代瀏覽器的日期和時(shí)間。如果您使用 Moment.js,您就已經(jīng)知道如何使用 Day.js?!?/span>

2.使用“qs.js”格式化URL參數(shù)

網(wǎng)址:https://github.com/ljharb/qs

您是否經(jīng)常需要獲取“URL”參數(shù)?也許你會(huì)寫(xiě)一個(gè)這樣的函數(shù)。

const formatSearch = () => {  window.location.search.slice(1).split('&').reduce((res, it) => {    const [ key, value ] = it.split('=')    res[ key ] = value    return res  }, {})}// https://medium.com?name=fatfish&age=100const search = formatSearch() // { name: 'fatfish', age: 100 }// use qs.js to formatconst search2 = qs.parse(window.location.search.slice(1)) // { name: 'fatfish', age: 100 }

太棒了,但現(xiàn)在您有一個(gè)新功能要實(shí)現(xiàn)。請(qǐng)?jiān)凇癶ttps://medium.com”中添加姓名和年齡兩個(gè)參數(shù)

// 1. url = https://medium.com// 2. params = { name: 'fatfish', age: 100 }const splitSearch = (url, params) => {  const search = Object.entries(params).map((it) => it.join('=')).join('&')  return `${url}?${search}`}const url = 'https://medium.com'const params = { name: 'fatfish', age: 100 }console.log(splitSearch(url, params)) // https://medium.com?name=fatfish&age=100// use qs.js to stringify urlconsole.log(`${url}?${qs.stringify(params)}`) // https://medium.com?name=fatfish&age=100

3.使用“js-cookie.js”讀寫(xiě)cookie

網(wǎng)址:https://github.com/js-cookie/js-cookie

我們都知道在 JavaScript 中操作 cookie 并不是一件簡(jiǎn)單的事情,為了提高您的工作效率我強(qiáng)烈推薦“js-cookie.js”,它是一個(gè)簡(jiǎn)單、輕量級(jí)的用于處理 cookie 的 JavaScript API。

Cookies.set('name''fatfish', { expires: 10 })Cookies.get('name') // fatfish

4. 為什么選擇Lodash?

網(wǎng)址:https://github.com/lodash/lodash

我們看一下Lodash的介紹:

Lodash 消除了處理數(shù)組、數(shù)字、對(duì)象、字符串等的麻煩,使 JavaScript 變得更容易。Lodash 的模塊化方法非常適合:

  • 迭代數(shù)組、對(duì)象和字符串

  • 操縱和測(cè)試值

  • 創(chuàng)建復(fù)合函數(shù)

// 1. Flatten the array_.flattenDeep([ 1, [ 2, [ 3, [  4, [ 5 ]] ] ] ]) // [1, 2, 3, 4, 5]// 2. More convenient object traversal_.each({ name: 'fatfish', age: 100 }, (val, key) => {  console.log(val, key)   // fatfish name  // 100 'age'})// 3. ...

5、使用“Vconsole”在移動(dòng)端調(diào)試網(wǎng)頁(yè)

網(wǎng)址:https://github.com/Tencent/vConsole

在移動(dòng)設(shè)備上調(diào)試網(wǎng)頁(yè)非常困難,但是有了“Vconsole”一切都會(huì)變得容易得多。我們可以通過(guò)掃描這個(gè)二維碼或者點(diǎn)擊網(wǎng)址來(lái)體驗(yàn)它的功能。

TIP:與chrome瀏覽器的devtools類(lèi)似,Vconsole提供了以下功能來(lái)幫助您更好地調(diào)試網(wǎng)頁(yè)

  • 日志:console.log|信息|錯(cuò)誤|...

  • 網(wǎng)絡(luò):XMLHttpRequest、Fetch、sendBeacon

  • 元素:HTML 元素樹(shù)

  • 存儲(chǔ):Cookie、本地存儲(chǔ)、會(huì)話存儲(chǔ)

  • 手動(dòng)執(zhí)行JS命令

  • 自定義插件


寫(xiě)在最后

以上就是我今天想與你分享的全部?jī)?nèi)容,希望這些內(nèi)容對(duì)你有所幫助,最后,感謝您的閱讀,祝編程愉快!


該文章在 2024/10/14 10:33:04 編輯過(guò)
關(guān)鍵字查詢(xún)
相關(guān)文章
正在查詢(xún)...
點(diǎn)晴ERP是一款針對(duì)中小制造業(yè)的專(zhuān)業(yè)生產(chǎn)管理軟件系統(tǒng),系統(tǒng)成熟度和易用性得到了國(guó)內(nèi)大量中小企業(yè)的青睞。
點(diǎn)晴PMS碼頭管理系統(tǒng)主要針對(duì)港口碼頭集裝箱與散貨日常運(yùn)作、調(diào)度、堆場(chǎng)、車(chē)隊(duì)、財(cái)務(wù)費(fèi)用、相關(guān)報(bào)表等業(yè)務(wù)管理,結(jié)合碼頭的業(yè)務(wù)特點(diǎn),圍繞調(diào)度、堆場(chǎng)作業(yè)而開(kāi)發(fā)的。集技術(shù)的先進(jìn)性、管理的有效性于一體,是物流碼頭及其他港口類(lèi)企業(yè)的高效ERP管理信息系統(tǒng)。
點(diǎn)晴WMS倉(cāng)儲(chǔ)管理系統(tǒng)提供了貨物產(chǎn)品管理,銷(xiāo)售管理,采購(gòu)管理,倉(cāng)儲(chǔ)管理,倉(cāng)庫(kù)管理,保質(zhì)期管理,貨位管理,庫(kù)位管理,生產(chǎn)管理,WMS管理系統(tǒng),標(biāo)簽打印,條形碼,二維碼管理,批號(hào)管理軟件。
點(diǎn)晴免費(fèi)OA是一款軟件和通用服務(wù)都免費(fèi),不限功能、不限時(shí)間、不限用戶(hù)的免費(fèi)OA協(xié)同辦公管理系統(tǒng)。
Copyright 2010-2025 ClickSun All Rights Reserved