15个值得收藏的JavaScript函数


Posted in Javascript onSeptember 15, 2021

1、逆转数字

const reverseNumber = n =>
  parseFloat(`${n}`.split('').reverse().join('')) * Math.sign(n);

reverseNumber(123); // 321
reverseNumber(-200); // -2
reverseNumber(32.4); // 4.23
reverseNumber(-32.4); // -4.23

2、获取数组中最大的n个数字

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

maxFromArray([2, 1, 4, 3, 5, 6]); // [6]
maxFromArray([2, 1, 4, 3, 6, 6], 2); // [6, 6]

3、计算阶乘

const factorial = (number) =>
  number < 0
    ? (() => {
      throw new TypeError('类型错误');
    })()
    : number <= 1
    ? 1
    : number * factorial(number - 1);

factorial(4); // 24
factorial(10); // 3628800

4、判断当前运行环境是否为浏览器

const isBrowser = () => ![typeof window, typeof document].includes('undefined');

isBrowser(); // false (Node)
isBrowser(); // true (browser)

5、判断当前运行环境是否为Node.js

const isNode = () =>
  typeof process !== 'undefined' &&
  !!process.versions &&
  !!process.versions.node;

isNode(); // true (Node)
isNode(); // false (browser)

6、获取url上的参数

const getURLParams = url =>
  (url.match(/([^?=&]+)(=([^&]*))/g) || []).reduce(
    (a, v) => (
      (a[v.slice(0, v.indexOf('='))] = v.slice(v.indexOf('=') + 1)), a
    ),
    {}
  );

getURLParams('qq.com'); // {}
getURLParams('https://xx.com?name=tntweb&age=20');
// {name: 'tntweb', age: '20'}

7、rgb(x,x,x)颜色表达方式格式转换成对象格式

const toRGBObject = rgbStr => {
  const [red, green, blue] = rgbStr.match(/\d+/g).map(Number);
  return { red, green, blue };
};

toRGBObject('rgb(100, 150, 200)'); // {red: 100, green: 150, blue: 200}

8、转义字符串以在 HTML 中使用

