Examples of the new array method in ECMAScript5 _javascript tips

ECMAScript5 gives a series of new API interfaces, which are mostly supported in new browsers, supported by Ie9,chrome,firfor, and with a small number of APIs that are not supported by all browsers, and the following are only the most supported APIs. With the new API we can design a very reliable class, but also to maintain the original JavaScript style.

The ECMASCRIPT5 standard, published on December 3, 2009, brings a number of new ways to improve the operations of existing array arrays. (Note compatibility)

In ES5, there are 9 array methods: http://kangax.github.io/compat-table/es5/

Array.prototype.indexOf
Array.prototype.lastIndexOf
Array.prototype.every
Array.prototype.some
Array.prototype.forEach
Array.prototype.map
Array.prototype.filter
Array.prototype.reduce

Here are 7 of these methods, the first 5 are common, and many developers will use:

1, IndexOf ()

The IndexOf () method returns the position of the first element found in the array, or 1 if it does not exist.

var arr = [' Apple ', ' orange ', ' pear '],
found = false;
Not used
for (var i = 0, L = arr.length i < l i++) {
if (arr[i] = = ' Orange ') {
found = true;
}
}
Console.log ("Found:", found); ==> found:true
//after use

2, filter ()

The filter () method creates an array of new matching filter criteria.

Without filter ():

var arr=[{"name": "Apple", "Count": 2},{"name": "Orange", "Count": 5},{"name": "Pear", "count": 3},{"name": "Orange", " Count ":",]
var newArr = [];
for (var i = 0; i < arr.length i++) {
if (arr[i].name = = "Orange") {
Newarr.push (arr[i]);
}

Using the filter ():

var newArr = arr.filter (function (item) {return
Item.name = = "Orange";
});

3, ForEach ()

foreach executes the corresponding method for each element, and is used to replace the for loop.

var arr = [1, 2, 3, 4, 5, 6, 7, 8];
Use for loop
for (var i = 0, L = arr.length i < l i++) {
console.log (arr[i));
Use the ForEach loop
arr.foreach (function (item, index) {
console.log (item);

4, Map ()

Map () After each element of the array is manipulated (mapped), a new array is returned.

var Oldarr = [{first_name: "Colin", last_name: "Toh"}, {first_name: "Addy", Last_Name: "Osmani"}, {first_name: "Yehuda", Last_Name: "Katz"}];
function Getnewarr () {
var newArr = [];
for (var i = 0; i < oldarr.length i++) {
var item = oldarr[i];
Item.full_name = [Item.first_name, Item.last_name].join ("");
Newarr[i] = Item;
}
return NEWARR;
}
var personname = Getnewarr ();
Personname.foreach (function (item, index) {
console.log (item);
})
/**** Output Result:
Object {first_name: "Colin", Last_Name: "Toh", Full_name: "Colin Toh"}
Object {first_name: "Addy", Last_Name: "Osmani", Full_name: "Addy Osmani"}
Object {first_name: "Yehuda", last_name: "Katz", Full_name: "Yehuda K Atz "}

Use the Map () method:

function Getnewarr () {return
Oldarr.map (function (item, index) {
item.full_name = [Item.first_name, item.last_ Name].join ("");
return item;
})
}
var personname = Getnewarr ();
Personname.foreach (function (item, index) {
console.log (item);
})
/**** Output Result:
Object {first_name: "Colin", Last_Name: "Toh", Full_name: "Colin Toh"}
Object {first_name: "Addy", Last_Name: "Osmani", Full_name: "Addy Osmani"}
Object {first_name: "Yehuda", last_name: "Katz", Full_name: "Yehuda K Atz "}

5. Reduce ()

Reduce () can implement an accumulator function that lowers each value of the array (left to right) to a value. It can also be understood as: let the preceding and bottom of the array do some arithmetic, and accumulate the final value;

Scene: Statistics How many words in an array are not repeated;

var arr = ["Apple", "orange", "apple", "orange", "pear", "orange"];
function getwordcnt () {
var obj = {};
for (var i = 0; i < arr.length i++) {
var item = arr[i];
Obj[item] = (Obj[item] + 1) | | 1;
}
return obj;
}
Console.log (getwordcnt ());
Output results:

After using reduce ():

var arr = ["Apple", "orange", "apple", "orange", "pear", "orange"];
function getwordcnt () {return
arr.reduce (function (prev, next) {
Prev[next] = (Prev[next] + 1) | | 1;
return prev;
}, {});
Console.log (getwordcnt ());
Output results:

6, Array.some (callback[, Thisobject]); callback: Functions are used to test certain elements.

Thisobject: Object is used as the execution callback.

Detects if there are certain items in the array that meet the criteria;

var scores = [A, n,];
var current =;
Function passed (score) {return
score > current;
}

7, Array.every (callback[, Thisobject]);callback : Functions are used to test each element. Thisobject: Object is used as the execution callback.

Detects whether each entry in the array meets the criteria;

var scores = [A, n,];
var current =;
Function passed (score) {return
score > current;
}
Console.log (Scores.every (passed)); = = > False

Through the above example to introduce the new array method ECMAScript5, hope to help everyone!