python 构件二维数组_通过这四个构件块来升级您的javascript数组

python 构件二维数组

Arrays in JavaScript are something special, as they leverage the prototype feature of JS and provide a handy way to run functions directly from a reference to an array instance.

JavaScript中的数组很特别，因为它们利用了JS的原型功能，并提供了一种便捷的方法来直接从引用到数组实例运行函数。

I believe that using these four functions as much as possible within your code will not only make you more efficient, but also make you more popular on your team and generally more amazing at what you do.

我相信，在您的代码中尽可能多地使用这四个功能不仅会提高您的效率，而且还会使您在团队中更受欢迎，并且通常会使您的工作更加惊奇。

All four of these prototype functions accept a “callback” function, which is a pure function that accepts arguments and must return something expected back to the caller, whether it be a boolean liketrue or false, or a type like String, Object, Array, or Number.

所有这四个原型函数都接受一个“回调”函数，这是一个纯函数，它接受参数并且必须将期望的值返回给调用者，无论它是boolean如true或false )还是类型(如String ， Object ， Array或Number 。

Let’s take a look at each of these useful Array functions and learn to make our code more concise!

让我们看一下这些有用的Array函数，并学习使我们的代码更简洁 ！

地图— Array.prototype.map() (Map — Array.prototype.map())

Photo by Louis Hansel @shotsoflouis on Unsplash

Louis Hansel的照片 @shotsoflouis在 Unsplash上

map is a building block of most programming languages, and is definitely a wonderful Array function to start with.

map是大多数编程语言的构建块，并且绝对是一个很棒的Array函数。

This line of code for instance, will loop through ANIMALS and create an array of Strings, with their name and animal type:

例如，以下代码行将遍历ANIMALS并创建Strings数组，其名称和动物类型为：

You might already be familiar with map if you are using front-end frameworks like React or Vue where you quite often need to loop through an array of data to produce HTML:

如果您使用的是React或Vue等前端框架，那么您可能已经很熟悉map ，在这些框架中，您经常需要遍历数据数组以生成HTML：

<ul>
    {ANIMALS.map((animal) =>
        <li>
            {animal.name} ({animal.type})
        </li>
    )}
</ul>
​
// produces:
<ul>
    <li>Spot (dog)</li>
    <li>Fluffy (cat)</li>
    <li>Peppy (bird)</li>
    <li>Lizzy (lizard)</li>
</ul>

The map function is all-around useful to convert array of something X into array of something Y.

map函数可用于将X数组转换为Y数组 。

Reduce — Array.prototype.reduce() (Reduce — Array.prototype.reduce())

The reduce function is used like map but takes it even further.

reduce函数的用法与map一样，但功能更进一步。

Instead of convert array of something X into array of something Y, reduce is designed to convert array of something X into something Y, meaning you are not limited to just making a new array.

reduce不是将X的数组转换为Y的数组，而是设计了将X的数组转换为Y的意思，这意味着您不仅限于制作新的数组 。

You can turn an array into Objects, Numbers, or Strings. Here we sum up the total weight of all of the ANIMALS:

您可以将数组转换为Objects ， Numbers或Strings 。 在这里，我们总结所有ANIMALS的总重量：

reduce is such a powerful function on arrays, that it is versatile enough to produce the same effect as a map does. Check out this reduce version of a map function:

reduce是数组上如此强大的功能，它具有足够的通用性，可以产生与map相同的效果。 看看这个map函数的reduce版本：

筛选器— Array.prototype.filter() (Filter — Array.prototype.filter())

Photo by Caleb Dow on Unsplash

Caleb Dow在 Unsplash上 拍摄的照片

filter works just as it sounds, and only retrieves items from an array that produce a truthy value from your callback function. Here we look for ANIMALS that have soft fur or feathers:

filter工作原理与听起来一样，仅从可从回调函数产生真实值的数组中检索项目。 在这里，我们寻找具有柔软皮毛或羽毛的ANIMALS ：

Here is another example, using a mathematical comparison. As long as the function returns a truthy/falsy value it works as expected. Here we only select ANIMALS that weigh less than 10lbs:

这是另一个使用数学比较的例子。 只要函数返回真实/虚假值，它就会按预期工作。 在这里，我们只选择重量小于10磅的ANIMALS ：

查找— Array.prototype.find() (Find — Array.prototype.find())

Finally, we have find, which helps you search through an array using a callback. This is extremely useful as it provides an interface to search through an array that also works with a sister function called findIndex.

最后，我们find ，它可以帮助您使用callback遍历数组。 这非常有用，因为它提供了一个搜索数组的接口，该数组也可以与名为findIndex的姊妹函数findIndex 。

As long as your function returns a truthy value, the first truthy value returned will exit the find search and return back that row from the array.

只要您的函数返回真实值，返回的第一个真实值将退出find搜索并从数组中返回该行。

In this example, we find a dog named Spot:

在此示例中，我们find了一只名为Spot的狗：

组合数组函数 (Combining Array Functions)

Photo by Ali Yahya on Unsplash

Ali Yahya在 Unsplash上 拍摄的照片

Now that you have a handle on these four building block functions, we can combine them all together:

现在您已经掌握了这四个构建基块函数，我们可以将它们全部组合在一起：

Above, we first map over our ANIMALS and create a new object of their weight and type, also taking this opportunity to feed each one. We feed them and they might gain about 1% of their body weight after eating - this is just a guess.

上面，我们首先在ANIMALS map ，并创建一个重量和类型相同的新对象，并借此机会喂食每个ANIMALS 。 我们喂养他们，他们进食后可能会增加体重的1％-这只是一个猜测。

Then we filter out only animals that have fur or feathers, notice we did this after feeding, since we don’t want to starve our lizard Lizzy 🦎:

然后我们只过滤出有毛皮或羽毛的动物，请注意，喂食后我们这样做了，因为我们不想饿死蜥蜴Lizzy🦎：

.filter((animal) => animal.type !== 'lizard') // only soft

.filter((animal) => animal.type !== 'lizard') // only soft

Then we filter out animals over a certain weight limit, which removes the dog’s entry 🐕:

然后我们筛选出超过一定重量限制的动物，从而删除狗的入口🐕：

.filter((animal) => animal.weight < 10) // only light (after eating)

.filter((animal) => animal.weight < 10) // only light (after eating)

Finally, we reduce the remaining animal rows into a single value, a number representing their weight 🐈🐦:

最后，我们将剩余的动物行简化为一个值，该数字代表它们的权重🐈🐦：

.reduce((weightSum, animal) => weightSum + animal.weight, 0); // get total weight

.reduce((weightSum, animal) => weightSum + animal.weight, 0); // get total weight

All of this is easily and flawlessly chained together thanks to Array prototypes and JavaScript magic.

借助Array原型和JavaScript魔术，所有这些都可以轻松，完美地链接在一起。

翻译自: https://levelup.gitconnected.com/level-up-your-javascript-arrays-with-these-four-building-block-functions-d01ca0971bcf

python 构件二维数组