ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

数组高频方法梳理

2021-06-02 12:04:19  阅读:237  来源: 互联网

标签:console log foods let 西兰花 数组 高频 梳理


参考文档:

  1. MDN-Array

  2. by flower


join()

把数组转换为字符串,通过给定的字符进行连接,默认是,

let foods = ['西瓜', '南瓜', '北瓜'];

console.log(foods.join());
// 输出: "西瓜,南瓜,北瓜"

console.log(foods.join(''));
// 输出: "西瓜南瓜北瓜"

console.log(foods.join('-'));
// 输出: "西瓜-南瓜-北瓜"

push()

把一个或多个元素添加到数组的末尾,并返回新的数组长度

let foods = ['西兰花', '花菜']
let length = foods.push('西红柿')
console.log(length)
// 输出:3
console.log(foods)
// 输出: ['西兰花','花菜','西红柿']
foods.push('西瓜', '南瓜', '北瓜', '冬瓜')
console.log(foods)
// 输出: ['西兰花', '花菜', '西红柿', '西瓜', '南瓜', '北瓜', '冬瓜']

pop()

从数组中删除最后一个元素,并返回该元素的值。注意:数组的长度会发生改变

let foods = ['西兰花','花菜']
let food = foods.pop()
console.log(food)
// 输出: 花菜
console.log(foods)
// 输出: ['西兰花']

shift()

从数组中删除第一个元素,并返回该元素的值。注意:数组的长度会发生改变

let foods = ['西兰花', '花菜']
let food = foods.shift()
console.log(food)
// 输出: 西兰花
console.log(foods)
// 输出: ['花菜']

unshift()

将一个或者多个元素添加到数组的开头,并返回数组的新长度

let foods = ['西兰花', '花菜']
let length = foods.unshift('西瓜')
console.log(length)
// 输出: 3
console.log(foods)
// 输出: ['西瓜','西兰花','花菜']
foods.unshift('南瓜', '冬瓜')
console.log(foods)
// 输出: ['南瓜','冬瓜','西瓜','西兰花','花菜']

sort()

对数组的元素进行排序,并返回数组。默认比较的数组元素转为字符串的utf-16的顺序,也可以传入函数进行排序

对象可以按照某个属性排序:

let items = [
  { name: 'Edward', value: 21 },
  { name: 'Sharpe', value: 37 },
  { name: 'And', value: 45 },
  { name: 'The', value: -12 },
  { name: 'Magnetic' },
  { name: 'Zeros', value: 37 }
];

// sort by value
items.sort(function (a, b) {
  return (a.value - b.value)
});

// sort by name
items.sort(function(a, b) {
  var nameA = a.name.toUpperCase(); // ignore upper and lowercase
  var nameB = b.name.toUpperCase(); // ignore upper and lowercase
  if (nameA < nameB) {
    return -1;
  }
  if (nameA > nameB) {
    return 1;
  }

  // names must be equal
  return 0;
});

reverse()

将数组进行翻转,并返回该数组。注意:改变的是原始数组

  let foods = ['西兰花', '花菜']
  foods.reverse()
  console.log(foods)
  // 输出: ['花菜','西兰花']

concat()

用来合并两个或者多个数组,返回的是新数组,不会改变原始数组

let foods = ['西兰花', '花菜']
let fruits = ['西瓜', '香蕉']
console.log(foods.concat(fruits))
// 输出: ['西兰花', '花菜','西瓜','香蕉']
let meats = ['牛肉', '猪肉']
console.log(foods.concat(fruits, meats))
// 输出: ['西兰花', '花菜','西瓜','香蕉','牛肉','猪肉']

slice()

切下一段数组,不包括end索引!!!

