首頁 >web前端 >js教程 >10個實用的ES6方法,快來收藏吧!

10個實用的ES6方法,快來收藏吧!

青灯夜游
青灯夜游轉載
2021-04-19 19:38:222926瀏覽

這篇文章跟大家分享10個實用的ES6方法。有一定的參考價值,有需要的朋友可以參考一下,希望對大家有幫助。

10個實用的ES6方法,快來收藏吧!

毫無疑問,JavaScript 是Web開發中最受歡迎的程式語言之一。無論使用的是 React,Vue 還是Angular,都只是 JavaScript。 JS圍繞著廣闊而至關重要的生態系統發展,提供了無數的框架和函式庫,可幫助我們更快地開發應用程式。

但有時最好退一步,試著了解如何在沒有使用函式庫的情況下做事。看看下面的程式碼片段,它們以優雅的方式解決了簡單的問題,在日常專案也很實用,所以記好筆記,當遇到問題時就可直接來用。

1.字串反轉


在此範例中,我們使用展開運算符,Array的reverse#方法和String的join方法來反轉給定的字串。

const reverseString = string => [...string].reverse().join('')

// 事例
reverseString('Medium') // "muideM"
reverseString('Better Programming') // "gnimmargorP retteB"

2.計算指定數字的階乘


const factorialOfNumber = number => 
  number < 0
    ? (() => {
      throw new TypeError(&#39;请输入正整数&#39;)
    })()
    : number <= 1
      ? 1
      : number * factorialOfNumber(number - 1)
      
      
// 事例
factorialOfNumber(4) // 24
factorialOfNumber(8) // 40320

3.將數字轉換為數字數組



##
const converToArray = number => [...`${number}`].map(el => parseInt(el))

// 事例
converToArray(5678) // [5, 6, 7, 8]
converToArray(12345678) // [1, 2, 3, 4, 5, 6, 7, 8]

4.檢查數字是否為2的冪

const isNumberPowerOfTwo = number => !!number && (number & (number - 1)) == 0

// 事例
isNumberPowerOfTwo(100) // false
isNumberPowerOfTwo(128) // true

5.從物件建立鍵-值對陣列


const keyValuePairsToArray = object => Object.keys(object)
  .map(el => [el, object[el]])

// 事例
keyValuePairsToArray({Better: 4, Programming: 2})
// [[&#39;Better&#39;, 4], [&#39;Programming&#39;, 2]]

keyValuePairsToArray({x:1, y:2, z:3})
// [[&#39;x&#39;, 1], [&#39;y&#39;, 2], [&#39;z&#39;, 3]]
6.傳回數字陣列中的最大值


const maxElementsFromArray = (array, number = 1) => [...array].sort((x, y) => y -x).slice(0, number)

// 事例
maxElementsFromArray([1, 2, 3, 4, 5]) // [5]

maxElementsFromArray([7, 8, 9, 10, 10], 2) // [10, 10]
7. 檢查陣列中的所有元素是否相等


const elementsAreEqual = array => array.every(el => el === array[0])

// 事例
elementsAreEqual([9, 8, 7, 6, 5, 4]) // false
elementsAreEqual([4, 4, 4, 4, 4]) // true
8. 傳回數的平均值


const averageOfTwoNumbers = (...numbers) => numbers.reduce((accumulator, currentValue) => accumulator + currentValue, 0) / numbers.length

// 事例
averageOfTwoNumbers(...[6, 7, 8]) // 7
averageOfTwoNumbers(...[6, 7, 8, 9]) // 7.5

9.傳回兩個或多個數字的和

const sumOfNumbers = (...array) => [...array].reduce((accumulator, currentValue) => accumulator + currentValue, 0)

// 事例
sumOfNumbers(5, 6, 7, 8, 9, 10) // 45
sumOfNumbers(...[1, 2, 3, 4, 5, 6, 7, 8, 9, 10]) // 50

10.傳回數字數組的冪集

所謂冪集(Power Set),就是原集合中所有的子集(包括全集和空集)構成的集族。可數集是最小的無限集; 它的冪集和實數集一一對應(也稱為同勢),是不可數集。不是所有不可數集都和實數集等勢,集合的勢可以無限的大。如實數集的冪集也是不可數集,但它的位勢比實數集大。設X為有限集,|X| = k,則X的冪集的勢為2的k次方。 ###
const powersetOfArray = array => array.reduce((accumulator, currentValue) => accumulator.concat(accumulator.map(el => [currentValue].concat(el))), [[]])

// 事例
powersetOfArray([4, 2]) // [[], [4], [2], [2, 4]]
powersetOfArray([1, 2, 3])
// [[], [1], [2], [2,1], [3], [3,1], [3,2], [3,2,1]]
######原文網址:https://webdevhub.net/articles/javascriptmedium/10-javascript-code-snippets-you-can-use-right-now#######作者: Simon Holdorf#########更多程式相關知識,請造訪:###程式設計教學###! ! ###

以上是10個實用的ES6方法,快來收藏吧!的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文轉載於:juejin.cn。如有侵權,請聯絡admin@php.cn刪除