数组 Array

| 数组n次添加相同的元素

1、对于primitives，请使用.fill let myArray = new Array(times).fill(elemnt) 2、对于non-primitives，不要使用fill，因为那时数组中的所有元素都将引用内存中的同一个对象，因此数组中一个项的突变将影响数组中的每个项。相反，在每次迭代时显式创建对象，可以用Array.from：

var fruits = Array.from(
  { length: 4 },
  () => ({ Lemon: 'Lemon' })
);
console.log(fruits);

| 关于数组对象

触发数组对象，视图更新： this.$set(‘数组变量’，index，newVal)； this.$set(‘eMsg[‘+index+’]’,false); this.arr.splice(n,1,newVal); Obiect.assign({},obj,{a:1})； 取数组中最大值：Math.max.apply(Math,arr) 取数组中最小值：Math.min.apply(Math,arr)

| 验证是否为数组

function isArray(obj) {
  return Object.prototype.toString.call(obj) === '[object Array]'
}

| 数组插入 （同样是插入数据，第二种效率高很多）

var arr = [1,2,3,4,5];
arr.push(6);
arr[arr.length] = 6;
arr.concat([6])

var arr = [1,2,3,4,5];
arr.unshift(0);
[0].concat(arr);   （unshift修改了原来的数组，而concat返回一个新的数组）

使用splice在数组中间插入是最高效的做法：
var items = ['one', 'two', 'three', 'four',"five"];
items.splice(items.length / 2, 0, 'hello');

| 数组去重

let arr = [1, 2, 2, 3]
let set = new Set(arr)
let newArr = Array.from(set) // Array.from方法可以将 Set 结构转为数组。
console.log(newArr) // [1, 2, 3]

  • 最短代码实现数组去重 [...new Set([1, "1", 2, 1, 1, 3])]

  • 数组去重 > for 循环给 obj 添加 attr，for in 遍历 obj 将属性值 push 进 arr

//过滤重复的，key判断当前对象是否重复
filter: (arry, key) => {
  let obj = {}
  arry = arry.reduce((cur, next) => {
    obj[next.key] ? '' : (obj[next.key] = true && cur.push(next))
    return cur
  }, []) //设置cur默认类型为数组，并且初始值为空的数组
  return arry
}

| 数组排序

.sort() => 参数可选，规定排序顺序。必须是函数。

[1,2,5,10].sort() => [1, 10, 2, 5]

正确排序：[1,2,5,10].sort((a, b) => a - b) => => [1, 2, 5, 10 ]

*根据数组对象中的某个属性值进行排序：sort 方法接收一个函数作为参数，这里嵌套一层函数用来接收对象属性名，其他部分代码与正常使用 sort 方法相同。

var arr = [
  { name: 'zopp', age: 0 },
  { name: 'gpp', age: 18 },
  { name: 'yjj', age: 8 },
]

function compare(property) {
  return function (a, b) {
    var value1 = a[property]
    var value2 = b[property]
    return value1 - value2
  }
}
console.log(arr.sort(compare('age')))

| 复制数组

arr = [1, 2, 3, 4]
const arr2 = [...arr]

| 获取数组末尾元素

let array = [0, 1, 2, 3, 4, 5, 6, 7]
console.log(array.slice(-1)) // >>> [7]
console.log(array.slice(-2)) // >>> [6, 7]
console.log(array.slice(-3)) // >>> [5, 6, 7]

| 数组方法

Array.reduce

语法：

array.reduce(function(accumulator, currentValue, currentIndex, array), initialValue)

accumulator：上一次调用回调返回的值，或者是提供的初始值（initialValue）

currentValue：数组中正在处理的元素

currentIndex：数据中正在处理的元素索引，如果提供了 initialValue ，从 0 开始；否则从 1 开始

array： 调用 reduce 的数组

initialValue：可选项，其值用于第一次调用 callback 的第一个参数。如果没有设置初始值，则将数组中的第一个元素作为初始值。空数组调用 reduce 时没有设置初始值将会报错。