**slice()** 方法返回一个新的数组对象,这一对象是一个由 beginend 决定的原数组的浅拷贝(包括 begin**不包括end**

  let foods = ['西兰花', '花菜','西瓜','香蕉','牛肉','猪肉']  console.log(foods.slice(5))  // 输出: ['猪肉']  console.log(foods.slice(3,5))  // 输出: ['香蕉','牛肉']

splice()

根据给定的起始索引操作个数删除指定个元素,会改变原数组

  let foods = ['西兰花', '花菜','西瓜','香蕉','牛肉','猪肉']  // 从索引1开始删除1个元素  foods.splice(1,1)  console.log(foods)  // 输出: ['西兰花', '西瓜', '香蕉', '牛肉', '猪肉']  // 从索引2开始删除,删除所有  foods.splice(2)  console.log(foods)  // 输出: ['西兰花', '西瓜']

indexOf()

返回在数组中可以找到的符合条件的第一个索引值,如果不存在,返回-1

let foods =['西瓜','西兰花']console.log(foods.indexOf('西兰花'))// 输出: 1console.log(foods.indexOf('花菜'))// 输出: -1

lastIndexOf()

从后往前查找符合条件的元素,符合返回索引,如果不存在,返回-1

let foods =['西兰花','西瓜','西兰花']console.log(foods.lastIndexOf('西兰花'))// 输出: 2console.log(foods.lastIndexOf('花菜'))// 输出: -1

forEach()

将数组的每一个元素,挨个的传递给传入的回调函数

回调函数会接收三个参数,分别为

  • element
    当前元素。
  • index
    当前元素的索引。
  • array
    调用forEach的数组。
let foods =['西兰花','西瓜','西兰花']foods.forEach(v=>{console.log(v)})// 依次输出: 西兰花 西瓜 西兰花

map()

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

回调函数会接收三个参数,分别为

  • element
    当前元素。
  • index
    当前元素的索引。
  • array
    调用findIndex的数组。
let foods = ['西兰花', '西瓜']let newFoods = foods.map(v => {return v + '好好吃'})console.log(foods)// 输出: ['西兰花', '西瓜']console.log(newFoods)// 输出: ['西兰花好好吃', '西瓜好好吃']

filter()

返回一个新的数组,新数组的元素是数组中每个元素调用一个提供的函数,根据返回值的真假决定是否保留,过滤每一个元素并返回一个新数组

回调函数会接收三个参数,分别为

  • element
    当前元素。
  • index
    当前元素的索引。
  • array
    调用findIndex的数组。
  let foods = ['西兰花', '西瓜', '花椒', '剁椒']  console.log(    foods.filter(v => {      return v.indexOf('西') == 0    })  )  // 输出: ['西兰花', '西瓜']

every()

检验数组中的每个值是否都满足回调函数的校验,都满足结果为true,反之为false

回调函数会接收三个参数,分别为

  • element
    当前元素。
  • index
    当前元素的索引。
  • array
    调用findIndex的数组。
  let numArr = [2, 5, 6, 7, 8, 9]  console.log(    numArr.every(v => {      return v > 2    })  )  // 输出: false  console.log(    numArr.every(v => {      return v >= 2    })  )  // 输出: true

some()

every类似,只需要有任意一个元素满足回调函数的校验条件结果就是true,都不满足就是false

回调函数会接收三个参数,分别为

  • element
    当前元素。
  • index
    当前元素的索引。
  • array
    调用findIndex的数组。
  let numArr = [2, 5, 6, 7, 8, 9]  console.log(    numArr.some(v => {      return v == 1    })  )  // 输出: false  console.log(    numArr.some(v => {      return v == 2    })  )  // 输出: true

find()

返回满足提供的回调函数校验的第一个元素的值,如果都不满足,返回undefined

回调函数会接收三个参数,分别为

  • element
    当前元素。
  • index
    当前元素的索引。
  • array
    调用findIndex的数组。
  let foods = ['西兰花', '西瓜', '椒盐', '剁椒']  console.log(    foods.find(v => {      return v.indexOf('椒') != -1    })  )  // 输出: 椒盐  console.log(    foods.find(v => {      return v.indexOf('花菜') != -1    })  )  // 输出: undefined

findIndex()

返回数组中满足提供的回调函数校验的第一个元素的索引,否则返回-1

回调函数会接收三个参数,分别为

  • element
    当前元素。
  • index
    当前元素的索引。
  • array
    调用findIndex的数组。
let foods = [    { name: '西兰花', color: '绿' },    { name: '辣椒', color: '红' },    { name: '花菜', color: '白' }  ]  console.log(    foods.findIndex(v => {      return v.color == '白'    })  )  // 输出: 2  console.log(    foods.findIndex(v => {      return v.color == '黄'    })  )  // 输出: -1

includes()

返回数组中是否存在指定的值,如果存在返回true,否则返回false

  let foods = ['西兰花', '西瓜', '椒盐', '剁椒']  console.log(foods.includes('西瓜'))  // 输出: true  console.log(foods.includes('花菜'))  // 输出: false

标签:console,log,foods,let,西兰花,数组,高频,梳理
来源: https://www.cnblogs.com/Code-Is-Fun/p/14840714.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有