Array traversal forEach () and map () methods in JavaScript and compatible writing _ javascript skills

The following small series will introduce you to the array traversal forEach () and map () methods in JavaScript and the compatible writing method. I think it is quite good. Now I will share it with you and give you a reference. Let's take a look at it with xiaobian. • Principle:

• Advanced browsers support the forEach Method

Syntax: Both forEach and map support two parameters: one is the callback function (item, index, list) and context;

• ForEach: Used to traverse each item in the array. This method does not return values and does not affect the original array;

• There are several items in the array, so the anonymous callback function passed in needs to be executed several times;

• Each time an anonymous function is executed, three parameter values are passed to it: the current item in the array, the index of the current item, and the input of the original array;

• Theoretically, this method does not return values. It only traverses each item in the array and does not modify the original array. However, we can modify the original array through the array index;

• In the forEach method, this is ary, and in the anonymous callback function, this is window by default;

Var ary = [12, 23, 24, 42, 1]; var res = ary. forEach (function (item, index, input) {input [index] = item * 10;}) console. log (res); // --> undefined; console. log (ary); // --> changes the original array;

• Map: similar to forEach, map is used to traverse each item in the array and traverse each item in the array;

• Difference: the callback function of map supports return values. What is the return value, which is equivalent to changing this item in the array (it does not affect the original array, just like cloning the original array and changing the corresponding items in the cloned array );

• Both forEach and map support the second parameter value. The second parameter indicates modifying this in the anonymous callback function.

var ary = [12,23,24,42,1];var res = ary.map(function (item,index,input) {   return item*10;})console.log(res);//-->[120,230,240,420,10];console.log(ary);//-->[12,23,24,42,1]

• Compatible Syntax:

• Both forEach and map are incompatible in the IE6-8 (not compatible in the Array. prototype), we need to encapsulate a method that is compatible with each other. The Code is as follows:

/*** ForEach traverses the Array * @ param callback [function] callback function; * @ param context [object] context; */Array. prototype. myForEach = function myForEach (callback, context) {context = context | window; if ('foreach' in Array. prototye) {this. forEach (callback, context); return;} // write the logic of the callback function execution in the IE6-8 for (var I = 0, len = this. length; I <len; I ++) {callback & callback. call (context, this [I], I, this );}}

/*** Map traversal Array * @ param callback [function] callback function; * @ param context [object] context; */Array. prototype. myMap = function myMap (callback, context) {context = context | window; if ('map' in Array. prototye) {return this. map (callback, context);} // the logic of callback function execution in the IE6-8 var newAry = []; for (var I = 0, len = this. length; I <len; I ++) {if (typeof callback = 'function') {var val = callback. call (context, this [I], I, this); newAry [newAry. length] = val ;}} return newAry ;}

PS: if any of the above statements is incorrect, please correct them. ^

The preceding introduction to the array traversal forEach () and map () methods and compatible writing methods in JavaScript is all the content that I have shared with you. I hope to give you a reference, I also hope that you will support your feet.