zoukankan      html  css  js  c++  java
  • js数组中容易误用的一些方法

    1.every和some

    两个方法的参数都是一个函数,函数的有3个参数,依次是当前值value,索引index,数组array

    every判断数据中的每一项是否满足某个条件,如果满足就返回true,有一项不符合就返回false

    var arr = [1,2,3]
    var b = arr.every(function(value,index,arr){
    	if(value>2){
    		return true
    	}
    })
    console.log(b) // false

    some判断数组中的某一项是否满足某个条件,如果满足就返回true,都不满足就返回false

    var arr = [1,2,3]
    var b = arr.some(function(value,index,arr){
        if(value>2){
        	return true
        }
    })
    console.log(b) // true

    every和some返回的结果都是boolean值,而不是数组。

    2. reduce

    调用方式array.reduce(callback[, initialValue]); 对数组中的每一个元素(从左到右)执行callback函数累加,callback的参数有4个prev(数组第一个值或者出入的初始值initialValue) value(当前值),index(当前值索引),arr(数组)

    如果有初始值,reduce会从数组第一元素开始执行,callback会执行array.length次。如果没有初始值,reduce会从数组第二个元素开始执行,callback会执行array.length-1次。

    有初始值

    var arr = [1,2,3]
    var sum = arr.reduce(function(prev,cur,index,arr){
        console.log('index:',index,prev,cur)
        return prev+cur
    },0)
    // 打印结果
    // index: 0 0 1
    // index: 1 1 2
    // index: 2 3 3

    无初始值

    var arr = [1,2,3]
    var sum = arr.reduce(function(prev,cur,index,arr){
    	console.log('index:',index,prev,cur)
    	return prev+cur
    })
    // 打印结果
    // index: 1 1 2
    // index: 2 3 3

    3.indexOf 和 includes的区别

    • 返回值不同:indexOf返回的是数值类型,而includes返回的是boolean值

    • 对NaN的处理方式不同,

    • 对稀疏数组的处理结果不同。

    var a = [NaN]
    console.log(a.indexOf(NaN))  // -1
    console.log(a.includes(NaN)) // true
    
    var b = [1,,3]
    console.log(b.indexOf(undefined)) // -1
    console.log(b.includes(undefined)) // true

    4.find

    调用方式 arr.find(callback[, thisArg])。find 方法对数组中的每一项元素执行一次 callback 函数,直至有一个 callback 返回 true。当找到了这样一个元素后,该方法会立即返回这个元素的值 。callback 函数带有3个参数:当前元素的值、当前元素的索引,以及数组本身

    var a = [1,2,3]
    var b = a.find(function(value,index,arr){
    	return value > 1
    })
    console.log(b) // 2
    

      

    find返回的是元素的值,而不是元素在数组中的索引,要返回数组的索引,使用findIndex

    5.copyWithIn

    调用方式arr.copyWithin(target[, start[, end]])

    • target,复制的序列要插入到数组中的位置

    • start,开始复制元素的起始位置

    • end,开始复制元素的结束位置,如果被忽略,默认copyWithin将会复制到arr.ength

    var arr = [1,2,3,4,5]
    arr.copyWithin(0,3)
    console.log(arr) // [4, 5, 3, 4, 5]

    这个方法会修改原来的数组

     

  • 相关阅读:
    mobile web retina 下 1px 边框解决方案
    git基础操作
    JavaScript词法分析
    JS给元素循环添加事件的问题
    useMemo优化React Hooks程序性能,解决子组件重复执行问题
    使用 useReducer 和 useCallback 解决 useEffect 依赖诚实与方法内置&外置问题
    createContext 和 useContext 结合使用实现方法共享(React Hook跨组件透传上下文与性能优化)
    浅谈开发变量作用域---小坑
    优雅的在React项目中使用Redux
    浅谈react无状态组件(哑组件)和有状态组件(智能组件)的区别
  • 原文地址:https://www.cnblogs.com/gg1234/p/9279749.html
Copyright © 2011-2022 走看看