建站
咨詢
售后
建站咨詢
新聞中心
如果你想給專業(yè)開發(fā)人員留下深刻印象，你會做什么？很簡單：用簡單的邏輯和盡可能少的代碼行來解決一個復雜的問題。隨著 ES6 箭頭函數(shù)的引入，可以創(chuàng)建看起來優(yōu)雅而簡單的單行代碼。
創(chuàng)新互聯(lián)建站于2013年開始，公司以成都網(wǎng)站建設(shè)、成都網(wǎng)站制作、系統(tǒng)開發(fā)、網(wǎng)絡推廣、文化傳媒、企業(yè)宣傳、平面廣告設(shè)計等為主要業(yè)務，適用行業(yè)近百種。服務企業(yè)客戶近千家，涉及國內(nèi)多個省份客戶。擁有多年網(wǎng)站建設(shè)開發(fā)經(jīng)驗。為企業(yè)提供專業(yè)的網(wǎng)站建設(shè)、創(chuàng)意設(shè)計、宣傳推廣等服務。 通過專業(yè)的設(shè)計、獨特的風格，為不同客戶提供各種風格的特色服務。
在今天的文章中，我將與你一起來學習 11 個罕見但功能強大的單行代碼?，F(xiàn)在，準備好，讓我們開始吧！
1、獲取字符串中的字符數(shù)
獲取字符數(shù)是一個有用的實用程序，在許多情況下都很有用，我們可以使用它來獲取空格數(shù)和隨后的單詞數(shù)，或者這可用于獲取字符串中某個分隔符的計數(shù)。
const characterCount = (str, char) => str.split(char).length - 1
這個想法很簡單，我們使用傳遞的參數(shù) char 拆分字符串并獲取返回數(shù)組的長度。由于每次將字符串拆分，都會比拆分器多一個；所以減去 1，我們有一個 characterCount 單行。
2、檢查對象是否為空
檢查對象的空性實際上比看起來要困難得多，即使對象為空，每次檢查對象是否等于 {} 也會返回 false。
幸運的是，下面的單行代碼正是我們想要的。
const isEmpty = obj => Reflect.ownKeys(obj).length === 0 && obj.constructor === Object
在這一行中，我們檢查對象的鍵長度是否等于 0，以及傳遞的參數(shù)是否為實際對象。
3、等待一段時間再執(zhí)行
在這一行中，我們將通過一些異步編程來弄臟我們的代碼。這個想法很簡單，在運行代碼時，如果你想等待一定的時間，這里是等待單行：
const wait = async (milliseconds) => new Promise((resolve) => setTimeout(resolve, milliseconds));
在等待單行中，我們創(chuàng)建一個承諾并在給定的時間后使用 setTimeout 函數(shù)解決它。
4、 獲取兩個日期之間的日差
在開發(fā) Web 應用程序時，日期通常是實現(xiàn)起來最令人困惑的部分，因為有許多概念很容易被誤算。
這是一個強大的單線計算兩個日期之間的天差。但還有更多事情要做，正如我所做的那樣，你可以創(chuàng)建自己的單線來計算月、年差異等。
const daysBetween = (date1, date2) => Math.ceil(Math.abs(date1 - date2) / (1000 * 60 * 60 * 24))
這種單線背后的邏輯很容易理解。當兩個日期相減時，返回值是以毫秒為單位的差值，要將毫秒轉(zhuǎn)換為天，我們必須將其除以毫秒、秒、分鐘和小時。
5、重定向到另一個 URL
如果你曾經(jīng)創(chuàng)建過真實的網(wǎng)站，我敢肯定你遇到過身份驗證邏輯。例如，非管理員用戶不應該能夠訪問 /admin 路由。如果用戶嘗試，那么，你必須將其重定向到另一個 URL。
這個單線正是我上面提到的情況，但我認為你可以找到更多的用例。
const redirect = url => location.href = url
location 是全局窗口對象的方法，設(shè)置 href 屬性的行為與用戶單擊鏈接相同。
6、檢查設(shè)備上的觸摸支持
隨著可以連接到互聯(lián)網(wǎng)的設(shè)備越來越多，創(chuàng)建響應式網(wǎng)站的必要性也在增加。20 年前，開發(fā)者應該考慮網(wǎng)站的桌面版本，但今天超過 50% 的網(wǎng)絡流量來自觸摸移動設(shè)備。因此，基于設(shè)備的觸控支持采取一些行動是一個非常重要的概念。
const touchSupported = () => ('ontouchstart' in window || DocumentTouch && document instanceof DocumentTouch)在這一行中，我們正在檢查文檔是否支持 touchstart 事件。
7、 在元素后插入 HTML 字符串
開發(fā) Web 應用程序時，使用 JavaScript 更新 DOM 是一件很常見的事情。有一些基本的方法可以完成工作，但是，當情況變得復雜時，就很難克服。
這是一個在 HTML 元素之后立即注入 HTML 字符串的單行代碼。經(jīng)過幾分鐘的思考和谷歌搜索，我相信你可以找到這個單線的以前版本。
const insertHTMLAfter = (html, el) => el.insertAdjacentHTML('afterend', html)
8、隨機排列數(shù)組
在開發(fā)中打亂一組數(shù)據(jù)是一個常見的情況，你可以隨時遇到，不幸的是，JavaScript 中沒有內(nèi)置數(shù)組的 shuffle 方法。
但是，這里有一個你可以每天使用的 shuffle one-liner：
const shuffle = arr => arr.sort(() => 0.5 - Math.random())
它利用數(shù)組的排序方法，在數(shù)組的前一個元素之前或之后隨機排序。
9、在網(wǎng)頁上獲取選定的文本
瀏覽器在全局窗口對象上有一個名為 getSelection 的內(nèi)置方法。使用此方法，你可以創(chuàng)建一個單行，返回網(wǎng)頁上突出顯示或選定的文本。
const getSelectedText = () => window.getSelection().toString()
10、獲取隨機布爾值
在開發(fā)時，尤其是在寫游戲代碼時，有時，我們會想隨機采取行動。在這些情況下，下面的單行代碼非常方便。
const getRandomBoolean = () => Math.random() >= 0.5
上面的單行代碼有 50/50 的機會返回真或假。因為生成的隨機數(shù)大于0.5的概率等于變小的概率。
然而，例如，如果你想得到一個概率為 70% 的隨機布爾值，那么你可以簡單地將 0.5 更改為 0.7 等等。
11、計算數(shù)組的平均值
可以使用多種方法計算數(shù)組的平均值。但邏輯對所有人都是一樣的，我們必須得到數(shù)組及其長度的總和；然后，通過除法給出平均值。
const average = (arr) => arr.reduce((a, b) => a + b) / arr.length
在平均單行中，我們使用 reduce 來獲取一行中數(shù)組的總和，而不是使用循環(huán)。然后，我們將它除以數(shù)組長度，這是一個數(shù)組的平均值。
總結(jié)
現(xiàn)在，我想你應該知道了 11 個簡單但功能強大的 JavaScript 單行代碼。我之所以試著選擇那些不太流行和不太知名的技巧，主要是希望，這樣可以幫助你學習新的東西。那些我們每天使用的東西，我想你已經(jīng)會了。
標題名稱：11個罕見的JavaScript單行代碼，會讓你大吃一驚
網(wǎng)頁地址：http://www.5511xx.com/article/cogiihe.html
