reduce()方法的学习和整理

今天看文章的时候看到reduce方法去做循环比较是较为优雅的写法,遂学习了一波,现整理如下。

文章链接:https://www.jianshu.com/p/e375ba1cfc47

1. 语法

reduce() 方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。
reduce() 可以作为一个高阶函数,用于函数的 compose。
注意: reduce() 对于空数组是不会执行回调函数的。

arr.reduce(callback,[initialValue])

callback详解:

  1. previousValues: 上一次调用回调函数返回的值,第一次是 initialValue的值,如何未设置 initialValue 值,是数组的第一个元素的值
  2. currentValue: 数组当前被处理的值,未设置 initialValue ,为数组的第二个元素的值。
  3. index:当前元素在数组中的索引。默认值为1,设置 initialValue 则为 initialValue的值
  4. array:调用reduce方法的数组
  5. initialValue: 第一次调用callback的第一个参数

2. 实例

var arr = [1, 2, 3, 4];
var sum = arr.reduce(function(prev, cur, index, arr) {
    console.log(prev, cur, index);
    return prev + cur;
})
console.log(arr, sum);

打印结果:
1 2 1
3 3 2
6 4 3
[1, 2, 3, 4] 10

3. 其他语法

  1. if in
	if ( cur in pre ) {
       pre[cur]++
  	}

if in 用法是判断属性是否属于对象
上述代表的是在 pre 中是否有 cur 属性

注: in 我一般用于 for in 没使用过 if in,还是见识少,要多看书和文章。

  1. includes
   if ( !pre.includes(cur) ) {
      return pre.concat(cur)
    }

ncludes() 方法用于判断字符串是否包含指定的子字符串。
如果找到匹配的字符串则返回 true,否则返回 false。
includes() 方法区分大小写。

故上述代码是用来判断 cur 中是否包含字符串 pre

4. 讨论

和后台男朋友说到元素匹配数组,男朋友告诉我后台有个 contains 方法,js里面可能也有,搜索了一下发现是jQuery 里的 contains,方法是用来判断dom元素的包含关系的。

$.contains() 方法用于判断指定元素内是否包含另一个元素。即判断另一个DOM元素是否是指定DOM元素的后代。

实例:

$(function () {
    function funcontain( html ){
        document.body.innerHTML += "
" + html; } funcontain($.contains( document.documentElement, document.body )); // true funcontain($.contains( document.body, document.documentElement )); // false })

but 看文章的时候发现有个数组有个 indexOf 判断数组内某个元素是否存在,只用字符串的 indexOf ,一查文档,发现还真的有,又学到一个。写法和字符串的一致,返回元素所在的位置,没有找到返回-1。

有个大佬的文章讲这个的,分析的不错。

你可能感兴趣的:(JavaScript,javascript)