JS 实用的方法代码片段
无论是使用 React,Vue 还是 Angular,它们都属于JavaScript。JS 围绕着广阔而至关重要的生态系统发展,提供了许多的框架和库,可以快速地开发应用程序。 但是有时最好退后一步,尝试了解如何在没有库的情况下进行操作。看看下面的代码片段,它们以优雅的方式解决了简单的问题,并在日常项目情况下使用了这些知识,可以为编写代码提升工作效率。
1. 反转字符串
在此示例中,我们使用了 Array 的 reverse 方法和 String 的 split 和 join 方法来反转给定的字符串。
const reverseString = string =>
string. split ( '' ) . reverse ( ) . join ( '' ) ;
console. log ( reverseString ( "I am Regino." ) ) ;
2. 计算数字的阶乘
要计算给定数字的阶乘,我们使用箭头函数和嵌套三元运算符。
const factorialOfNumber = number => number < 0
? ( ( ) => {
throw new TypeError ( "No negative numbers." ) ;
} )
: number <= 1
? 1
: number * factorialOfNumber ( number - 1 ) ;
console. log ( factorialOfNumber ( 5 ) ) ;
3. 返回数字数组的幂集
在这个示例中,我们要返回数字数组的幂集(就是原集合中所有的子集(包括全集和空集)构成的集族)。因此,我们使用 Array 中的 reduce,map 和 concat 方法。
const powerSetOfArray = array =>
array. reduce ( ( accumulator, currentValue) =>
accumulator. concat ( accumulator. map ( el =>
[ currentValue] . concat ( el) )
) , [ [ ] ]
) ;
console. log ( powerSetOfArray ( [ 1 , 2 , 3 ] ) ) ;
console. log ( powerSetOfArray ( [ 8 , 9 ] ) ) ;
4. 返回两个数的平均值
在此示例中,我们使用了 spread 运算符(…)和 Array 中的 reduce 方法来返回两个给定数字或一个数组的平均值。
const averageOfTwoNumbers = ( ... numbers) =>
numbers. reduce ( ( accumulator, currentValue) =>
accumulator + currentValue, 0 ) / numbers. length;
console. log ( averageOfTwoNumbers ( ... [ 5 , 6 , 7 ] ) ) ;
console. log ( averageOfTwoNumbers ( 5 , 6 , 7 , 8 ) ) ;
5. 检查数字是否为2的幂
先检查 number 不是虚假的,并使用按位 AND 运算符(&)确定是否 number 为 2 的幂。
const isNumberPowerOfTwo = number =>
! ! number && ( number & ( number - 1 ) ) == 0 ;
console. log ( isNumberPowerOfTwo ( 1024 ) ) ;
console. log ( isNumberPowerOfTwo ( 1000 ) ) ;
!!a
等价于 a!=null&&typeof(a)!=undefined&&a!=''
,即判断变量 a 为非空、未定义或者非空串,a 有内容才返回 true。
6. 将数字转换为数字数组
在此示例中,我们使用了散布运算符(…),Array 的 map 方法以及将该给定数字转换为一个单数数组的 parseInt 函数 。
const convertToArray = number =>
[ ... ` ${ number} ` ] . map ( el =>
parseInt ( el) ) ;
console. log ( convertToArray ( 123 ) ) ;
7. 从对象创建键-值对数组
在此示例中,我们使用 Object 中的 keys 方法和 Array 中的 map 方法来映射 Object 的键,并创建一个键值对数组。
const keyValuePairsToArray = object =>
Object. keys ( object) . map ( el =>
[ el, object[ el] ] ) ;
console. log ( keyValuePairsToArray ( { x: 1 , y: 2 , z: 3 } ) ) ;
8. 返回两个或多个数字的和
要返回两个或多个给定数字或一个数组的总和,我们再次使用散布运算符(…) 和 Array 中的 reduce 方法。
const sumOfNumbers = ( ... array) =>
[ ... array] . reduce ( ( accumulator, currentValue) =>
accumulator + currentValue, 0 ) ;
console. log ( sumOfNumbers ( ... [ 1 , 2 , 3 ] ) ) ;
console. log ( sumOfNumbers ( 1 , 2 , 3 ) ) ;
9. 检查数组中的所有元素是否相等
在这个简短的示例中,我们使用 Array 中的 every 方法检查数组中的所有元素是否相等。我们基本上检查每个元素是否等于数组中的第一个元素。
const elementsAreEqual = array =>
array. every ( el =>
el == array[ 0 ] ) ;
console. log ( elementsAreEqual ( [ 2 , 2 , 2 , 2 ] ) ) ;
console. log ( elementsAreEqual ( [ 1 , 2 , 3 , 4 ] ) ) ;
10. 从数组中返回[Number]个最大元素
为了从数组中返回最大元素,我们使用了一个箭头函数,该函数获取数组和希望函数返回的元素数。我们使用了散布运算符(…)以及 Array 中的 sort 和 slice 方法。请注意,如果不提供第二个参数,则 number 默认值为 1,因此仅返回一个最大元素。
const maxElementsFromArray = ( array, number = 1 ) =>
[ ... array] . sort ( ( x, y) =>
y - x) . slice ( 0 , number) ;
console. log ( maxElementsFromArray ( [ 1 , 2 , 3 , 4 , 5 , 5 ] ) ) ;
console. log ( maxElementsFromArray ( [ 1 , 2 , 3 , 4 , 5 , 5 ] , 2 ) ) ;
原文链接:https://qwert.blog.csdn.net/article/details/105570059