const escapeHTML = str =>
  str.replace(
    /[&<>'"]/g,
    tag =>
      ({
        '&': '&amp;',
        '<': '&lt;',
        '>': '&gt;',
        "'": '&#39;',
        '"': '&quot;'
      }[tag] || tag)
  );

escapeHTML('<a href="#" rel="external nofollow" >tntweb</a>');

9、Unescapes 转义 HTML 字符

const unescapeHTML = str =>
  str.replace(
    /&amp;|&lt;|&gt;|&#39;|&quot;/g,
    tag =>
      ({
        '&amp;': '&',
        '&lt;': '<',
        '&gt;': '>',
        '&#39;': "'",
        '&quot;': '"'
      }[tag] || tag)
  );

unescapeHTML('&lt;a href=&quot;#&quot;&gt;tntweb&lt;/a&gt;');

10、生成指定范围内的随机整数

const randomIntegerInRange = (min, max) =>
  Math.floor(Math.random() * (max - min + 1)) + min;

randomIntegerInRange(1, 7); // 1 - 7

11、将波浪号路径转换为绝对路径

const reversePath = str =>
  str.replace(/^~($|\/|\\)/, `${require('os').homedir()}$1`);

reversePath('~/web'); // '/Users/[userName]/web'

12、获取不带任何参数或片段标识符的当前 URL

const getBaseURL = url => url.replace(/[?#].*$/, '');

getBaseURL('https://xx.com/index?name=tntweb&company=tencent');
// https://xx.com/index

13、以字节为单位返回字符串的长度

const byteSize = str => new Blob([str]).size;

byteSize('?'); // 4
byteSize('Hello World'); // 11

14、随机获取数组中元素

const randomly = arr => arr[Math.floor(Math.random() * arr.length)];

randomly([1, 3, 5, 7, 9, 11]);

15、检查字符串是否为有效的 JSON

const isValidJSON = str => {
  try {
    JSON.parse(str);
    return true;
  } catch (e) {
    return false;
  }
};

isValidJSON('{"name":"tntweb","age":20}'); // true
isValidJSON('{"name":"tntweb",age:"20"}'); // false
isValidJSON(null); // true

到此这篇关于15个值得收藏的JavaScript函数的文章就介绍到这了,更多相关JavaScript函数内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
写出更好的JavaScript程序之undefined篇(中)
Nov 23 Javascript
javascript函数作用域学习示例(js作用域)
Jan 13 Javascript
js点击选择文本的方法
Feb 09 Javascript
javascript如何实现360度全景照片问题汇总
Apr 04 Javascript
webpack常用配置项配置文件介绍
Nov 07 Javascript
JS实现的按钮点击颜色切换功能示例
Oct 19 Javascript
解决淘宝cnpm 安装后cnpm不是内部或外部命令的问题
May 17 Javascript
JS+HTML5实现获取手机验证码倒计时按钮
Aug 08 Javascript
Vue文件配置全局变量的实例
Sep 06 Javascript
浅析TypeScript 命名空间
Mar 19 Javascript
你不知道的SpringBoot与Vue部署解决方案
Nov 09 Javascript
Handtrack.js库实现实时监测手部运动(推荐)
Feb 08 Javascript
详解JavaScript中Arguments对象用途
详细谈谈JavaScript中循环之间的差异
Aug 23 #Javascript
javascript代码简写的几种常用方式汇总
Aug 23 #Javascript
vue使用Google Recaptcha验证的实现示例
Vue鼠标滚轮滚动切换路由效果的实现方法
Aug 04 #Vue.js
关于React Native使用axios进行网络请求的方法
Aug 02 #Javascript
vscode中使用npm安装babel的方法
You might like
php生成图形(Libchart)实例
2013/11/06 PHP
PHP解析目录路径的3个函数总结
2014/11/18 PHP
php统计数组元素个数的方法
2015/07/02 PHP
利用PHPStorm如何开发Laravel应用详解
2017/08/30 PHP
js判断undefined类型,undefined,null, 的区别详细解析
2013/12/16 Javascript
JS动态改变表格边框宽度的方法
2015/03/31 Javascript
js中for in语句的用法讲解
2015/04/24 Javascript
js兼容火狐获取图片宽和高的方法
2015/05/21 Javascript
JavaScript的面向对象编程基础
2015/08/13 Javascript
jquery实现简单的全选和反选功能
2016/01/02 Javascript
BootStrap使用popover插件实现鼠标经过显示并保持显示框
2016/06/23 Javascript
ajax实现加载页面、删除、查看详细信息 bootstrap美化页面!
2017/03/14 Javascript
Vue2路由动画效果的实现代码
2017/07/10 Javascript
Vue2 Vue-cli中使用Typescript的配置详解
2017/07/24 Javascript
详解vue 路由跳转四种方式 (带参数)
2019/04/28 Javascript
让 babel webpack vue 配置文件支持智能提示的方法
2019/06/22 Javascript
Webpack设置环境变量的一些误区详解
2019/12/19 Javascript
Vuex实现购物车小功能
2020/08/17 Javascript
javascript实现打砖块小游戏(附完整源码)
2020/09/18 Javascript
[43:57]LGD vs Mineski 2018国际邀请赛小组赛BO2 第二场 8.19
2018/08/21 DOTA
9种python web 程序的部署方式小结
2014/06/30 Python
Python升级导致yum、pip报错的解决方法
2017/09/06 Python
python创建属于自己的单词词库 便于背单词
2019/07/30 Python
Python中Unittest框架的具体使用
2019/08/27 Python
利用Python如何实时检测自身内存占用
2020/05/09 Python
使用OpenCV对车道进行实时检测的实现示例代码
2020/06/19 Python
html5 viewport使用方法示例详解
2013/12/02 HTML / CSS
Laravel中Kafka的使用详解
2021/03/24 PHP
授权委托书格式
2014/07/31 职场文书
政协调研汇报材料
2014/08/15 职场文书
涨价通知怎么写
2015/04/23 职场文书
2015年统计员个人工作总结
2015/07/23 职场文书
PHP实现创建以太坊钱包转账等功能
2021/04/21 PHP
评测 | 大屏显示带收音机的高端音箱,JBL TUNE2便携式插卡音箱实测
2021/04/24 无线电
OpenCV实现常见的四种图像几何变换
2022/04/01 Python
清空 Oracle 安装记录并重新安装
2022/04/26 Oracle