Java Script 初学笔记——常用函数

1 Array.prototype.filter()

filter() 方法创建一个新数组, 其包含通过所提供函数实现的测试的所有元素。

//ES5
var filtered = [12, 5, 8, 130, 44].filter(function (value) {
    return value >= 10;
});
console.log(filtered); // filtered is [12, 130, 44]

//ES6
let [...spraed]= [12, 5, 8, 130, 44];
let filtered = spraed.filter(value => value >= 10);
console.log(filtered);// filtered is [12, 130, 44]
  • filter 不会改变原数组( filter 遍历的元素,是传入 callback 那一刻的值,之后数组的改变不影响遍历的结果)
  • 返回值: 一个由原数组中满足条件的元素组成的新数组

2 Array.prototype.forEach()

forEach() 方法对数组的每个元素执行一次提供的函数。
[].forEach(function(value, index, array) { // ...});

  • forEach() 方法就是对每个元素进行遍历,循环
  • 返回值:总是返回 undefined值,并且不可链式调用

3 Array.prototype.includes()

includes() 方法用来判断一个数组是否包含一个指定的值,如果是,酌情返回 true或 false。

arr.includes(searchElement)
arr.includes(searchElement, fromIndex)
//fromIndex 为负值时,默认索引从0开始,整个数组都被搜索
//fromIndex 大于等于数组长度时,返回 false,数组不会被搜索

includes() 方法可以被用于其他类型的对象:

(function() {
  console.log([].includes.call(arguments, 'a')); // true
  console.log([].includes.call(arguments, 'd')); // false
})('a','b','c');
相当于
console.log(['a','b','c'].includes('a')); // true
console.log(['a','b','c'].includes('d')); // false
  • 返回值:判断后返回 true / false

4 Array.prototype.map()

map() 方法创建一个新数组,其结果是该数组中的每个元素都调用一个提供的函数后返回的结果。

  • map方法会给原数组中的每个元素都按顺序调用一次函数。函数每次执行后的返回值(包括undefined)组合起来形成一个新数组。
  • map 不修改调用它的原数组本身
  • 返回值:与forEach() 方法类似,但是返回值不同,map返回新数组
var map = Array.prototype.map
var a = map.call("Hello World", function(x) { 
  return x.charCodeAt(0); 
})
// a的值为[72, 101, 108, 108, 111, 32, 87, 111, 114, 108, 100]
//如何去遍历用 querySelectorAll 得到的动态对象集合
var elems = document.querySelectorAll('select option:checked');
var values = Array.prototype.map.call(elems, function(obj) {
  return obj.value;
});
//反转字符串
var str = '12345';
Array.prototype.map.call(str, function(x) {
  return x;
}).reverse().join(''); 

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

5 Array.prototype.reduce()

reduce() 方法对累加器和数组中的每个元素 (从左到右)应用一个函数,将其减少为单个值。

  • 返回值:函数累计处理的结果
var total = [0, 1, 2, 3].reduce(function(sum, value) {
  return sum + value;
}, 0);
// total is 6
或
 [0, 1, 2, 3].reduce( (prev, curr) => prev + curr );

var flattened = [[0, 1], [2, 3], [4, 5]].reduce(function(a, b) {
  return a.concat(b);
}, []);
// flattened is [0, 1, 2, 3, 4, 5]
求最大值
var maxCallback = ( pre, cur ) => Math.max( pre.x, cur.x );
var maxCallback2 = ( max, cur ) => Math.max( max, cur );

[ { x: 22 }, { x: 42 } ].reduce( maxCallback ); // 42
// map/reduce; better solution, also works for empty arrays
[ { x: 22 }, { x: 42 } ].map( el => el.x )
                        .reduce( maxCallback2, -Infinity );
计算数组中每个元素出现的次数
var names = ['Alice', 'Bob', 'Tiff', 'Bruce', 'Alice'];
var countedNames = names.reduce(function (allNames, name) { 
  if (name in allNames) {
    allNames[name]++;
  }
  else {
    allNames[name] = 1;
  }
  return allNames;
}, {});
// countedNames is:
// { 'Alice': 2, 'Bob': 1, 'Tiff': 1, 'Bruce': 1 }

6 Array.prototype.find()

find() 方法返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined

你可能感兴趣的:(Java Script 初学笔记——常用函数)