Shulou(Shulou.com)06/01 Report--

Most people don't understand the knowledge points of this article "javascript forEach traversal method", so Xiaobian summarizes the following contents for everyone, the content is detailed, the steps are clear, and it has certain reference value. I hope everyone can gain something after reading this article. Let's take a look at this article "javascript forEach traversal method" article.

forEach

forEach as a more outstanding traversal operation, there have been many libraries before it has been wrapped in various ways, but I still find that many people do not understand forEach very well.

For example, the second parameter this is used.

I am used to doing this:

const self = this arr.forEach(function(item) { // do something with this })

However, if you use the second parameter, you can do this:

arr.forEach(function(item) { // do something with this }, this)

omitting a middle self, looks more beautiful

Is there a better way to deal with it?

Yes:

arr.forEach(item => { // do something })

Due to the characteristics of arrow function, automatically binding this of the parent scope will be more concise, and there is less function keyword, which is more readable.

for

When it comes to loops, it has to be said for loops. The for loop in JS can be used in several ways:

C Series for Cycle:

for (let index = 0; index

< arr.length; index++) { // do something } index 是 arr 的索引，在循环体中通过 arr[index] 调用当前的元素，我非常不喜欢这种方式，因为要写两个分号! 还有另一种比较简单的方式： for (let key in obj) { // do something } 不过这个方式一般用来遍历对象，下文有说。 关于 for 循环还有 ES2015 规定的一种 for (let item of arr) { // do something } 这种遍历方式和之前的***区别在于item，它是value而非key，可以直接迭代出内容。 不过这种方式我个人用的不多，因为很多情况下我更喜欢用array下的方法。对于对象的遍历更倾向于for...in map 系列 这一块是js的函数式领域了。 Array.prototype下挂载着几个非常好用的遍历函数。比如map 它会遍历arr下的所有内容，做操作之后返回数据，形成一个新的数组： const arr = [1, 2, 3] arr.map(current =>

current * 5)

React is most commonly used. Often used to traverse data to form dom:

someRender() { return this.state.data.map((current, index) => { return { current } }) }

The downside of map is that it doesn't control the flow of the loop, and if it doesn't complete, it returns undefined to continue with the next iteration. So if you encounter situations that may return undefined, you should use forEach or for loop traversal

Filter is used exactly like map, except it filters data. Very easy to use.

arguments

Speaking of traversal, we have to mention arguments, all arguments in function(), which is oddly not an array. Just an array of classes.

Generally, it needs to be converted into an array:

function foo() { const args = Array.prototype.slice.call(arguments) return Array.isArray(args) }

But I personally don't agree with this method. With the new ES2015, don't use such ugly grammar.

function foo(... args) { // args is an array}

ES2015's rest syntax allows the rest of the parameters to be passed into args, which is much easier than the previous method of adjusting Array.

object

Object traversal is a very common feature.

I personally prefer to use for... In grammar, but there is one thing to note:

for (let index in obj) { if(obj.hasOwnProperty(index)) { // do something } }

Because objects are impure unless mandated. It has a__proto__attribute and is iterated out. It needs to be filtered.

So, how do you create pure objects?

const plainObj = Object.create(null)

The lightest obj structure, with no extra attributes inside.

The above is the content of this article about "javascript for Each traversal method". I believe everyone has a certain understanding. I hope the content shared by Xiaobian will help everyone. If you want to know more relevant knowledge content, please pay attention to the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.