[1,2,3,4].reduce(function(a,b,c,d){
    console.log(a,b,c,d);
    return a;
})

结果：
1 2 1 [1,2,3,4]
1 3 2 [1,2,3,4]
1 4 3 [1,2,3,4]

[1,2,3,4].reduce(function(a,b,c,d){
    console.log(a,b,c,d);
    return a+b;
})

结果：
1 2 1 [1,2,3,4]
3 3 2 [1,2,3,4]
6 4 3 [1,2,3,4]

[1,2,3,4].reduce(function(a,b,c,d){
    console.log(a,b,c,d);
    return a;
},9)

结果：
9 1 0 [1,2,3,4]
9 2 1 [1,2,3,4]
9 3 2 [1,2,3,4]
9 4 3 [1,2,3,4]


[1,2,3,4].reduce(function(a,b,c,d){
    console.log(a,b,c,d);
    return a+b;
},9)


结果：
9 1 0 [1,2,3,4]
10 2 1 [1,2,3,4]
12 3 2 [1,2,3,4]
15 4 3 [1,2,3,4]

_ findIndex() _

findIndex() 方法返回传入一个测试条件（函数）符合条件的数组第一个元素位置。

findIndex() 方法为数组中的每个元素都调用一次函数执行：

当数组中的元素在测试条件时返回 true 时, findIndex() 返回符合条件的元素的索引位置，之后的值不会再调用执行函数。 如果没有符合条件的元素返回 -1

注意:

  • findIndex() 对于空数组，函数是不会执行的。
  • findIndex() 并没有改变数组的原始值。

语法：array.findIndex(function(currentValue, index, arr), thisValue)

// 返回符合大于输入框中数字的数组索引：
var ages = [4, 12, 16, 20]
function checkAdult(age) {
  return age >= document.getElementById('ageToCheck').value
}
function myFunction() {
  document.getElementById('demo').innerHTML = ages.findIndex(checkAdult)
}

| 其他

打乱数字数组的顺序

var arr = [1, 2, 3, 4, 5, 6, 7, 'a', 'dsfs', 8, 9, 'v']
arr.sort(function () {
  return Math.random() - 0.5
})

生成从 0 到指定值的数字数组

var arr = [],
  length = 4,
  i = 1
for (; arr.push(i++) < length; ) {}
console.log(arr)

使用同一个方法处理数组和单一元素

function printUpperCase(words) {
  var elements = [].concat(words)
  for (var i = 0; i < elements.length; i++) {
    console.log(elements[i].toUpperCase())
  }
}
printUpperCase('cactus')
// => CACTUS
printUpperCase(['cactus', 'bear', 'potato'])
// => CACTUS
// BEAR
// POTATO

—– 传参的情况下，取事件对象：window.event || arguments[0].target;

展开运算符

odd = [1, 3, 5]
const nums = [2, 4, 6, ...odd]
console.log(nums) // [ 2, 4, 6, 1, 3, 5 ]

插入随机位置

const odd = [1, 3, 5]
const nums = [2, ...odd, 4, 6]

用最短的代码实现一个长度为 m(6)且值都 n(8)的数组

`Array(6).fill(8)`

取出一个数组中的最大值和最小值

`var numbers = [5, 458 , 120 , -215 , 228 , 400 , 122205, -85411]; `
`var maxInNumbers = Math.max.apply(Math, numbers); `
`var minInNumbers = Math.min.apply(Math, numbers);`

获取数组对象中某一属性值的集合

// from 方法
var user = [ { id: 1,   name: "李四"  }, {  id: 2, ame: "张三"  },  { id: 3, name: "李五" } ]
var userName = Array.from(user,({name})=>name);
console.log(userName); // ["李四", "张三", "李五"]
// map 方法
var userName = user.map((item)=>{ return item.name; })
console.log(userName); // ["李四", "张三", "李五"]
// foreach 方法
var userName = [];
user.forEach((item)=>{ userName.push(item.name); })
console.log(userName); // ["李四", "张三", "李五"]