Array Literals（二）

 arr.filter(callback[, thisArg]) Array.prototype.filter()

说明：creates a new array with all elements that pass the test(通过验证条件) implemented(用) by the provided function(给定的方法)

callback is invoked with three arguments:
1. the value of the element
2. the index of the element
3. the Array object being traversed

// 例子1. Filtering out all small values
function isBigEnough(vaue) {
    return vaue >= 10;
}
var fitered = [12, 5, 8, 130, 44].filter(isBigEnough);
console.log('fitered:::' + fitered);
/* display:
fitered:::12,130,44     
*/
 
// 例子2.  create a filtered json of all elements with non-zero, numeric id
var arr = [
  { id: 15 },
  { id: -1 },
  { id: 0 },
  { id: 3 },
  { id: 12.2 },
  { },
  { id: null },
  { id: NaN },
  { id: 'undefined' }
];
    
var invalidEntries = 0;

function filterByID(obj) {
    if ('id' in obj && typeof(obj.id) === 'number' && !isNaN(obj.id)) {
        return true;
    } else {
        invalidEntries++;
        return false;
    }
}

var arrByID = arr.filter(filterByID);
    
console.log('过滤之后的 Array \n ', arrByID);
console.log('Number of Invalid Entries = ', invalidEntries); 

/* display:
过滤之后的 Array 
[Object, Object, Object, Object, Object]
Number of Invalid Entries =  4 
*/

 

 

arr.map(callback[, thisArg]) Array.prototype.map()
说明：creates a new array with the results of calling a provided function(调用一个给定的方法) on every element in this array(数组中的每个元素).
callback

　　Function that produces an element of the new Array, taking three arguments:
　　1. currentValue
　　The current element being processed in the array.
　　2. index
　　The index of the current element being processed in the array.
　　3.array
　　The array map was called upon.
thisArg
　　Optional. Value to use as this when executing callback.

// 例一：Mapping(绘制) an array of numbers to an array of square roots(平方根形式数组)
var numbers = [1, 4, 9];
var roots = numbers.map(Math.sqrt);
// roots is now [1, 2, 3], numbers is still [1, 4, 9]

// 例二：Using map to reformat objects(重新格式化对象数据) in an array
var kvArray = [{key:1, value:10}, {key:2, value:20}, {key:3, value: 30}];
var reformattedArray = kvArray.map(function(obj){ 
   var rObj = {};
   rObj[obj.key] = obj.value;
   return rObj;
});
// reformattedArray is now [{1:10}, {2:20}, {3:30}], 
// kvArray is still [{key:1, value:10}, {key:2, value:20}, {key:3, value: 30}]

// 例三：Mapping an array of numbers using a function containing(包含) an argument
var numbers = [1, 4, 9];
var doubles = numbers.map(function(num) {
  return num * 2;
});
// doubles is now [2, 8, 18]. numbers is still [1, 4, 9]
    
// 例四：using map generically querySelectorAll
var elems = document.querySelectorAll('select option:checked');
var values = [].map.call(elems, function(obj) {
  return obj.value;
});
    
var str = '12345';
[].map.call(str, function(x) {
  return x;
}).reverse().join(''); 

// Using map to reverse a string
// Output: '54321'
// Bonus: use '===' to test if original string was a palindrome

 

arr.reduce(callback[, initialValue]) Array.prototype.reduce()
说明：The reduce() method applies a function(应用一个函数) against an accumulator(配备一个累加器) and each value of the array(适用于数组中的每个元素) (from left-to-right) has to reduce it to a single value.(数组中多个数值最终变成一个数值)

[2, 3, 4, 5, 4].reduce(function(previousValue, currentValue, index, array) {
  console.log('prev:' + previousValue + " / curr:" + currentValue + " / index:" + index + " / arr:" + array);
  return previousValue + currentValue;
});

console.log('------------------------------');
    
[2, 3, 4, 5, 4].reduce(function(previousValue, currentValue, index, array) {
  console.log('prev:' + previousValue + " / curr:" + currentValue + " / index:" + index + " / arr:" + array);
  return previousValue + currentValue;
}, 10);

