博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
10个你每天都需要用到的Javascript代码片段
阅读量:4118 次
发布时间:2019-05-25

本文共 3514 字,大约阅读时间需要 11 分钟。

英文 | https://medium.com/dev-genius/10-useful-javascript-code-snippets-that-you-need-everyday-2de5c4ef79c6

翻译 | 小爱

程序员总是喜欢做一些新的事情,但是每个项目都必须包含一些基本和常规的事情。

在这里,我想与你分享一些工作中经常使用到的JavaScript代码片段,从中可以找到新的内容。

1、遍历对象

循环遍历对象是每种编程语言的常规需求。有时,它可能是具有多个键和值的复杂对象。通过这种配对有点令人困惑。在这里,我将描述两种可能的方式。

代码如下:

// Simple wayconst person = { name: "Shoaib", Age: 25, Gender: "Male" };for (const property in person) {  console.log(`${property}: ${person[property]}`);}// Another wayconst anotherPerson = {  Name: 'Shoaib',  Age: 25,  Gender:"Male"};for (const [key, value] of Object.entries(anotherPerson)) {  console.log(`${key}: ${value}`);}

2、查找对象数组

进入阵列是日常开发或编程中最需要完成的任务。在这里,我们使用find函数来执行此操作。该功能也适用于其他阵列。数字数组,对象数组,字符串数组,所有内容都支持此方法。

代码如下:

const students = [  {name: 'Shoaib', roll: 2},  {name: 'Mehedi', roll: 10},  {name: 'Alex', roll: 5}];function search(student) {  return student.name=== "Mehedi";}console.log(students.find(search));// { name: 'Mehedi', roll: 10 }

3、对数组排序

对数组进行排序是一个令人困惑且经常使用的代码段。Javascript具有其内置sort()功能。此方法适用于字母排序。因此,针对数字的解决方案是添加一个处理数字类型的新方法。在这里,我描述了字母排序和数字排序。

注意:在期望数值排序时,请不要忘记使用新方法。

// sort alphabeticallyconst name = ['Shoaib', 'Mehedi', 'Alex', 'Jane'];const arr = [1, 30, 4, 21, 100000];name.sort();console.log(name);// sort numericallyarr.sort(function(a, b) {  return a - b;});console.log(arr);

4、字符串反转

字符串反向是一个基本而普遍的问题。在这里,我将展示一些可能的方法。

  • Reverse using basic functions。只是拆分一个字符串并创建一个数组,然后反转它,最后,你去加入它。

  • Reverse using a loop。以相反的顺序循环遍历一个数组,并将其添加到新变量中,就可以了。

  • 最后一种可能的解决方案是recursion function。看看吧。

// reverse using basic functionsfunction reverse(string) {    return string.split("").reverse().join("");}console.log(reverse('shoaib'));// reverse using loopfunction reverse(string) {    var newString = "";    for (var i = string.length - 1; i >= 0; i--) {        newString += string[i];    }    return newString;}console.log(reverse('shoaib'));// reverse using recursion functionfunction reverse(string) {  if (string === "")    return "";  else    return reverse(string.substr(1)) + string.charAt(0);}console.log(reverse('shoaib'));

5、查找最大数量的阵列

这是一种查找最大数组数的方法。也可以循环执行此操作,但这是下面的一种简单方法。

const array1 = [1, 3, 2];console.log(Math.max(...array1));// expected output: 3

6、合并数组

合并数组可以通过多种方式完成。一种是内置concat()功能。另一个是点差运算符(…)。在这里,我解释了两者。

let arrOne = [1,3,5]let arrTwo = [2,4,6]// first waylet combine = arrOne.concat(arrTwo) console.log(combine)// second waycombine = [...arrOne,...arrTwo]console.log(combine)

7、错误处理

try-catch语句适用于异常处理程序。只需将你的代码放入try块中即可。如果一切正常,就可以开始工作了,如果发生异常,你的代码将执行catch块,并且你可以在catch块中做任何你想做的事情。错误报告和其他决策主要在catch块中执行。

最后,使用try-catch也是必不可少的。try语句执行后,将执行“最后”块。

try {  try_statements}catch (exception_var) {  catch_statements}finally {  finally_statements}

8、查找多数重复数组

这是日常生活中最常见的任务之一。这是下面的例子。只需使用将帮助你找到数组中重复次数最多的元素即可。这适用于数字和字符串。

function mostRepeated(array){    return array.sort((a,b) =>          array.filter(v => v===a).length        - array.filter(v => v===b).length    ).pop();}console.log(mostRepeated(['shoaib', 'alex', 'mehedi', 'alex'])); // apple

9、交换值

交换值是编程中最基本的问题。在这里,我们使用技巧,并同时将多个值分配给多个变量。

示例如下:

let a = 50, b = 16;[a, b] = [b, a];console.log(a,b);

10、功能链

链接功能的概念很有趣。函数链接是javascript的概念,其中单个对象中包含多个函数。

在这里,我们可以通过一遍又一遍地提及对象来调用所有功能。链接主要是提高代码的可读性。这是下面的例子。

var object = {  res: 0,  add: function(a, b) {    this.res = a + b;     return this;  },  multiply: function(a) {    this.res = this.res * a;    return this;  } };object.add(5, 10).multiply(10)console.log(object.res)

结论

在本文中,我试图介绍日常生活中所需的所有潜在且定期使用的代码段。希望本文对你的日常工作有所帮助。

如果我错过了一些好的方法,请别忘记提醒我,如果你有什么问题,也可以在留言区与我交流,我们一起探讨。

感谢你的阅读,编程愉快!

学习更多技能

请点击下方公众号

转载地址:http://jmbpi.baihongyu.com/

你可能感兴趣的文章
vue复用新增和编辑表单
查看>>
Ubuntu 16.04 apt-get更换为国内阿里云源
查看>>
laravel部署到宝塔步骤
查看>>
小程序获取access_token
查看>>
navicat远程连接mysql数据库
查看>>
tp5令牌数据无效 解决方法
查看>>
自己的网站与UCenter整合(大致流程)
查看>>
laravel 制作通用的curd 后台操作
查看>>
【小红书2017年笔试】求一个数组中平均数最大的子数组
查看>>
Linux基础系列-定时器与时间管理
查看>>
Linux基础系列-可执行程序的产生过程
查看>>
Linux基础系列-Kernel 初始化宏
查看>>
Linux子系统系列-I2C
查看>>
<iOS>关于自定义description的一点用法
查看>>
Unix 命令,常用到的
查看>>
DLL中建立进程共享数据段需要注意的语法问题
查看>>
服务器端技术----Http请求的处理过程
查看>>
C语言-预处理指令2-条件编译
查看>>
C语言-预处理指令3-文件包含
查看>>
C语言-变量类型
查看>>