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向flash swf文件传递参数值注意细节
Dec 11 Javascript
jQuery Pagination Ajax分页插件(分页切换时无刷新与延迟)中文翻译版
Jan 11 Javascript
jquery 实现二级/三级/多级联动菜单的思路及代码
Apr 08 Javascript
js下拉框二级关联菜单效果代码具体实现
Aug 03 Javascript
js open() 与showModalDialog()方法使用介绍
Sep 10 Javascript
详解react-native-fs插件的使用以及遇到的坑
Sep 12 Javascript
webpack+vue2构建vue项目骨架的方法
Jan 09 Javascript
详解react内联样式使用webpack将px转rem
Sep 13 Javascript
微信小程序scroll-view横向滑动嵌套for循环的示例代码
Sep 20 Javascript
创建echart多个联动的示例代码
Nov 23 Javascript
ES6 Set结构的应用实例分析
Jun 26 Javascript
TensorFlow.js 微信小程序插件开始支持模型缓存的方法
Feb 21 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使用gearman进行异步的邮件或短信发送操作详解
2020/02/27 PHP
javascript生成/解析dom的CDATA类型的字段的代码
2007/04/22 Javascript
如何让easyui gridview 宽度自适应窗口改变及fitColumns应用
2013/01/25 Javascript
javascript实现div浮动在网页最顶上并带关闭按钮效果实例
2013/08/13 Javascript
javascript中数组的sort()方法的使用介绍
2013/12/18 Javascript
JS实现局部选择打印和局部不选择打印
2014/04/03 Javascript
JavaScript是如何实现继承的(六种方式)
2016/03/31 Javascript
基于BootStrap Metronic开发框架经验小结【四】Bootstrap图标的提取和利用
2016/05/12 Javascript
JSON字符串和对象相互转换实例分析
2016/06/16 Javascript
Web 开发中Ajax的Session 超时处理方法
2017/01/19 Javascript
JS正则表达式验证密码格式的集中情况总结
2017/02/23 Javascript
Bootstrap组合上、下拉框简单实现代码
2017/03/06 Javascript
深入理解Angularjs 脏值检测
2018/10/12 Javascript
基于Webpack4和React hooks搭建项目的方法
2019/02/05 Javascript
微信小程序使用wx.request请求服务器json数据并渲染到页面操作示例
2019/03/30 Javascript
Vue.js实现大屏数字滚动翻转效果
2019/11/29 Javascript
Vue跨域请求问题解决方案过程解析
2020/08/07 Javascript
OpenLayers3加载常用控件使用方法详解
2020/09/25 Javascript
详解Python中用于计算指数的exp()方法
2015/05/14 Python
Python实现屏幕截图的代码及函数详解
2016/10/01 Python
python3实现公众号每日定时发送日报和图片
2018/02/24 Python
Python实现登陆文件验证方法
2018/10/06 Python
python RabbitMQ 使用详细介绍(小结)
2018/11/08 Python
python调用staf自动化框架的方法
2018/12/26 Python
python腾讯语音合成实现过程解析
2019/08/01 Python
python 实现矩阵填充0的例子
2019/11/29 Python
python程序需要编译吗
2020/06/19 Python
html5 Canvas画图教程(2)—画直线与设置线条的样式如颜色/端点/交汇点
2013/01/09 HTML / CSS
amazeui页面校验功能的实现代码
2020/08/24 HTML / CSS
Belvilla德国:在线预订度假屋
2018/04/10 全球购物
肯尼迪就职演说稿
2013/12/31 职场文书
趣味体育活动方案
2014/02/08 职场文书
事业单位年度考核个人总结
2015/02/12 职场文书
中小学生安全教育观后感
2015/06/17 职场文书
股权投资协议书
2016/03/23 职场文书
Java Spring Boot 正确读取配置文件中的属性的值
2022/04/20 Java/Android