10个实用的ES6方法,快来收藏!


本文摘自PHP中文网,作者青灯夜游,侵删。

本篇文章给大家分享10个实用的ES6方法。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。

毫无疑问,JavaScript 是Web开发中最流行的编程语言之一。 无论使用的是 React,Vue 还是Angular,都只是 JavaScript。 JS围绕着广阔而至关重要的生态系统发展,提供了无数的框架和库,可帮助我们更快地开发应用程序。

但是有时候最好退一步,尝试了解如何在没有使用库的情况下做事。 看看下面的代码片段,它们以优雅的方式解决了简单的问题,在日常项目也很实用,所以记好笔记,当遇到问题时就可直接来用使用。

1.字符串反转


在此示例中,我们使用展开运算符,Array的reverse方法和 String 的join方法来反转给定的字符串。

1

2

3

4

5

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

 

// 事例

reverseString('Medium') // "muideM"

reverseString('Better Programming') // "gnimmargorP retteB"

2.计算指定数字的阶乘


1

2

3

4

5

6

7

8

9

10

11

12

13

const factorialOfNumber = number =>

  number < 0

    ? (() => {

      throw new TypeError('请输入正整数')

    })()

    : number <= 1

      ? 1

      : number * factorialOfNumber(number - 1)

       

       

// 事例

factorialOfNumber(4) // 24

factorialOfNumber(8) // 40320

3.将数字转换为数字数组


1

2

3

4

5

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的幂


1

2

3

4

5

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

 

// 事例

isNumberPowerOfTwo(100) // false

isNumberPowerOfTwo(128) // true

5.从对象创建键-值对数组


1

2

3

4

5

6

7

8

9

const keyValuePairsToArray = object => Object.keys(object)

  .map(el => [el, object[el]])

 

// 事例

keyValuePairsToArray({Better: 4, Programming: 2})

// [['Better', 4], ['Programming', 2]]

 

keyValuePairsToArray({x:1, y:2, z:3})

// [['x', 1], ['y', 2], ['z', 3]]

6.返回数字数组中的最大值


1

2

3

4

5

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. 检查数组中的所有元素是否相等


1

2

3

4

5

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. 返回数的平均值


1

2

3

4

5

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.返回两个或多个数字的和


1

2

3

4

5

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次方。

1

2

3

4

5

6

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方法,快来收藏!的详细内容,更多文章请关注木庄网络博客

相关阅读 >>

dom节点和元素之间有什么区别

浅谈前端的正则表达式

javascript中的json方法有哪些

java与javascript的区别有哪些

详解javascript中的回调函数

javascript专题之八:数组扁平化

你不太了解的json

12个编写干净且可扩展的javascript代码的小技巧

javascript怎么关闭窗口

如何给js创建一个数组对象

更多相关阅读请进入《javascript》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...