[译]这些Javascript方法几分钟内提高你的技能

原文地址：These JavaScript methods will boost your skills in just a few minutes

咱们今天构建的大多数应用程序都须要进行某种数据收集修改。会常常遇到对集合中的项进行处理。忘记for循环传统方式(let i=0; i < value.length; i++ )。

注意，在 使用for-loop时const报出一个错误。是由于它在每次执行期间从新声明了值，所以i被i++修改了。因此每当你想到使用const或者let时考虑一下 - 这个值会被从新声明吗？若是答案是确定的，请选择let ，若是不是，请选择const。更多信息。

假设您要显示产品列表并对集合进行分类，过滤，搜索，修改或更新。或者您可能但愿执行快速计算，例如求和，乘法等。实现这一目标的最佳方法是什么？

也许你不喜欢箭头函数，不想花太多时间学习新东西，或者它们与你无关。别担忧，我将向您展现如何在ES5（功能降级）和ES6（箭头函数）中完成它。

请注意：箭头函数和函数声明/表达式不是等效的，不能盲目替换。请注意，this关键字在二者之间的工做方式不一样。

咱们将要关注的方法：

1. Spread operator
2. for…of iterator
3. includes()
4. some()
5. every()
6. filter()
7. map()
8. reduce()

若是您想成为更好的Web开发人员，开始本身的事业，教别人或提升您的开发技能，我将每周发布关于最新Web开发语言的技巧和窍门。

Spread operator

Spread Operator将数组扩展为其元素。它也能够用于对象字面量。

为何要用它？

• 这是一种简单快速的方式来显示数组的项
• 适用于数组和对象字面量
• 这是一种快速直观的传递参数的方法
• 它只须要上面三个缘由就足以说明问题了......

示例：

假设您想显示喜欢的食物列表而不想建立循环函数。可使用这样的Spread operator：

for ... of iterator

for...of语句循环/遍历集合，并为您提供修改特定项的功能。它取代了传统的for-loop作法。

为何要用它？

• 这是添加或更新元素的简单方法
• 执行计算（求和，乘法等）
• 使用条件语句时（if，while，switch等）
• 干净和可读的代码

示例：

假设您有一个工具箱，而且要显示其中的全部工具。for...of迭代器很容易实现。

Includes()

includes()方法用于检查集合中是否存在特定字符串，并返回true或false。请记住，它区分大小写：若是集合中的项目是SCHOOL，而您搜索school，它将返回false。

我为何要用它？

• 构建简单的搜索功能
• 这是一种肯定字符串是否存在的直观方法
• 使用条件语句来修改，过滤等
• 可读代码

示例：

假设您不知道车库中有哪些车辆，您须要一个系统来检查您想要的车是否存在。includes()来完成！

Some()

some()方法检查数组中是否存在某些元素，并返回true或false。这有点相似于includes()方法的概念，除了参数是函数而不是字符串。

为何要用它？

• 确保某些项目经过测试
• 使用函数执行条件语句
• 使代码1清晰

示例：

假设您是俱乐部老板，并不关心谁进入俱乐部。但有些人不容许进入，由于他们喝得太多。查看如下ES5和ES6之间的差别：

ES5：

ES6：

Every()

every()方法遍历数组，检查每一个项，并返回true或false。概念和some()相同。除了每一个项必须知足条件语句，不然它将返回false。

我为何要用它？

• 确保每一个项都经过测试
• 可使用函数执行条件语句
• 使您的代码清晰

示例：

最后一次容许some()未成年学生进入俱乐部时，有人报告此事而且警察抓住了您。此次你不会让这种状况发生，你将确保每一个人every()都经过了年龄限制。

ES5

ES6

Filter()

filter()方法建立一个包含全部经过条件的元素的新数组。

我为何要用它？

• 能够避免更改原数组
• 能够过滤掉不须要的项
• 提供更易读的代码

示例：

假设想返回高于或等于30的价格。过滤掉全部其余价格......

ES5

ES6

Map()

map()方法在返回新数组方面相似于filter()方法。可是，惟一的区别是它用于修改项。

我为何要用它？

• 能够避免对原数组进行更改
• 能够修改所需的项
• 提供更易读的代码

示例：

假设有一个包含价格的产品列表。经理须要一个清单，以便在税率减小25％后显示新价格。map()方法能够完成。

ES5

ES6

Reduce()

reduce()方法可用于将数组转换为其余内容，能够是整数，对象，承诺链（承诺的顺序执行）等。出于实际缘由，一个简单的用例是对整数列表求和。简而言之，它将整个数组“减小”为一个值。

我为何要用它？

• 执行计算
• 计算一个值
• 计算重复数
• 按属性分组对象
• 按顺序执行promises
• 这是一种快速执行计算的方法

示例：

假设您要查找一周的总花销，使用reduce()得到该值。

ES5

ES6