JavaScript中实用的8个代码片段

简介: JavaScript中实用的8个代码片段

image.png


1. 反转字符串


使用扩展符号...将字符串解析成数组。


const reverseString = string => [...string].reverse().join('');
reverseString('Medium'); // 'muideM'
复制代码


2. 数阶乘


计算数据的阶乘,使用箭头函数和三元运算符。


const factorialOfNumber = number => 
  number < 0
    ? (() => {
      throw new TypeError('No negative numbers please');
    })()
    : number <= 1
      ? 1
      : number * factorialOfNumber(number - 1);
factorialOfNumber(4); // 24
复制代码


3. 整数转数组


使用扩展符号...,并结合map方法。


const convertToArray = number => [...`${number}`].map(el => parseInt(el))
convertToArray(5678); // [5, 6, 7, 8]
复制代码


注意这里的${number},而不是number


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});
// [['Better', 4], ['Programming', 2]]
复制代码


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


下面我们定义了一个函数,参数一是要传递的数字数组,参数二是要返回的数组长度。当然,对于返回数字数组中的最小值的思路也是一样。


const maxElementsFromArray = (array, len = 1) => [...array].sort((x, y) => y - x).slice(0, len);
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]); // false
elementsAreEqual([4, 4, 4, 4, 4]); // true
复制代码


8. 计算平均数


我们使用reduce函数对数组进行处理,再求平均数。


举一反三,计算数的和等也是这种思路


const averageOfNumbers = (...numbers) => numbers.reduce((accumulator, currentValue) => accumulator + currentValue, 0) / numbers.length;
averageOfNumbers(...[6, 7, 8]); // 7
averageOfNumbers(6, 7, 8, 9); // 7.5
复制代码


🤣 注意:上面的代码并非严谨的,没有考虑到边界值等小问题,感兴趣者可自行扩展,封装成util方法,毕竟在实际开发中使用还是可以的~



相关文章
|
22天前
|
消息中间件 JavaScript 中间件
函数计算产品使用问题之WebIDE编写的Node.js代码是否会自动进行打包部署
函数计算产品作为一种事件驱动的全托管计算服务,让用户能够专注于业务逻辑的编写,而无需关心底层服务器的管理与运维。你可以有效地利用函数计算产品来支撑各类应用场景,从简单的数据处理到复杂的业务逻辑,实现快速、高效、低成本的云上部署与运维。以下是一些关于使用函数计算产品的合集和要点,帮助你更好地理解和应用这一服务。
|
24天前
|
JavaScript 前端开发 编译器
解锁JavaScript模块化编程新纪元:从CommonJS的基石到ES Modules的飞跃,探索代码组织的艺术与科学
【8月更文挑战第27天】随着Web应用复杂度的提升,JavaScript模块化编程变得至关重要,它能有效降低代码耦合度并提高项目可维护性及扩展性。从CommonJS到ES Modules,模块化标准经历了显著的发展。CommonJS最初专为服务器端设计,通过`require()`同步加载模块。而ES Modules作为官方标准,支持异步加载,更适合浏览器环境,并且能够进行静态分析以优化性能。这两种标准各有特色,但ES Modules凭借其更广泛的跨平台兼容性和现代语法逐渐成为主流。这一演进不仅标志着JavaScript模块化的成熟,也反映了整个JavaScript生态系统的不断完善。
34 3
|
2天前
|
JavaScript
网站内容禁止复制的js代码
网站内容禁止复制的js代码
|
8天前
|
缓存 JavaScript 前端开发
js和html代码一定要分离吗
JavaScript(JS)和HTML代码的分离虽非绝对必要,但通常被推荐
|
11天前
|
移动开发 JavaScript 安全
总有一款适合您分享78个JS相册代码
本文分享了78款JS相册代码,包括3D相册旋转木马、图片悬浮效果、倾斜图片幻灯片切换等特效,适用于各种图片展示场景。无论您需要哪种样式,都能在这里找到满意的解决方案。快来挑选吧!参考链接:[点击这里](https://www.vipwb.com/sitemap.xml)。
23 4
|
12天前
|
JavaScript
分享一款520表白节JS代码
今天给大家分享一款JS表白源码 js会随 随机颜色心形跟随鼠标互动520表白节女神表白利器! 修改的话就搜索:LOVEh 就能找到这个英文了。
6 0
分享一款520表白节JS代码
|
19天前
|
JSON JavaScript 前端开发
如何使用代码注释:关于JavaScript与TypeScript
TSDoc是一种标准化TypeScript代码文档注释的规范,使不同工具能无干扰地提取内容。它包括多种标记,如@alpha、@beta等发布阶段标记;@decorator、@deprecated等功能标记;@defaultValue、@eventProperty等描述标记;@example、@experimental等示例与实验性标记;@inheritDoc、@internal等引用与内部标记;@label、@link等链接标记;@override、@sealed等修饰符标记;以及@packageDocumentation、@param、
25 5
|
21天前
|
JavaScript 前端开发 UED
JavaScript代码技巧大分享,在数组中去重元素
本文介绍了一系列实用的JavaScript函数,包括将内容复制到剪贴板、获取鼠标选中内容、打乱数组顺序、颜色值转换(RGBA与十六进制)、计算平均值、判断奇偶数、数组去重、检查空对象、反转字符串、计算日期间隔、首字母大写、生成随机字符串和随机数等,帮助提升网站的用户体验和功能丰富性。
20 4
|
21天前
|
JavaScript 前端开发 测试技术
如何写高质量的JavaScript代码
在现代Web开发中,JavaScript扮演着至关重要的角色。本文介绍了提升JavaScript代码质量的关键技巧:采用语义化命名增强代码可读性;通过模块化设计提升代码的可维护性和复用性;利用恰当的注释与文档说明代码功能;合理管理全局变量避免命名冲突;实施有效的异常处理增加程序稳定性;并借助工具和框架提高开发效率和代码质量。这些实践共同助力打造高效、可维护的Web应用。代码示例和效果参见相关链接。
20 3
|
21天前
|
JavaScript Java 虚拟化
JS代码片段
本文档详细规定了Java编程中的排版、命名及注释规范。排版方面,强调变量初始化时对齐赋值符号,操作符与关键词或变量间加空格,独立代码块间加空行,长语句换行书写,并将`main`方法置于类底部。命名规范包括全小写包名、驼峰命名法的类与变量名,以及大写的静态最终变量名。注释部分提倡使用Eclipse自动生成模板,并及时补充描述。文档还提供了多个格式示例,以JDK源码和Hyperic HQ为参考,展示了不同语句的具体应用。
16 2