15个必须知道的JavaScript方法

广告位

some() 此方法为参数传递的函数测试数组。如果有一个元素与测试元素匹配,则返回true&#x…

  1. some()
    此方法为参数传递的函数测试数组。如果有一个元素与测试元素匹配,则返回true,否则返回false。

注: some() 不会对空数组进行检测。

 const arr = ["a","b","c","d"];  console.log(arr.some(test => test === "e"));      //false  console.log(arr.some(test => test === "a"));      //true 
  1. reduce()
    reduce()方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。

共有四个参数:
total 必需。初始值, 或者计算结束后的返回值。
currentValue 必需。当前元素
currentIndex 可选。当前元素的索引
arr 可选。当前元素所属的数组对象。

const arr = [1,2,3,4,5]; let result = arr.reduce((total,value)=>total*value); console.log(result)       //120    1*2*3*4*5 
  1. every()
    every()方法是对数组中每项运行给定函数,如果数组的每个元素都与测试匹配,则返回true,反之则返回false。

参数:array.every(function(currentValue,index,arr), thisValue)
以下三个是function里面的参数
currentValue 必须。当前元素的值
index 可选。当前元素的索引值
arr 可选。当前元素属于的数组对象
thisValue 可选。对象作为该执行回调时使用,传递给函数,用作 “this” 的值。
如果省略了 thisValue ,“this” 的值为 “undefined”

 const arr = [1,2,3,4,5];  const arr1 = [1,1,1,1,1];   let result1 = arr.every(item => item === 1);        //只有一项匹配  let result2 = arr1.every(item => item === 1);       //每项都会匹配  console.log(result1,result2)           //false true 
  1. map()
    map() 方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。

语法:array.map(function(currentValue,index,arr), thisValue)
currentValue 必须。当前元素的值
index 可选。当前元素的索引值
arr 可选。当前元素属于的数组对象
thisValue同上

        const arr = [1,2,3,4,5];         console.log(arr.map(x => x*x));         // (5) [1, 4, 9, 16, 25]         // 0: 1         // 1: 4         // 2: 9         // 3: 16         // 4: 25         console.log(arr.map((cur,i) => {             return cur*i         }))         // (5) [0, 2, 6, 12, 20] 
  1. flat()
    此方法创建一个新数组,其中包含子数组上的holden元素,并将其平整到新数组中。请注意,此方法只能进行一个级别的深度。
const arr = [[1,2,3],1,[23,4]]; console.log(arr.flat()); //[1, 2, 3, 1, 23, 4]  const arr = [[1,2,3],1,[23,4,[100,200]]]; console.log(arr.flat()); /*  [1, 2, 3, 1, 23, 4, Array(2)] 0: 1 1: 2 2: 3 3: 1 4: 23 5: 4 6: (2) [100, 200]*/ 
  1. filter()
    filter() 方法创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素。filter不会改变原数组

array.filter(function(currentValue,index,arr), thisValue)

const ages = [1,2,3,4,5]; function check(age){     return age>3; } console.log(ages.filter(check));         //[4,5]   const arr = [       { id: 1, name: "john" },       { id: 2, name: "Ali" },       { id: 3, name: "Mass" },       { id: 4, name: "Mass" } ] function nameq(n){     return n.name === 'john' } console.log(arr.filter(nameq))   // [{…}] // 0: {id: 1, name: "john"} // length: 1 
  1. forEach()
    forEach() 方法用于调用数组的每个元素,并将元素传递给回调函数
    forEach() 对于空数组是不会执行回调函数的。

array.forEach(function(currentValue, index, arr), thisValue)

const arr = [1,2,3,4,5]; arr.forEach((item,index,arr)=>{     console.log(item,index,arr); }) // 1 0 (5) [1, 2, 3, 4, 5] // 2 1 (5) [1, 2, 3, 4, 5] // 3 2 (5) [1, 2, 3, 4, 5] // 4 3 (5) [1, 2, 3, 4, 5] // 5 4 (5) [1, 2, 3, 4, 5] 
  1. findIndex()
    此方法返回传入一个测试条件(函数)符合条件的数组第一个元素位置。它为数组中的每个元素都调用一次函数执行,当数组中的元素在测试条件时返回 true 时, findIndex() 返回符合条件的元素的索引位置,之后的值不会再调用执行函数。如果没有符合条件的元素返回 -1。
    findIndex() 并没有改变数组的原始值。
const arr = [1,2,3,4,5]; console.log(arr.findIndex(element=>element === 3));      //2 
  1. find()
    find() 方法为数组中的每个元素都调用一次函数执行:当数组中的元素在测试条件时回 true 时, **find() 返回符合条件的元素,之后的值不会再调用执行函数。**如果没有符合条件的元素返回 undefined
const arr = [1,2,3,4,5];  console.log(arr.find(element=>element === 0));     //undefined   console.log(arr.find(element=>element === 3));     //3  
  1. sort()
    此方法接收一个函数作为参数。它对数组的元素进行排序并返回它。也可以使用含有参数的sort()方法进行排序。
const arr = [1,2,3,4,5]; console.log(arr.sort((a,b)=>b-a));   // [5, 4, 3, 2, 1] 
  1. concat()
    连接数组或值,不会改变现有数组,而仅仅返回被连接数组的一个新数组。
const arr = [1,2,3,4,5]; const arr1 = [2,3,4,5,6,7,8]; console.log(arr.concat(arr1));   // [1, 2, 3, 4, 5, 2, 3, 4, 5, 6, 7, 8] 
  1. fill()
    此方法的作用是使用一个固定值来替换数组中的元素。该固定值可以是字母、数字、字符串、数组等等。它还有两个可选参数,表示填充起来的开始位置(默认为0)与结束位置(默认为array.length)。
var fruits = ["Banana", "Orange", "Apple", "Mango"]; fruits.fill("Runoob", 2, 3);  //["Banana", "Orange", "Runoob", "Mango"] fruits.fill("Runoob", 2, 4);  //["Banana", "Orange", "Runoob", "Runoob"] console.log(fruits); 
  1. includes()
    此方法用于判断字符串是否包含指定的子字符串。如果找到匹配的字符串则返回 true,否则返回 false。
const arr = [1,3,4,5]; console.log(arr.includes(1));  //true 
  1. reserve()
    此方法用于颠倒数组中元素的顺序。第一个元素成为最后一个,最后一个元素将成为第一个。
const arr = [1,3,4,5]; console.log(arr.reverse());  //[5, 4, 3, 1] 
  1. flatMap()
    该方法将函数应用于数组的每个元素,然后将结果压缩为一个新数组。它在一个函数中结合了flat()和map()。
const arr = [[1],[2],[3],[3]]; console.log(arr.flatMap(arr => arr*10));  //[10, 20, 30, 30] 

墨眉朱砂, 程

关于作者: 墨眉朱砂

为您推荐