/* display:
prev:2 / curr:3 / index:1 / arr:2,3,4,5,4 
prev:5 / curr:4 / index:2 / arr:2,3,4,5,4 
prev:9 / curr:5 / index:3 / arr:2,3,4,5,4 
prev:14 / curr:4 / index:4 / arr:2,3,4,5,4
------------------------------ 
prev:10 / curr:2 / index:0 / arr:2,3,4,5,4 
prev:12 / curr:3 / index:1 / arr:2,3,4,5,4 
prev:15 / curr:4 / index:2 / arr:2,3,4,5,4 
prev:19 / curr:5 / index:3 / arr:2,3,4,5,4 
prev:24 / curr:4 / index:4 / arr:2,3,4,5,4 
*/

var flattened = [[0, 1], [2, 3], [4, 5]].reduce(function(a, b) {
  return a.concat(b);
});
// flattened is [0, 1, 2, 3, 4, 5]

 

arr.reduceRight(callback[, initialValue]) Array.prototype.reduceRight()

说明：The reduce() method applies a function against an accumulator and each value of the array (from right-to-left) has to reduce it to a single value.

 

arr.some(callback[, thisArg]) Array.prototype.some()
tests whether some element in the array passes the test implemented by the provided function

arr.every(callback[, thisArg]) Array.prototype.every()
tests whether all elements element in the array passes the test implemented by the provided function

function isBiggerThan10(element, index, array) {
  return element > 10;
}
console.log([2, 5, 8, 1, 4].some(isBiggerThan10));  // false
console.log([2, 5, 8, 11, 4].some(isBiggerThan10)); // true
console.log([12, 15, 18, 11, 14].some(isBiggerThan10)); // true

console.log([2, 5, 8, 1, 4].every(isBiggerThan10));  // false
console.log([2, 5, 8, 11, 4].every(isBiggerThan10)); // false
console.log([12, 15, 18, 11, 14].every(isBiggerThan10)); // true

 

arr.sort([compareFunction]) Array.prototype.sort()
说明： sorts the elements of an array in place and returns the array.The default sort order is according to string Unicode code points

var fruit = ['Cherries', 'apples', 'bananas'];
fruit.sort(); // ['apples', 'bananas', 'Cherries']

var scores = [1, 10, 2, 21]; 
scores.sort(); // [1, 10, 2, 21]
// Watch out that 10 comes before 2,
// because '10' comes before '2' in Unicode code point order.
// 你可以这样做的
var numbers = [4, 2, 5, 1, 3];
numbers.sort(function(a, b) {
  return a - b;
});
console.log(numbers); // [1, 2, 3, 4, 5] 

var things = ['word', 'Word', '1 Word', '2 Words'];
things.sort(); // ['1 Word', '2 Words', 'Word', 'word']
// In Unicode, numbers come before upper case letters,
// which come before lower case letters.

var items = [
  { name: 'Edward', value: 21 },
  { name: 'Sharpe', value: 37 },
  { name: 'And', value: 45 },
  { name: 'The', value: -12 },
  { name: 'Magnetic' },
  { name: 'Zeros', value: 37 }
];
items.sort(function (a, b) {
  if (a.name > b.name) {
    return 1;
  }
  if (a.name < b.name) {
    return -1;
  }
  // a must be equal to b
  return 0;
});
console.log(items);  
/*
[Object, Object, Object, Object, Object, Object]
    0: Object
    name: "And"
    value: 45
    __proto__: Object
    1: Object
    name: "Edward"
    value: 21
    __proto__: Object
    2: Object
    name: "Magnetic"
    __proto__: Object
    3: Object
    name: "Sharpe"
    value: 37
    __proto__: Object
    4: Object
    name: "The"
    value: -12
    __proto__: Object
    5: Object
    name: "Zeros"
    value: 37
    __proto__: Object
    length: 6
    __proto__: Array[0]
*/

 

arr.reverse()
说明：reverses an array in place

var myArray = ['one', 'two', 'three'];
myArray.reverse();
console.log(myArray) // ['three', 'two', 'one']