作为开发人员你必需添加的10个javascript

JavaScript可以做很多令人惊奇的事情!
从复杂的框架到处理API,都需要学习很多东西。
但是,它也使您仅用一行就可以完成一些很棒的工作。
查看这10个单行代码,以增强您的JavaScript游戏!

1、大写字符串的第一个字母

使用此功能,您将能够大写字符串输入的首字母。这可以是一个单词,也可以是整个句子。
在这里插入图片描述

// Capitalize the first letter of a string
const capitalize = str => `${str.charAt(0).toUpperCase()}${str.slice(1)}`;
capitalize("hello, you are a cool person!");
// Result: "Hello, you are a cool person!"
2、计算两个日期之间的天数

有时很难弄清楚。“ 1000 * 60 * 60 * 24”是一天中的毫秒数。
在这里插入图片描述

// Calculate the number of days between two dates
const diffDays = (date, otherDate) => Math.ceil(Math.abs(date - otherDate) / (1000 * 60 * 60 * 24));
diffDays(new Date('2014-12-19'), new Date('2020-01-01'));
// Result: 1839
3、将字符串转换为数字

使用强制类型将字符串转换为数字的一种非常简单的方法。

在这里插入图片描述

// Convert a string to a number implicitly
toNumber = str => +str;
// Convert a string to a number explicitly
toNumber = str => Number(str);
toNumber("2");
// Result: 2
4、检查数组是否包含任何项目

使用“ isArray”方法并检查数组的长度是否大于0,我们可以检查它是否为空。
在这里插入图片描述

// Check if an array contains any items
const isNotEmpty = arr => Array.isArray(arr) && arr.length > 0;
isNotEmpty([1, 2, 3]);
// Result: true
isNotEmpty([]);
// Result: false
5、合并多个数组的不同方法

有两种不同的合并数组的方式。其中之一是使用“ concat”方法。另一个正在使用扩展运算符(“…”)。
我们也可以使用“ Set”对象删除所有重复项的最终数组。
在这里插入图片描述

// Different ways of merging multiple arrays
// Merge but don't remove the duplications
const merge = (a, b) => a.concat(b);
// Or
const merge = (a, b) => [...a, ...b];
// Merge and remove the duplications
const merge = [...new Set(a.concat(b))];
// Or
const merge = [...new Set([...a, ...b])];
6、对包含数字的数组进行排序

JavaScript的内置排序方法非常棘手。它不能很好地处理数字,因此此函数是对数组进行排序的一种简单方法。
在这里插入图片描述
// Sort an array containing numbers
const sort = arr => arr.sort((a, b) => a - b);
sort([1, 5, 2, 4, 3]);
// Result: [1, 2, 3, 4, 5]

7、生成随机的十六进制颜色

生成RGB颜色要简单一些,但是创建随机的十六进制颜色会有点复杂。此功能将允许您生成随机的十六进制颜色。

在这里插入图片描述

// Generate a random HEX color
randomColor = () => `#${Math.random().toString(16).slice(2, 8).padStart(6, '0')}`;
// Or
const randomColor = () => `#${(~~(Math.random()*(1<<24))).toString(16)}`;
8、获取指定cookie的值

知道Cookie的名称,并想读出其特定值吗?
我们可以使用文档对象的“ cookie”属性来检索它并将其返回给我们。
在这里插入图片描述

// Get the value of a specified cookie
cookie = name => `; ${document.cookie}`.split(`; ${name}=`).pop().split(';').shift();
cookie('_ga');
// Result: "GA1.2.1929736587.1601974046"
9、交换2个变量的值

有时,您只需要交换2个变量。这个简单的技巧将使您可以单行执行此操作!
在这里插入图片描述

// Swap the values of 2 variables
let a = 1;
let b = 2;
[a, b] = [b, a];
// Result: 
// a = 2
// b = 1
10、获取用户选择的文本

每当用户使用光标选择文本时,我们都可以使用窗口对象上的“ getSelection”方法来访问文本。
在这里插入图片描述

// Get the text that the user has selected
const getSelectedText = () => window.getSelection().toString();
getSelectedText();

原文地址:https://medium.com/dailyjs/10-javascript-oneliners-you-have-got-to-add-your-arsenal-as-a-developer-b733cbb973b2

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值